diff --git a/.changeset/angry-lamps-notice.md b/.changeset/angry-lamps-notice.md new file mode 100644 index 00000000000..efcdc94e863 --- /dev/null +++ b/.changeset/angry-lamps-notice.md @@ -0,0 +1,6 @@ +--- +'@shopify/polaris': patch +'polaris.shopify.com': patch +--- + +[Icons] Fixed references to incorrect icon imports that were causing Storybook to break diff --git a/polaris-react/src/components/Box/Box.stories.tsx b/polaris-react/src/components/Box/Box.stories.tsx index 3f22549a1d8..b26f88c7323 100644 --- a/polaris-react/src/components/Box/Box.stories.tsx +++ b/polaris-react/src/components/Box/Box.stories.tsx @@ -1,7 +1,7 @@ import React from 'react'; import type {ComponentMeta} from '@storybook/react'; import {BlockStack, Text, Box, Icon} from '@shopify/polaris'; -import {PaintBrushIcon} from '@shopify/polaris-icons'; +import {PaintBrushFlatIcon} from '@shopify/polaris-icons'; export default { component: Box, @@ -10,7 +10,7 @@ export default { export function Default() { return ( - + ); } @@ -102,7 +102,7 @@ export function WithOutline() { outlineWidth="025" outlineColor="border" > - + - + - + - + ); @@ -136,7 +136,7 @@ export function WithOutline() { export function WithBorderRadius() { return ( - + ); } @@ -150,7 +150,7 @@ export function WithPadding() { borderWidth="050" borderColor="border-info" > - + - + - + - + - + - + - + ); @@ -213,7 +213,7 @@ export function WithResponsivePadding() { borderWidth="025" borderColor="border" > - + - + - + - + - + ); diff --git a/polaris-react/src/components/Card/Card.stories.tsx b/polaris-react/src/components/Card/Card.stories.tsx index 7722eb23aa7..744827c738b 100644 --- a/polaris-react/src/components/Card/Card.stories.tsx +++ b/polaris-react/src/components/Card/Card.stories.tsx @@ -17,7 +17,7 @@ import { ResourceList, Text, } from '@shopify/polaris'; -import {ProductsMinor} from '@shopify/polaris-icons'; +import {ProductIcon} from '@shopify/polaris-icons'; export default { component: Card, @@ -609,7 +609,7 @@ export function WithCustomReactNodeTitle() { - + New Products diff --git a/polaris-react/src/components/Filters/components/SearchField/SearchField.tsx b/polaris-react/src/components/Filters/components/SearchField/SearchField.tsx index 1ab8f92e047..036c669f89c 100644 --- a/polaris-react/src/components/Filters/components/SearchField/SearchField.tsx +++ b/polaris-react/src/components/Filters/components/SearchField/SearchField.tsx @@ -1,5 +1,5 @@ import React, {useId} from 'react'; -import {XCircleIcon} from '@shopify/polaris-icons'; +import {SearchIcon} from '@shopify/polaris-icons'; import {Spinner} from '../../../Spinner'; import {Icon} from '../../../Icon'; @@ -62,7 +62,7 @@ export function SearchField({ disabled={disabled} variant={borderlessQueryField ? 'borderless' : 'inherit'} size="slim" - prefix={mdUp ? : undefined} + prefix={mdUp ? : undefined} suffix={ loading ? (
diff --git a/polaris-react/src/components/Icon/Icon.stories.tsx b/polaris-react/src/components/Icon/Icon.stories.tsx index 9c541af67f4..aa05149f350 100644 --- a/polaris-react/src/components/Icon/Icon.stories.tsx +++ b/polaris-react/src/components/Icon/Icon.stories.tsx @@ -97,31 +97,31 @@ export function WithToneInherit() { Caution tone - + Critical tone - + Magic tone - + Magic subdued tone - + Subdued tone - + Success tone - + Text inverse tone - + ); diff --git a/polaris-react/src/components/IndexFilters/IndexFilters.stories.tsx b/polaris-react/src/components/IndexFilters/IndexFilters.stories.tsx index 36e1d454e9d..7b9b632b4c6 100644 --- a/polaris-react/src/components/IndexFilters/IndexFilters.stories.tsx +++ b/polaris-react/src/components/IndexFilters/IndexFilters.stories.tsx @@ -15,11 +15,6 @@ import { IndexFiltersMode, ButtonGroup, } from '@shopify/polaris'; -import { - ViewIcon, - DeleteIcon, - MobileVerticalDotsIcon, -} from '@shopify/polaris-icons'; import type {IndexFiltersProps} from './IndexFilters'; diff --git a/polaris-react/src/components/InlineStack/InlineStack.stories.tsx b/polaris-react/src/components/InlineStack/InlineStack.stories.tsx index a8e01601bd8..ff30cfe21b1 100644 --- a/polaris-react/src/components/InlineStack/InlineStack.stories.tsx +++ b/polaris-react/src/components/InlineStack/InlineStack.stories.tsx @@ -1,7 +1,7 @@ import React from 'react'; import type {ComponentMeta} from '@storybook/react'; import {Box, Badge, Icon, InlineStack, Thumbnail} from '@shopify/polaris'; -import {CapitalIcon, ImageIcon} from '@shopify/polaris-icons'; +import {FlowerIcon, ImageIcon} from '@shopify/polaris-icons'; export default { component: InlineStack, @@ -14,7 +14,7 @@ export function Default() { Two Three - + ); diff --git a/polaris-react/src/components/Navigation/Navigation.stories.tsx b/polaris-react/src/components/Navigation/Navigation.stories.tsx index e30a010d4b7..cab15ea2390 100644 --- a/polaris-react/src/components/Navigation/Navigation.stories.tsx +++ b/polaris-react/src/components/Navigation/Navigation.stories.tsx @@ -6,7 +6,7 @@ import { PlusCircleIcon, PersonIcon, HomeIcon, - LogOutIcon, + ExitIcon, TargetIcon, StoreOnlineIcon, OrderIcon, @@ -15,10 +15,10 @@ import { ViewIcon, StarFilledIcon, StarIcon, - OrdersFilledIcon, + OrderFilledIcon, HomeFilledIcon, - ProductsFilledIcon, - MarketingFilledIcon, + ProductFilledIcon, + TargetFilledIcon, } from '@shopify/polaris-icons'; export default { @@ -102,7 +102,7 @@ export function WithMultipleSecondaryNavigations() { { url: '#', label: 'Orders', - icon: OrdersFilledIcon, + icon: OrderFilledIcon, matchedItemIcon: OrderIcon, badge: '15', onClick: () => setSelected('orders'), @@ -127,7 +127,7 @@ export function WithMultipleSecondaryNavigations() { { url: '#', label: 'Products', - icon: ProductsFilledIcon, + icon: ProductFilledIcon, matchedItemIcon: ProductIcon, onClick: () => setSelected('products'), matches: selected === 'products', @@ -177,7 +177,7 @@ export function WithMultipleSecondaryNavigations() { { url: '#', label: 'Marketing', - icon: MarketingFilledIcon, + icon: TargetFilledIcon, matchedItemIcon: TargetIcon, onClick: () => setSelected('marketing'), matches: selected === 'marketing', @@ -644,7 +644,7 @@ export function WithMultipleSecondaryActionsForAnItem() { url: '#', excludePaths: ['#'], label: 'Logout', - icon: LogOutIcon, + icon: ExitIcon, onClick: () => setSelected('logout'), matches: selected === 'logout', }, diff --git a/polaris-react/src/components/Page/Page.stories.tsx b/polaris-react/src/components/Page/Page.stories.tsx index 963f0d3caf7..6faf52c45bb 100644 --- a/polaris-react/src/components/Page/Page.stories.tsx +++ b/polaris-react/src/components/Page/Page.stories.tsx @@ -6,7 +6,7 @@ import { ArrowDownIcon, ExternalIcon, ViewIcon, - MobileVerticalDotsIcon, + MenuVerticalIcon, } from '@shopify/polaris-icons'; import { Badge, @@ -47,7 +47,7 @@ export function Default() { actionGroups={[ { title: 'Promote', - icon: MobileVerticalDotsIcon, + icon: MenuVerticalIcon, actions: [ { content: 'Share on Facebook', diff --git a/polaris.shopify.com/content/design/colors/using-color.mdx b/polaris.shopify.com/content/design/colors/using-color.mdx index fb82fbdf2ae..b8b055c8fd5 100644 --- a/polaris.shopify.com/content/design/colors/using-color.mdx +++ b/polaris.shopify.com/content/design/colors/using-color.mdx @@ -5,7 +5,7 @@ description: Color highlights important areas, communicates status, urgency, and keywords: - using color - color use -icon: PaintBrushIcon +icon: PaintBrushFlatIcon --- # Color → {frontmatter.title} diff --git a/polaris.shopify.com/content/design/icons/using-icons.mdx b/polaris.shopify.com/content/design/icons/using-icons.mdx index 35192fcadb6..7b53a87481a 100644 --- a/polaris.shopify.com/content/design/icons/using-icons.mdx +++ b/polaris.shopify.com/content/design/icons/using-icons.mdx @@ -1,7 +1,7 @@ --- title: Using icons description: Icons enhance an experience by providing intuitive and efficient navigation, conveying information concisely, and making it more visually appealing. -icon: PaintBrushIcon +icon: PaintBrushFlatIcon keywords: - shopify icons - icon sets diff --git a/polaris.shopify.com/content/design/index.mdx b/polaris.shopify.com/content/design/index.mdx index 86e1947c34e..ef6d8c30e01 100644 --- a/polaris.shopify.com/content/design/index.mdx +++ b/polaris.shopify.com/content/design/index.mdx @@ -3,7 +3,7 @@ title: Design description: Design principles serve as guiding notions that shape the design of the Shopify admin, with Polaris providing support in implementing these principles effectively. order: 3 status: New -icon: PaintBrushIcon +icon: PaintBrushFlatIcon --- # {frontmatter.title} diff --git a/polaris.shopify.com/content/design/pro-design-language.mdx b/polaris.shopify.com/content/design/pro-design-language.mdx index 79fcfc2257b..ec80829816a 100644 --- a/polaris.shopify.com/content/design/pro-design-language.mdx +++ b/polaris.shopify.com/content/design/pro-design-language.mdx @@ -2,7 +2,7 @@ title: Pro design language description: Efficiency, intuition, and style combined to empower merchants with data-rich views, action-driven interfaces, and dynamic interactions. order: 1 -icon: PaintBrushIcon +icon: PaintBrushFlatIcon status: New ---