npm - @mirohq/design-system-chip - Versions diffs - 1.3.0-filter-chip.1 → 1.3.1 - Mend

@mirohq/design-system-chip 1.3.0-filter-chip.1 → 1.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/dist/main.js CHANGED Viewed

@@ -9,7 +9,7 @@ var designSystemPrimitive = require('@mirohq/design-system-primitive');
 var designSystemBaseButton = require('@mirohq/design-system-base-button');
 var designSystemStyles = require('@mirohq/design-system-styles');
-const StyledImageSlot = designSystemStitches.styled(designSystemPrimitive.Primitive.span, {
+const StyledIconSlot = designSystemStitches.styled(designSystemPrimitive.Primitive.span, {
   display: "inline-flex",
   alignItems: "center",
   justifyContent: "center",
@@ -25,8 +25,8 @@ const StyledImageSlot = designSystemStitches.styled(designSystemPrimitive.Primit
 });
 const LABEL_OFFSET = 2;
-const imageSlotImg = (size) => ({
-  ["& ".concat(StyledImageSlot, " img")]: {
+const iconSlotImg = (size) => ({
+  ["& ".concat(StyledIconSlot, " img")]: {
     square: size
   }
 });
@@ -34,6 +34,8 @@ const chipLayout = {
   borderRadius: "$round",
   display: "inline-flex",
   alignItems: "center",
+  // Gap, not close-button padding — padding sits inside the focus ring.
+  gap: "$100",
   width: "fit-content",
   maxWidth: "100%",
   flexShrink: 0,
@@ -49,25 +51,25 @@ const chipSizes = {
     height: "$12",
     fontSize: "$200",
     paddingX: "calc($200 + ".concat(LABEL_OFFSET, "px)"),
-    ...imageSlotImg("$8")
+    ...iconSlotImg("$8")
   },
   large: {
     height: "$10",
     fontSize: "$200",
     paddingX: "calc($150 + ".concat(LABEL_OFFSET, "px)"),
-    ...imageSlotImg("$6")
+    ...iconSlotImg("$6")
   },
   medium: {
     height: "$8",
     fontSize: "$175",
     paddingX: "calc($100 + ".concat(LABEL_OFFSET, "px)"),
-    ...imageSlotImg("$5")
+    ...iconSlotImg("$5")
   },
   small: {
     height: "$6",
     fontSize: "$175",
     paddingX: "calc($100 + ".concat(LABEL_OFFSET, "px)"),
-    ...imageSlotImg("$4")
+    ...iconSlotImg("$4")
   }
 };
 const defaultIdle = {
@@ -212,8 +214,6 @@ const StyledSpinnerBox = designSystemStitches.styled(designSystemPrimitive.Primi
   zIndex: 1
 });
 const StyledChipButton = designSystemStitches.styled(designSystemBaseButton.BaseButton, {
-  // Figma Chip: spacing-100 before the close glyph, not container gap.
-  paddingInlineStart: "$100",
   flexShrink: 0,
   color: "$icon-secondary",
   ...designSystemStyles.focus.css({
@@ -221,7 +221,7 @@ const StyledChipButton = designSystemStitches.styled(designSystemBaseButton.Base
   })
 });
-const ImageSlot = StyledImageSlot;
+const IconSlot = StyledIconSlot;
 const hasPressEvent = (props) => {
   if ("onClick" in props && props.onClick != null) return true;
@@ -304,7 +304,7 @@ const Chip = React.forwardRef(
     );
   }
 );
-Chip.ImageSlot = ImageSlot;
+Chip.IconSlot = IconSlot;
 exports.Chip = Chip;
 //# sourceMappingURL=main.js.map

package/dist/main.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"main.js","sources":["../src/partials/image-icon.styled.tsx","../src/chip.styled.tsx","../src/partials/image-slot.tsx","../src/chip.tsx"],"sourcesContent":["import type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledImageSlot = styled(Primitive.span, {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n verticalAlign: 'middle',\n paddingInline: '$50',\n '& img': {\n display: 'block',\n square: 16,\n borderRadius: '$round',\n objectFit: 'cover',\n },\n})\n\nexport type StyledImageSlotProps = StrictComponentProps<typeof StyledImageSlot>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { CSS, StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { BaseButton } from '@mirohq/design-system-base-button'\nimport { focus } from '@mirohq/design-system-styles'\n\nimport { StyledImageSlot } from './partials/image-icon.styled'\n\n// Same offset Button uses so paddingX matches that scale without importing it.\nconst LABEL_OFFSET = 2\n\nconst imageSlotImg = (size: string): CSS => ({\n [`& ${StyledImageSlot} img`]: {\n square: size,\n },\n})\n\nconst chipLayout = {\n borderRadius: '$round',\n display: 'inline-flex',\n alignItems: 'center',\n width: 'fit-content',\n maxWidth: '100%',\n flexShrink: 0,\n boxSizing: 'border-box',\n border: '1px solid transparent',\n lineHeight: 1.3,\n // Chip labels are regular. Pressable uses BaseButton; don't keep Button's\n // semibold from that shell.\n fontWeight: '$regular',\n}\n\n// Copied from Button's size variant (same tokens and padding formula), not\n// imported — Chip owns this scale so Button can change independently.\nconst chipSizes = {\n 'x-large': {\n height: '$12',\n fontSize: '$200',\n paddingX: `calc($200 + ${LABEL_OFFSET}px)`,\n ...imageSlotImg('$8'),\n },\n large: {\n height: '$10',\n fontSize: '$200',\n paddingX: `calc($150 + ${LABEL_OFFSET}px)`,\n ...imageSlotImg('$6'),\n },\n medium: {\n height: '$8',\n fontSize: '$175',\n paddingX: `calc($100 + ${LABEL_OFFSET}px)`,\n ...imageSlotImg('$5'),\n },\n small: {\n height: '$6',\n fontSize: '$175',\n paddingX: `calc($100 + ${LABEL_OFFSET}px)`,\n ...imageSlotImg('$4'),\n },\n}\n\n// Hover and pressed only belong on the pressable shell.\nconst defaultIdle = {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default',\n borderColor: '$chip-border-default',\n}\n\nconst outlineIdle = {\n color: '$chip-text-on-outline',\n backgroundColor: '$transparent',\n borderColor: '$chip-border-outline',\n}\n\nconst defaultInteractive = {\n ...defaultIdle,\n _hover: {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default-hover',\n borderColor: '$chip-border-default-hover',\n },\n '&[data-pressed]': {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default-pressed',\n borderColor: '$chip-border-default',\n },\n // Attribute selector so `disabled` reaches BaseButton / usePress.\n '&[disabled]': {\n backgroundColor: '$background-disabled',\n color: '$text-on-disabled',\n },\n}\n\nconst outlineInteractive = {\n ...outlineIdle,\n _hover: {\n backgroundColor: '$chip-background-outline-hover',\n borderColor: '$chip-border-outline-hover',\n color: '$chip-text-on-outline',\n },\n '&[data-pressed]': {\n backgroundColor: '$chip-background-outline-pressed',\n borderColor: '$chip-border-outline-pressed',\n color: '$chip-text-on-outline',\n },\n '&[disabled]': {\n backgroundColor: '$transparent',\n borderColor: '$border-disabled',\n color: '$text-disabled',\n },\n}\n\nexport const StyledChip = styled(Primitive.div, {\n ...chipLayout,\n variants: {\n variant: {\n default: defaultIdle,\n outline: outlineIdle,\n },\n disabled: {\n true: {},\n },\n size: chipSizes,\n },\n compoundVariants: [\n {\n variant: 'default',\n disabled: true,\n css: {\n backgroundColor: '$background-disabled',\n color: '$text-on-disabled',\n '& button': {\n color: '$icon-on-disabled',\n },\n },\n },\n {\n variant: 'outline',\n disabled: true,\n css: {\n backgroundColor: '$transparent',\n borderColor: '$border-disabled',\n color: '$text-disabled',\n '& button': {\n color: '$icon-disabled',\n },\n },\n },\n ],\n defaultVariants: {\n variant: 'default',\n size: 'medium',\n },\n})\n\nexport const StyledPressableChip = styled(BaseButton, {\n ...chipLayout,\n position: 'relative',\n ...focus.css({\n boxShadow: '$focus',\n }),\n // Loading stays visually idle — only the wait cursor signals it. Don't reuse\n // the disabled mute; that made loading look broken.\n '&[aria-busy=\"true\"]': {\n cursor: 'wait',\n pointerEvents: 'none',\n },\n variants: {\n variant: {\n default: defaultInteractive,\n outline: outlineInteractive,\n },\n size: chipSizes,\n },\n defaultVariants: {\n variant: 'default',\n size: 'medium',\n },\n})\n\nexport const StyledChipContent = styled(Primitive.div, {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n // Taller than the em box so descenders (g, y) aren't clipped by overflow.\n lineHeight: 1.3,\n minWidth: 0,\n display: 'flex',\n alignItems: 'center',\n variants: {\n loading: {\n true: {\n opacity: 0,\n },\n },\n },\n})\n\nexport const StyledSpinnerBox = styled(Primitive.div, {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n margin: 'auto',\n zIndex: 1,\n})\n\nexport const StyledChipButton = styled(BaseButton, {\n // Figma Chip: spacing-100 before the close glyph, not container gap.\n paddingInlineStart: '$100',\n flexShrink: 0,\n color: '$icon-secondary',\n ...focus.css({\n boxShadow: '$focus',\n }),\n})\n\nexport type StyledChipProps = StrictComponentProps<typeof StyledChip>\n","import type { StyledImageSlotProps } from './image-icon.styled'\nimport { StyledImageSlot } from './image-icon.styled'\n\nexport interface ImageSlotProps extends StyledImageSlotProps {}\n\nexport const ImageSlot = StyledImageSlot\n","import React from 'react'\nimport type {\n ElementRef,\n ForwardRefExoticComponent,\n RefAttributes,\n} from 'react'\nimport type { BaseButtonProps } from '@mirohq/design-system-base-button'\nimport { IconCross } from '@mirohq/design-system-icons'\nimport { Spinner } from '@mirohq/design-system-spinner'\nimport type { SpinnerProps } from '@mirohq/design-system-spinner'\n\nimport {\n StyledChip,\n StyledChipButton,\n StyledChipContent,\n StyledPressableChip,\n StyledSpinnerBox,\n} from './chip.styled'\nimport type { StyledChipProps } from './chip.styled'\nimport { ImageSlot } from './partials/image-slot'\n\nexport type ChipProps = Omit<\n StyledChipProps,\n 'ref' \| 'size' \| 'variant' \| 'disabled'\n> &\n Pick<BaseButtonProps, 'onPress'> &\n RefAttributes<HTMLDivElement \| HTMLButtonElement> & {\n /*\n Change the chip size. Same scale as Button (`small`, `medium`, `large`,\n * `x-large`).\n * @default 'medium'\n /\n size?: StyledChipProps['size']\n /\n Change the chip style. `default` is filled; `outline` is bordered.\n * @default 'default'\n /\n variant?: StyledChipProps['variant']\n /\n Disable the chip. When removable, the close control is disabled too.\n /\n disabled?: boolean\n /\n Show a button to remove the Chip\n * @default true\n /\n removable?: boolean\n /\n Show a spinner overlay and keep the chip non-interactive without the\n * disabled look. Pressable only.\n * @default false\n /\n loading?: boolean\n } & (\n \| {\n /\n Event handler called when the chip's remove button is clicked.\n /\n onRemove: (\n event: React.MouseEvent<HTMLButtonElement, MouseEvent>\n ) => void\n /\n Remove button label to make the button recognizable by the screen readers.\n */\n removeAriaLabel: string\n }\n \| { removable: false; removeAriaLabel?: never; onRemove?: never }\n )\n\nconst hasPressEvent = (props: object): boolean => {\n if ('onClick' in props && props.onClick != null) return true\n if ('onPress' in props && props.onPress != null) return true\n\n return false\n}\n\nexport const Chip = React.forwardRef<ElementRef<'div' \| 'button'>, ChipProps>(\n (props, forwardRef) => {\n const {\n children,\n removable = true,\n onRemove,\n removeAriaLabel,\n loading = false,\n size = 'medium',\n variant = 'default',\n disabled,\n ...restProps\n } = props\n\n const pressable = hasPressEvent(restProps)\n const isLoading = pressable && loading\n\n let spinnerSize: SpinnerProps['size'] = 'medium'\n\n if (typeof size === 'string' && ['small', 'medium'].includes(size)) {\n spinnerSize = 'small'\n }\n\n const content = (\n <>\n {isLoading && (\n <StyledSpinnerBox\n aria-hidden\n data-testid={\n process.env.NODE_ENV === 'test' ? 'chip-spinner' : undefined\n }\n >\n <Spinner size={spinnerSize} />\n </StyledSpinnerBox>\n )}\n <StyledChipContent\n data-chip-content=''\n loading={isLoading \|\| undefined}\n >\n {children}\n </StyledChipContent>\n {!pressable && removable && (\n <StyledChipButton\n type='button'\n disabled={disabled === true \|\| undefined}\n onClick={onRemove}\n aria-label={removeAriaLabel}\n >\n <IconCross size='small' />\n </StyledChipButton>\n )}\n </>\n )\n\n if (pressable) {\n return (\n <StyledPressableChip\n type='button'\n {...(restProps as BaseButtonProps)}\n size={size}\n variant={variant}\n disabled={disabled === true \|\| undefined}\n ref={forwardRef as React.Ref<ElementRef<typeof StyledPressableChip>>}\n aria-busy={isLoading \|\| undefined}\n aria-disabled={isLoading \|\| undefined}\n >\n {content}\n </StyledPressableChip>\n )\n }\n\n return (\n <StyledChip\n {...(restProps as StyledChipProps)}\n size={size}\n variant={variant}\n disabled={disabled}\n ref={forwardRef as React.Ref<ElementRef<typeof StyledChip>>}\n >\n {content}\n </StyledChip>\n )\n }\n) as ForwardRefExoticComponent<ChipProps> & Partials\n\nexport interface Partials {\n ImageSlot: typeof ImageSlot\n}\n\nChip.ImageSlot = ImageSlot\n"],"names":["styled","Primitive","BaseButton","focus","jsxs","Fragment","jsx","Spinner","IconCross"],"mappings":"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"}
1	+ {"version":3,"file":"main.js","sources":["../src/partials/icon-slot.styled.tsx","../src/chip.styled.tsx","../src/partials/icon-slot.tsx","../src/chip.tsx"],"sourcesContent":["import type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledIconSlot = styled(Primitive.span, {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n verticalAlign: 'middle',\n paddingInline: '$50',\n '& img': {\n display: 'block',\n square: 16,\n borderRadius: '$round',\n objectFit: 'cover',\n },\n})\n\nexport type StyledIconSlotProps = StrictComponentProps<typeof StyledIconSlot>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { CSS, StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { BaseButton } from '@mirohq/design-system-base-button'\nimport { focus } from '@mirohq/design-system-styles'\n\nimport { StyledIconSlot } from './partials/icon-slot.styled'\n\n// Same offset Button uses so paddingX matches that scale without importing it.\nconst LABEL_OFFSET = 2\n\nconst iconSlotImg = (size: string): CSS => ({\n [`& ${StyledIconSlot} img`]: {\n square: size,\n },\n})\n\nconst chipLayout = {\n borderRadius: '$round',\n display: 'inline-flex',\n alignItems: 'center',\n // Gap, not close-button padding — padding sits inside the focus ring.\n gap: '$100',\n width: 'fit-content',\n maxWidth: '100%',\n flexShrink: 0,\n boxSizing: 'border-box',\n border: '1px solid transparent',\n lineHeight: 1.3,\n // Chip labels are regular. Pressable uses BaseButton; don't keep Button's\n // semibold from that shell.\n fontWeight: '$regular',\n}\n\n// Copied from Button's size variant (same tokens and padding formula), not\n// imported — Chip owns this scale so Button can change independently.\nconst chipSizes = {\n 'x-large': {\n height: '$12',\n fontSize: '$200',\n paddingX: `calc($200 + ${LABEL_OFFSET}px)`,\n ...iconSlotImg('$8'),\n },\n large: {\n height: '$10',\n fontSize: '$200',\n paddingX: `calc($150 + ${LABEL_OFFSET}px)`,\n ...iconSlotImg('$6'),\n },\n medium: {\n height: '$8',\n fontSize: '$175',\n paddingX: `calc($100 + ${LABEL_OFFSET}px)`,\n ...iconSlotImg('$5'),\n },\n small: {\n height: '$6',\n fontSize: '$175',\n paddingX: `calc($100 + ${LABEL_OFFSET}px)`,\n ...iconSlotImg('$4'),\n },\n}\n\n// Hover and pressed only belong on the pressable shell.\nconst defaultIdle = {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default',\n borderColor: '$chip-border-default',\n}\n\nconst outlineIdle = {\n color: '$chip-text-on-outline',\n backgroundColor: '$transparent',\n borderColor: '$chip-border-outline',\n}\n\nconst defaultInteractive = {\n ...defaultIdle,\n _hover: {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default-hover',\n borderColor: '$chip-border-default-hover',\n },\n '&[data-pressed]': {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default-pressed',\n borderColor: '$chip-border-default',\n },\n // Attribute selector so `disabled` reaches BaseButton / usePress.\n '&[disabled]': {\n backgroundColor: '$background-disabled',\n color: '$text-on-disabled',\n },\n}\n\nconst outlineInteractive = {\n ...outlineIdle,\n _hover: {\n backgroundColor: '$chip-background-outline-hover',\n borderColor: '$chip-border-outline-hover',\n color: '$chip-text-on-outline',\n },\n '&[data-pressed]': {\n backgroundColor: '$chip-background-outline-pressed',\n borderColor: '$chip-border-outline-pressed',\n color: '$chip-text-on-outline',\n },\n '&[disabled]': {\n backgroundColor: '$transparent',\n borderColor: '$border-disabled',\n color: '$text-disabled',\n },\n}\n\nexport const StyledChip = styled(Primitive.div, {\n ...chipLayout,\n variants: {\n variant: {\n default: defaultIdle,\n outline: outlineIdle,\n },\n disabled: {\n true: {},\n },\n size: chipSizes,\n },\n compoundVariants: [\n {\n variant: 'default',\n disabled: true,\n css: {\n backgroundColor: '$background-disabled',\n color: '$text-on-disabled',\n '& button': {\n color: '$icon-on-disabled',\n },\n },\n },\n {\n variant: 'outline',\n disabled: true,\n css: {\n backgroundColor: '$transparent',\n borderColor: '$border-disabled',\n color: '$text-disabled',\n '& button': {\n color: '$icon-disabled',\n },\n },\n },\n ],\n defaultVariants: {\n variant: 'default',\n size: 'medium',\n },\n})\n\nexport const StyledPressableChip = styled(BaseButton, {\n ...chipLayout,\n position: 'relative',\n ...focus.css({\n boxShadow: '$focus',\n }),\n // Loading stays visually idle — only the wait cursor signals it. Don't reuse\n // the disabled mute; that made loading look broken.\n '&[aria-busy=\"true\"]': {\n cursor: 'wait',\n pointerEvents: 'none',\n },\n variants: {\n variant: {\n default: defaultInteractive,\n outline: outlineInteractive,\n },\n size: chipSizes,\n },\n defaultVariants: {\n variant: 'default',\n size: 'medium',\n },\n})\n\nexport const StyledChipContent = styled(Primitive.div, {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n // Taller than the em box so descenders (g, y) aren't clipped by overflow.\n lineHeight: 1.3,\n minWidth: 0,\n display: 'flex',\n alignItems: 'center',\n variants: {\n loading: {\n true: {\n opacity: 0,\n },\n },\n },\n})\n\nexport const StyledSpinnerBox = styled(Primitive.div, {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n margin: 'auto',\n zIndex: 1,\n})\n\nexport const StyledChipButton = styled(BaseButton, {\n flexShrink: 0,\n color: '$icon-secondary',\n ...focus.css({\n boxShadow: '$focus',\n }),\n})\n\nexport type StyledChipProps = StrictComponentProps<typeof StyledChip>\n","import type { StyledIconSlotProps } from './icon-slot.styled'\nimport { StyledIconSlot } from './icon-slot.styled'\n\nexport interface IconSlotProps extends StyledIconSlotProps {}\n\nexport const IconSlot = StyledIconSlot\n","import React from 'react'\nimport type {\n ElementRef,\n ForwardRefExoticComponent,\n RefAttributes,\n} from 'react'\nimport type { BaseButtonProps } from '@mirohq/design-system-base-button'\nimport { IconCross } from '@mirohq/design-system-icons'\nimport { Spinner } from '@mirohq/design-system-spinner'\nimport type { SpinnerProps } from '@mirohq/design-system-spinner'\n\nimport {\n StyledChip,\n StyledChipButton,\n StyledChipContent,\n StyledPressableChip,\n StyledSpinnerBox,\n} from './chip.styled'\nimport type { StyledChipProps } from './chip.styled'\nimport { IconSlot } from './partials/icon-slot'\n\nexport type ChipProps = Omit<\n StyledChipProps,\n 'ref' \| 'size' \| 'variant' \| 'disabled'\n> &\n Pick<BaseButtonProps, 'onPress'> &\n RefAttributes<HTMLDivElement \| HTMLButtonElement> & {\n /*\n Change the chip size. Same scale as Button (`small`, `medium`, `large`,\n * `x-large`).\n * @default 'medium'\n /\n size?: StyledChipProps['size']\n /\n Change the chip style. `default` is filled; `outline` is bordered.\n * @default 'default'\n /\n variant?: StyledChipProps['variant']\n /\n Disable the chip. When removable, the close control is disabled too.\n /\n disabled?: boolean\n /\n Show a button to remove the Chip\n * @default true\n /\n removable?: boolean\n /\n Show a spinner overlay and keep the chip non-interactive without the\n * disabled look. Pressable only.\n * @default false\n /\n loading?: boolean\n } & (\n \| {\n /\n Event handler called when the chip's remove button is clicked.\n /\n onRemove: (\n event: React.MouseEvent<HTMLButtonElement, MouseEvent>\n ) => void\n /\n Remove button label to make the button recognizable by the screen readers.\n */\n removeAriaLabel: string\n }\n \| { removable: false; removeAriaLabel?: never; onRemove?: never }\n )\n\nconst hasPressEvent = (props: object): boolean => {\n if ('onClick' in props && props.onClick != null) return true\n if ('onPress' in props && props.onPress != null) return true\n\n return false\n}\n\nexport const Chip = React.forwardRef<ElementRef<'div' \| 'button'>, ChipProps>(\n (props, forwardRef) => {\n const {\n children,\n removable = true,\n onRemove,\n removeAriaLabel,\n loading = false,\n size = 'medium',\n variant = 'default',\n disabled,\n ...restProps\n } = props\n\n const pressable = hasPressEvent(restProps)\n const isLoading = pressable && loading\n\n let spinnerSize: SpinnerProps['size'] = 'medium'\n\n if (typeof size === 'string' && ['small', 'medium'].includes(size)) {\n spinnerSize = 'small'\n }\n\n const content = (\n <>\n {isLoading && (\n <StyledSpinnerBox\n aria-hidden\n data-testid={\n process.env.NODE_ENV === 'test' ? 'chip-spinner' : undefined\n }\n >\n <Spinner size={spinnerSize} />\n </StyledSpinnerBox>\n )}\n <StyledChipContent\n data-chip-content=''\n loading={isLoading \|\| undefined}\n >\n {children}\n </StyledChipContent>\n {!pressable && removable && (\n <StyledChipButton\n type='button'\n disabled={disabled === true \|\| undefined}\n onClick={onRemove}\n aria-label={removeAriaLabel}\n >\n <IconCross size='small' />\n </StyledChipButton>\n )}\n </>\n )\n\n if (pressable) {\n return (\n <StyledPressableChip\n type='button'\n {...(restProps as BaseButtonProps)}\n size={size}\n variant={variant}\n disabled={disabled === true \|\| undefined}\n ref={forwardRef as React.Ref<ElementRef<typeof StyledPressableChip>>}\n aria-busy={isLoading \|\| undefined}\n aria-disabled={isLoading \|\| undefined}\n >\n {content}\n </StyledPressableChip>\n )\n }\n\n return (\n <StyledChip\n {...(restProps as StyledChipProps)}\n size={size}\n variant={variant}\n disabled={disabled}\n ref={forwardRef as React.Ref<ElementRef<typeof StyledChip>>}\n >\n {content}\n </StyledChip>\n )\n }\n) as ForwardRefExoticComponent<ChipProps> & Partials\n\nexport interface Partials {\n IconSlot: typeof IconSlot\n}\n\nChip.IconSlot = IconSlot\n"],"names":["styled","Primitive","BaseButton","focus","jsxs","Fragment","jsx","Spinner","IconCross"],"mappings":"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"}

package/dist/module.js CHANGED Viewed

@@ -7,7 +7,7 @@ import { Primitive } from '@mirohq/design-system-primitive';
 import { BaseButton } from '@mirohq/design-system-base-button';
 import { focus } from '@mirohq/design-system-styles';
-const StyledImageSlot = styled(Primitive.span, {
+const StyledIconSlot = styled(Primitive.span, {
   display: "inline-flex",
   alignItems: "center",
   justifyContent: "center",
@@ -23,8 +23,8 @@ const StyledImageSlot = styled(Primitive.span, {
 });
 const LABEL_OFFSET = 2;
-const imageSlotImg = (size) => ({
-  ["& ".concat(StyledImageSlot, " img")]: {
+const iconSlotImg = (size) => ({
+  ["& ".concat(StyledIconSlot, " img")]: {
     square: size
   }
 });
@@ -32,6 +32,8 @@ const chipLayout = {
   borderRadius: "$round",
   display: "inline-flex",
   alignItems: "center",
+  // Gap, not close-button padding — padding sits inside the focus ring.
+  gap: "$100",
   width: "fit-content",
   maxWidth: "100%",
   flexShrink: 0,
@@ -47,25 +49,25 @@ const chipSizes = {
     height: "$12",
     fontSize: "$200",
     paddingX: "calc($200 + ".concat(LABEL_OFFSET, "px)"),
-    ...imageSlotImg("$8")
+    ...iconSlotImg("$8")
   },
   large: {
     height: "$10",
     fontSize: "$200",
     paddingX: "calc($150 + ".concat(LABEL_OFFSET, "px)"),
-    ...imageSlotImg("$6")
+    ...iconSlotImg("$6")
   },
   medium: {
     height: "$8",
     fontSize: "$175",
     paddingX: "calc($100 + ".concat(LABEL_OFFSET, "px)"),
-    ...imageSlotImg("$5")
+    ...iconSlotImg("$5")
   },
   small: {
     height: "$6",
     fontSize: "$175",
     paddingX: "calc($100 + ".concat(LABEL_OFFSET, "px)"),
-    ...imageSlotImg("$4")
+    ...iconSlotImg("$4")
   }
 };
 const defaultIdle = {
@@ -210,8 +212,6 @@ const StyledSpinnerBox = styled(Primitive.div, {
   zIndex: 1
 });
 const StyledChipButton = styled(BaseButton, {
-  // Figma Chip: spacing-100 before the close glyph, not container gap.
-  paddingInlineStart: "$100",
   flexShrink: 0,
   color: "$icon-secondary",
   ...focus.css({
@@ -219,7 +219,7 @@ const StyledChipButton = styled(BaseButton, {
   })
 });
-const ImageSlot = StyledImageSlot;
+const IconSlot = StyledIconSlot;
 const hasPressEvent = (props) => {
   if ("onClick" in props && props.onClick != null) return true;
@@ -302,7 +302,7 @@ const Chip = React.forwardRef(
     );
   }
 );
-Chip.ImageSlot = ImageSlot;
+Chip.IconSlot = IconSlot;
 export { Chip };
 //# sourceMappingURL=module.js.map

package/dist/module.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"module.js","sources":["../src/partials/image-icon.styled.tsx","../src/chip.styled.tsx","../src/partials/image-slot.tsx","../src/chip.tsx"],"sourcesContent":["import type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledImageSlot = styled(Primitive.span, {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n verticalAlign: 'middle',\n paddingInline: '$50',\n '& img': {\n display: 'block',\n square: 16,\n borderRadius: '$round',\n objectFit: 'cover',\n },\n})\n\nexport type StyledImageSlotProps = StrictComponentProps<typeof StyledImageSlot>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { CSS, StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { BaseButton } from '@mirohq/design-system-base-button'\nimport { focus } from '@mirohq/design-system-styles'\n\nimport { StyledImageSlot } from './partials/image-icon.styled'\n\n// Same offset Button uses so paddingX matches that scale without importing it.\nconst LABEL_OFFSET = 2\n\nconst imageSlotImg = (size: string): CSS => ({\n [`& ${StyledImageSlot} img`]: {\n square: size,\n },\n})\n\nconst chipLayout = {\n borderRadius: '$round',\n display: 'inline-flex',\n alignItems: 'center',\n width: 'fit-content',\n maxWidth: '100%',\n flexShrink: 0,\n boxSizing: 'border-box',\n border: '1px solid transparent',\n lineHeight: 1.3,\n // Chip labels are regular. Pressable uses BaseButton; don't keep Button's\n // semibold from that shell.\n fontWeight: '$regular',\n}\n\n// Copied from Button's size variant (same tokens and padding formula), not\n// imported — Chip owns this scale so Button can change independently.\nconst chipSizes = {\n 'x-large': {\n height: '$12',\n fontSize: '$200',\n paddingX: `calc($200 + ${LABEL_OFFSET}px)`,\n ...imageSlotImg('$8'),\n },\n large: {\n height: '$10',\n fontSize: '$200',\n paddingX: `calc($150 + ${LABEL_OFFSET}px)`,\n ...imageSlotImg('$6'),\n },\n medium: {\n height: '$8',\n fontSize: '$175',\n paddingX: `calc($100 + ${LABEL_OFFSET}px)`,\n ...imageSlotImg('$5'),\n },\n small: {\n height: '$6',\n fontSize: '$175',\n paddingX: `calc($100 + ${LABEL_OFFSET}px)`,\n ...imageSlotImg('$4'),\n },\n}\n\n// Hover and pressed only belong on the pressable shell.\nconst defaultIdle = {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default',\n borderColor: '$chip-border-default',\n}\n\nconst outlineIdle = {\n color: '$chip-text-on-outline',\n backgroundColor: '$transparent',\n borderColor: '$chip-border-outline',\n}\n\nconst defaultInteractive = {\n ...defaultIdle,\n _hover: {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default-hover',\n borderColor: '$chip-border-default-hover',\n },\n '&[data-pressed]': {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default-pressed',\n borderColor: '$chip-border-default',\n },\n // Attribute selector so `disabled` reaches BaseButton / usePress.\n '&[disabled]': {\n backgroundColor: '$background-disabled',\n color: '$text-on-disabled',\n },\n}\n\nconst outlineInteractive = {\n ...outlineIdle,\n _hover: {\n backgroundColor: '$chip-background-outline-hover',\n borderColor: '$chip-border-outline-hover',\n color: '$chip-text-on-outline',\n },\n '&[data-pressed]': {\n backgroundColor: '$chip-background-outline-pressed',\n borderColor: '$chip-border-outline-pressed',\n color: '$chip-text-on-outline',\n },\n '&[disabled]': {\n backgroundColor: '$transparent',\n borderColor: '$border-disabled',\n color: '$text-disabled',\n },\n}\n\nexport const StyledChip = styled(Primitive.div, {\n ...chipLayout,\n variants: {\n variant: {\n default: defaultIdle,\n outline: outlineIdle,\n },\n disabled: {\n true: {},\n },\n size: chipSizes,\n },\n compoundVariants: [\n {\n variant: 'default',\n disabled: true,\n css: {\n backgroundColor: '$background-disabled',\n color: '$text-on-disabled',\n '& button': {\n color: '$icon-on-disabled',\n },\n },\n },\n {\n variant: 'outline',\n disabled: true,\n css: {\n backgroundColor: '$transparent',\n borderColor: '$border-disabled',\n color: '$text-disabled',\n '& button': {\n color: '$icon-disabled',\n },\n },\n },\n ],\n defaultVariants: {\n variant: 'default',\n size: 'medium',\n },\n})\n\nexport const StyledPressableChip = styled(BaseButton, {\n ...chipLayout,\n position: 'relative',\n ...focus.css({\n boxShadow: '$focus',\n }),\n // Loading stays visually idle — only the wait cursor signals it. Don't reuse\n // the disabled mute; that made loading look broken.\n '&[aria-busy=\"true\"]': {\n cursor: 'wait',\n pointerEvents: 'none',\n },\n variants: {\n variant: {\n default: defaultInteractive,\n outline: outlineInteractive,\n },\n size: chipSizes,\n },\n defaultVariants: {\n variant: 'default',\n size: 'medium',\n },\n})\n\nexport const StyledChipContent = styled(Primitive.div, {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n // Taller than the em box so descenders (g, y) aren't clipped by overflow.\n lineHeight: 1.3,\n minWidth: 0,\n display: 'flex',\n alignItems: 'center',\n variants: {\n loading: {\n true: {\n opacity: 0,\n },\n },\n },\n})\n\nexport const StyledSpinnerBox = styled(Primitive.div, {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n margin: 'auto',\n zIndex: 1,\n})\n\nexport const StyledChipButton = styled(BaseButton, {\n // Figma Chip: spacing-100 before the close glyph, not container gap.\n paddingInlineStart: '$100',\n flexShrink: 0,\n color: '$icon-secondary',\n ...focus.css({\n boxShadow: '$focus',\n }),\n})\n\nexport type StyledChipProps = StrictComponentProps<typeof StyledChip>\n","import type { StyledImageSlotProps } from './image-icon.styled'\nimport { StyledImageSlot } from './image-icon.styled'\n\nexport interface ImageSlotProps extends StyledImageSlotProps {}\n\nexport const ImageSlot = StyledImageSlot\n","import React from 'react'\nimport type {\n ElementRef,\n ForwardRefExoticComponent,\n RefAttributes,\n} from 'react'\nimport type { BaseButtonProps } from '@mirohq/design-system-base-button'\nimport { IconCross } from '@mirohq/design-system-icons'\nimport { Spinner } from '@mirohq/design-system-spinner'\nimport type { SpinnerProps } from '@mirohq/design-system-spinner'\n\nimport {\n StyledChip,\n StyledChipButton,\n StyledChipContent,\n StyledPressableChip,\n StyledSpinnerBox,\n} from './chip.styled'\nimport type { StyledChipProps } from './chip.styled'\nimport { ImageSlot } from './partials/image-slot'\n\nexport type ChipProps = Omit<\n StyledChipProps,\n 'ref' \| 'size' \| 'variant' \| 'disabled'\n> &\n Pick<BaseButtonProps, 'onPress'> &\n RefAttributes<HTMLDivElement \| HTMLButtonElement> & {\n /*\n Change the chip size. Same scale as Button (`small`, `medium`, `large`,\n * `x-large`).\n * @default 'medium'\n /\n size?: StyledChipProps['size']\n /\n Change the chip style. `default` is filled; `outline` is bordered.\n * @default 'default'\n /\n variant?: StyledChipProps['variant']\n /\n Disable the chip. When removable, the close control is disabled too.\n /\n disabled?: boolean\n /\n Show a button to remove the Chip\n * @default true\n /\n removable?: boolean\n /\n Show a spinner overlay and keep the chip non-interactive without the\n * disabled look. Pressable only.\n * @default false\n /\n loading?: boolean\n } & (\n \| {\n /\n Event handler called when the chip's remove button is clicked.\n /\n onRemove: (\n event: React.MouseEvent<HTMLButtonElement, MouseEvent>\n ) => void\n /\n Remove button label to make the button recognizable by the screen readers.\n */\n removeAriaLabel: string\n }\n \| { removable: false; removeAriaLabel?: never; onRemove?: never }\n )\n\nconst hasPressEvent = (props: object): boolean => {\n if ('onClick' in props && props.onClick != null) return true\n if ('onPress' in props && props.onPress != null) return true\n\n return false\n}\n\nexport const Chip = React.forwardRef<ElementRef<'div' \| 'button'>, ChipProps>(\n (props, forwardRef) => {\n const {\n children,\n removable = true,\n onRemove,\n removeAriaLabel,\n loading = false,\n size = 'medium',\n variant = 'default',\n disabled,\n ...restProps\n } = props\n\n const pressable = hasPressEvent(restProps)\n const isLoading = pressable && loading\n\n let spinnerSize: SpinnerProps['size'] = 'medium'\n\n if (typeof size === 'string' && ['small', 'medium'].includes(size)) {\n spinnerSize = 'small'\n }\n\n const content = (\n <>\n {isLoading && (\n <StyledSpinnerBox\n aria-hidden\n data-testid={\n process.env.NODE_ENV === 'test' ? 'chip-spinner' : undefined\n }\n >\n <Spinner size={spinnerSize} />\n </StyledSpinnerBox>\n )}\n <StyledChipContent\n data-chip-content=''\n loading={isLoading \|\| undefined}\n >\n {children}\n </StyledChipContent>\n {!pressable && removable && (\n <StyledChipButton\n type='button'\n disabled={disabled === true \|\| undefined}\n onClick={onRemove}\n aria-label={removeAriaLabel}\n >\n <IconCross size='small' />\n </StyledChipButton>\n )}\n </>\n )\n\n if (pressable) {\n return (\n <StyledPressableChip\n type='button'\n {...(restProps as BaseButtonProps)}\n size={size}\n variant={variant}\n disabled={disabled === true \|\| undefined}\n ref={forwardRef as React.Ref<ElementRef<typeof StyledPressableChip>>}\n aria-busy={isLoading \|\| undefined}\n aria-disabled={isLoading \|\| undefined}\n >\n {content}\n </StyledPressableChip>\n )\n }\n\n return (\n <StyledChip\n {...(restProps as StyledChipProps)}\n size={size}\n variant={variant}\n disabled={disabled}\n ref={forwardRef as React.Ref<ElementRef<typeof StyledChip>>}\n >\n {content}\n </StyledChip>\n )\n }\n) as ForwardRefExoticComponent<ChipProps> & Partials\n\nexport interface Partials {\n ImageSlot: typeof ImageSlot\n}\n\nChip.ImageSlot = ImageSlot\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"module.js","sources":["../src/partials/icon-slot.styled.tsx","../src/chip.styled.tsx","../src/partials/icon-slot.tsx","../src/chip.tsx"],"sourcesContent":["import type { StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledIconSlot = styled(Primitive.span, {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n verticalAlign: 'middle',\n paddingInline: '$50',\n '& img': {\n display: 'block',\n square: 16,\n borderRadius: '$round',\n objectFit: 'cover',\n },\n})\n\nexport type StyledIconSlotProps = StrictComponentProps<typeof StyledIconSlot>\n","import { styled } from '@mirohq/design-system-stitches'\nimport type { CSS, StrictComponentProps } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { BaseButton } from '@mirohq/design-system-base-button'\nimport { focus } from '@mirohq/design-system-styles'\n\nimport { StyledIconSlot } from './partials/icon-slot.styled'\n\n// Same offset Button uses so paddingX matches that scale without importing it.\nconst LABEL_OFFSET = 2\n\nconst iconSlotImg = (size: string): CSS => ({\n [`& ${StyledIconSlot} img`]: {\n square: size,\n },\n})\n\nconst chipLayout = {\n borderRadius: '$round',\n display: 'inline-flex',\n alignItems: 'center',\n // Gap, not close-button padding — padding sits inside the focus ring.\n gap: '$100',\n width: 'fit-content',\n maxWidth: '100%',\n flexShrink: 0,\n boxSizing: 'border-box',\n border: '1px solid transparent',\n lineHeight: 1.3,\n // Chip labels are regular. Pressable uses BaseButton; don't keep Button's\n // semibold from that shell.\n fontWeight: '$regular',\n}\n\n// Copied from Button's size variant (same tokens and padding formula), not\n// imported — Chip owns this scale so Button can change independently.\nconst chipSizes = {\n 'x-large': {\n height: '$12',\n fontSize: '$200',\n paddingX: `calc($200 + ${LABEL_OFFSET}px)`,\n ...iconSlotImg('$8'),\n },\n large: {\n height: '$10',\n fontSize: '$200',\n paddingX: `calc($150 + ${LABEL_OFFSET}px)`,\n ...iconSlotImg('$6'),\n },\n medium: {\n height: '$8',\n fontSize: '$175',\n paddingX: `calc($100 + ${LABEL_OFFSET}px)`,\n ...iconSlotImg('$5'),\n },\n small: {\n height: '$6',\n fontSize: '$175',\n paddingX: `calc($100 + ${LABEL_OFFSET}px)`,\n ...iconSlotImg('$4'),\n },\n}\n\n// Hover and pressed only belong on the pressable shell.\nconst defaultIdle = {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default',\n borderColor: '$chip-border-default',\n}\n\nconst outlineIdle = {\n color: '$chip-text-on-outline',\n backgroundColor: '$transparent',\n borderColor: '$chip-border-outline',\n}\n\nconst defaultInteractive = {\n ...defaultIdle,\n _hover: {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default-hover',\n borderColor: '$chip-border-default-hover',\n },\n '&[data-pressed]': {\n color: '$chip-text-on-default',\n backgroundColor: '$chip-background-default-pressed',\n borderColor: '$chip-border-default',\n },\n // Attribute selector so `disabled` reaches BaseButton / usePress.\n '&[disabled]': {\n backgroundColor: '$background-disabled',\n color: '$text-on-disabled',\n },\n}\n\nconst outlineInteractive = {\n ...outlineIdle,\n _hover: {\n backgroundColor: '$chip-background-outline-hover',\n borderColor: '$chip-border-outline-hover',\n color: '$chip-text-on-outline',\n },\n '&[data-pressed]': {\n backgroundColor: '$chip-background-outline-pressed',\n borderColor: '$chip-border-outline-pressed',\n color: '$chip-text-on-outline',\n },\n '&[disabled]': {\n backgroundColor: '$transparent',\n borderColor: '$border-disabled',\n color: '$text-disabled',\n },\n}\n\nexport const StyledChip = styled(Primitive.div, {\n ...chipLayout,\n variants: {\n variant: {\n default: defaultIdle,\n outline: outlineIdle,\n },\n disabled: {\n true: {},\n },\n size: chipSizes,\n },\n compoundVariants: [\n {\n variant: 'default',\n disabled: true,\n css: {\n backgroundColor: '$background-disabled',\n color: '$text-on-disabled',\n '& button': {\n color: '$icon-on-disabled',\n },\n },\n },\n {\n variant: 'outline',\n disabled: true,\n css: {\n backgroundColor: '$transparent',\n borderColor: '$border-disabled',\n color: '$text-disabled',\n '& button': {\n color: '$icon-disabled',\n },\n },\n },\n ],\n defaultVariants: {\n variant: 'default',\n size: 'medium',\n },\n})\n\nexport const StyledPressableChip = styled(BaseButton, {\n ...chipLayout,\n position: 'relative',\n ...focus.css({\n boxShadow: '$focus',\n }),\n // Loading stays visually idle — only the wait cursor signals it. Don't reuse\n // the disabled mute; that made loading look broken.\n '&[aria-busy=\"true\"]': {\n cursor: 'wait',\n pointerEvents: 'none',\n },\n variants: {\n variant: {\n default: defaultInteractive,\n outline: outlineInteractive,\n },\n size: chipSizes,\n },\n defaultVariants: {\n variant: 'default',\n size: 'medium',\n },\n})\n\nexport const StyledChipContent = styled(Primitive.div, {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n // Taller than the em box so descenders (g, y) aren't clipped by overflow.\n lineHeight: 1.3,\n minWidth: 0,\n display: 'flex',\n alignItems: 'center',\n variants: {\n loading: {\n true: {\n opacity: 0,\n },\n },\n },\n})\n\nexport const StyledSpinnerBox = styled(Primitive.div, {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n margin: 'auto',\n zIndex: 1,\n})\n\nexport const StyledChipButton = styled(BaseButton, {\n flexShrink: 0,\n color: '$icon-secondary',\n ...focus.css({\n boxShadow: '$focus',\n }),\n})\n\nexport type StyledChipProps = StrictComponentProps<typeof StyledChip>\n","import type { StyledIconSlotProps } from './icon-slot.styled'\nimport { StyledIconSlot } from './icon-slot.styled'\n\nexport interface IconSlotProps extends StyledIconSlotProps {}\n\nexport const IconSlot = StyledIconSlot\n","import React from 'react'\nimport type {\n ElementRef,\n ForwardRefExoticComponent,\n RefAttributes,\n} from 'react'\nimport type { BaseButtonProps } from '@mirohq/design-system-base-button'\nimport { IconCross } from '@mirohq/design-system-icons'\nimport { Spinner } from '@mirohq/design-system-spinner'\nimport type { SpinnerProps } from '@mirohq/design-system-spinner'\n\nimport {\n StyledChip,\n StyledChipButton,\n StyledChipContent,\n StyledPressableChip,\n StyledSpinnerBox,\n} from './chip.styled'\nimport type { StyledChipProps } from './chip.styled'\nimport { IconSlot } from './partials/icon-slot'\n\nexport type ChipProps = Omit<\n StyledChipProps,\n 'ref' \| 'size' \| 'variant' \| 'disabled'\n> &\n Pick<BaseButtonProps, 'onPress'> &\n RefAttributes<HTMLDivElement \| HTMLButtonElement> & {\n /*\n Change the chip size. Same scale as Button (`small`, `medium`, `large`,\n * `x-large`).\n * @default 'medium'\n /\n size?: StyledChipProps['size']\n /\n Change the chip style. `default` is filled; `outline` is bordered.\n * @default 'default'\n /\n variant?: StyledChipProps['variant']\n /\n Disable the chip. When removable, the close control is disabled too.\n /\n disabled?: boolean\n /\n Show a button to remove the Chip\n * @default true\n /\n removable?: boolean\n /\n Show a spinner overlay and keep the chip non-interactive without the\n * disabled look. Pressable only.\n * @default false\n /\n loading?: boolean\n } & (\n \| {\n /\n Event handler called when the chip's remove button is clicked.\n /\n onRemove: (\n event: React.MouseEvent<HTMLButtonElement, MouseEvent>\n ) => void\n /\n Remove button label to make the button recognizable by the screen readers.\n */\n removeAriaLabel: string\n }\n \| { removable: false; removeAriaLabel?: never; onRemove?: never }\n )\n\nconst hasPressEvent = (props: object): boolean => {\n if ('onClick' in props && props.onClick != null) return true\n if ('onPress' in props && props.onPress != null) return true\n\n return false\n}\n\nexport const Chip = React.forwardRef<ElementRef<'div' \| 'button'>, ChipProps>(\n (props, forwardRef) => {\n const {\n children,\n removable = true,\n onRemove,\n removeAriaLabel,\n loading = false,\n size = 'medium',\n variant = 'default',\n disabled,\n ...restProps\n } = props\n\n const pressable = hasPressEvent(restProps)\n const isLoading = pressable && loading\n\n let spinnerSize: SpinnerProps['size'] = 'medium'\n\n if (typeof size === 'string' && ['small', 'medium'].includes(size)) {\n spinnerSize = 'small'\n }\n\n const content = (\n <>\n {isLoading && (\n <StyledSpinnerBox\n aria-hidden\n data-testid={\n process.env.NODE_ENV === 'test' ? 'chip-spinner' : undefined\n }\n >\n <Spinner size={spinnerSize} />\n </StyledSpinnerBox>\n )}\n <StyledChipContent\n data-chip-content=''\n loading={isLoading \|\| undefined}\n >\n {children}\n </StyledChipContent>\n {!pressable && removable && (\n <StyledChipButton\n type='button'\n disabled={disabled === true \|\| undefined}\n onClick={onRemove}\n aria-label={removeAriaLabel}\n >\n <IconCross size='small' />\n </StyledChipButton>\n )}\n </>\n )\n\n if (pressable) {\n return (\n <StyledPressableChip\n type='button'\n {...(restProps as BaseButtonProps)}\n size={size}\n variant={variant}\n disabled={disabled === true \|\| undefined}\n ref={forwardRef as React.Ref<ElementRef<typeof StyledPressableChip>>}\n aria-busy={isLoading \|\| undefined}\n aria-disabled={isLoading \|\| undefined}\n >\n {content}\n </StyledPressableChip>\n )\n }\n\n return (\n <StyledChip\n {...(restProps as StyledChipProps)}\n size={size}\n variant={variant}\n disabled={disabled}\n ref={forwardRef as React.Ref<ElementRef<typeof StyledChip>>}\n >\n {content}\n </StyledChip>\n )\n }\n) as ForwardRefExoticComponent<ChipProps> & Partials\n\nexport interface Partials {\n IconSlot: typeof IconSlot\n}\n\nChip.IconSlot = IconSlot\n"],"names":[],"mappings":"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"}

package/dist/types.d.ts CHANGED Viewed

@@ -26,23 +26,23 @@ type TransformProps<Props, Media> = {
 	)
 }
-declare const StyledChip: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, "size" | "disabled" | "variant"> & TransformProps<{
-    variant?: "outline" | "default" | undefined;
+declare const StyledChip: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, "disabled" | "size" | "variant"> & TransformProps<{
+    variant?: "default" | "outline" | undefined;
     disabled?: boolean | "true" | undefined;
     size?: "small" | "medium" | "large" | "x-large" | undefined;
 }, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {
-    variant?: "outline" | "default" | undefined;
+    variant?: "default" | "outline" | undefined;
     disabled?: boolean | "true" | undefined;
     size?: "small" | "medium" | "large" | "x-large" | undefined;
 }, {}>;
 type StyledChipProps = StrictComponentProps<typeof StyledChip>;
-declare const StyledImageSlot: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"span">>>, never> & TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLSpanElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"span">>, {}, {}>;
-type StyledImageSlotProps = StrictComponentProps<typeof StyledImageSlot>;
+declare const StyledIconSlot: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"span">>>, never> & TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLSpanElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"span">>, {}, {}>;
+type StyledIconSlotProps = StrictComponentProps<typeof StyledIconSlot>;
-interface ImageSlotProps extends StyledImageSlotProps {
+interface IconSlotProps extends StyledIconSlotProps {
 }
-declare const ImageSlot: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"span">>>, never> & TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLSpanElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"span">>, {}, {}>;
+declare const IconSlot: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"span">>>, never> & TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLSpanElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"span">>, {}, {}>;
 type ChipProps = Omit<StyledChipProps, 'ref' | 'size' | 'variant' | 'disabled'> & Pick<BaseButtonProps, 'onPress'> & RefAttributes<HTMLDivElement | HTMLButtonElement> & {
     /**
@@ -87,8 +87,8 @@ type ChipProps = Omit<StyledChipProps, 'ref' | 'size' | 'variant' | 'disabled'>
 });
 declare const Chip: ForwardRefExoticComponent<ChipProps> & Partials;
 interface Partials {
-    ImageSlot: typeof ImageSlot;
+    IconSlot: typeof IconSlot;
 }
 export { Chip };
-export type { ImageSlotProps as ChipImageSlotProps, ChipProps };
+export type { IconSlotProps as ChipIconSlotProps, ChipProps };

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@mirohq/design-system-chip",
-  "version": "1.3.0-filter-chip.1",
+  "version": "1.3.1",
   "description": "",
   "author": "Miro",
   "source": "src/index.ts",
@@ -26,11 +26,11 @@
     "react": "^16.14 || ^17 || ^18 || ^19"
   },
   "dependencies": {
-    "@mirohq/design-system-icons": "^1.46.2",
     "@mirohq/design-system-base-button": "^1.2.38",
+    "@mirohq/design-system-icons": "^1.47.0",
+    "@mirohq/design-system-primitive": "^2.2.1",
     "@mirohq/design-system-spinner": "^2.2.35",
     "@mirohq/design-system-stitches": "^3.3.33",
-    "@mirohq/design-system-primitive": "^2.2.1",
     "@mirohq/design-system-styles": "^3.2.33"
   },
   "scripts": {