@mirohq/design-system-chip 1.3.0 → 1.3.2

package/dist/main.js

@@ -25,6 +25,7 @@ const StyledIconSlot = designSystemStitches.styled(designSystemPrimitive.Primiti
 });
 
 const LABEL_OFFSET = 2;
+const DEFAULT_SIZE = "small";
 const iconSlotImg = (size) => ({
   ["& ".concat(StyledIconSlot, " img")]: {
     square: size
@@ -157,7 +158,7 @@ const StyledChip = designSystemStitches.styled(designSystemPrimitive.Primitive.d
   ],
   defaultVariants: {
     variant: "default",
-    size: "medium"
+    size: DEFAULT_SIZE
   }
 });
 const StyledPressableChip = designSystemStitches.styled(designSystemBaseButton.BaseButton, {
@@ -181,7 +182,7 @@ const StyledPressableChip = designSystemStitches.styled(designSystemBaseButton.B
   },
   defaultVariants: {
     variant: "default",
-    size: "medium"
+    size: DEFAULT_SIZE
   }
 });
 const StyledChipContent = designSystemStitches.styled(designSystemPrimitive.Primitive.div, {
@@ -236,7 +237,7 @@ const Chip = React.forwardRef(
       onRemove,
       removeAriaLabel,
       loading = false,
-      size = "medium",
+      size = DEFAULT_SIZE,
       variant = "default",
       disabled,
       ...restProps

package/dist/main.js.map

@@ -1 +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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"}
+{"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\n// Chip defaults to small where Button defaults to medium. 1.2.60 had no size\n// scale and computed to ~23.6px tall; small is 24px and medium is 32px, so\n// defaulting to medium made every existing consumer's chips ~36% taller without\n// them changing a line. The asymmetry with Button is deliberate and is the whole\n// point — read this before \"fixing\" it.\nexport const DEFAULT_SIZE = 'small' as const\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: DEFAULT_SIZE,\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: DEFAULT_SIZE,\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  DEFAULT_SIZE,\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, but defaults to `small` where\n     * Button defaults to `medium`, so chips written before the scale existed keep\n     * their height.\n     * @default 'small'\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 = DEFAULT_SIZE,\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

@@ -23,6 +23,7 @@ const StyledIconSlot = styled(Primitive.span, {
 });
 
 const LABEL_OFFSET = 2;
+const DEFAULT_SIZE = "small";
 const iconSlotImg = (size) => ({
   ["& ".concat(StyledIconSlot, " img")]: {
     square: size
@@ -155,7 +156,7 @@ const StyledChip = styled(Primitive.div, {
   ],
   defaultVariants: {
     variant: "default",
-    size: "medium"
+    size: DEFAULT_SIZE
   }
 });
 const StyledPressableChip = styled(BaseButton, {
@@ -179,7 +180,7 @@ const StyledPressableChip = styled(BaseButton, {
   },
   defaultVariants: {
     variant: "default",
-    size: "medium"
+    size: DEFAULT_SIZE
   }
 });
 const StyledChipContent = styled(Primitive.div, {
@@ -234,7 +235,7 @@ const Chip = React.forwardRef(
       onRemove,
       removeAriaLabel,
       loading = false,
-      size = "medium",
+      size = DEFAULT_SIZE,
       variant = "default",
       disabled,
       ...restProps

package/dist/module.js.map

@@ -1 +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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"}
+{"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\n// Chip defaults to small where Button defaults to medium. 1.2.60 had no size\n// scale and computed to ~23.6px tall; small is 24px and medium is 32px, so\n// defaulting to medium made every existing consumer's chips ~36% taller without\n// them changing a line. The asymmetry with Button is deliberate and is the whole\n// point — read this before \"fixing\" it.\nexport const DEFAULT_SIZE = 'small' as const\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: DEFAULT_SIZE,\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: DEFAULT_SIZE,\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  DEFAULT_SIZE,\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, but defaults to `small` where\n     * Button defaults to `medium`, so chips written before the scale existed keep\n     * their height.\n     * @default 'small'\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 = DEFAULT_SIZE,\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

@@ -26,12 +26,12 @@ type TransformProps<Props, Media> = {
 	)
 }
 
-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;
+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;
     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?: "default" | "outline" | undefined;
+    variant?: "outline" | "default" | undefined;
     disabled?: boolean | "true" | undefined;
     size?: "small" | "medium" | "large" | "x-large" | undefined;
 }, {}>;
@@ -46,9 +46,10 @@ declare const IconSlot: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design
 
 type ChipProps = Omit<StyledChipProps, 'ref' | 'size' | 'variant' | 'disabled'> & Pick<BaseButtonProps, 'onPress'> & RefAttributes<HTMLDivElement | HTMLButtonElement> & {
     /**
-     * Change the chip size. Same scale as Button (`small`, `medium`, `large`,
-     * `x-large`).
-     * @default 'medium'
+     * Change the chip size. Same scale as Button, but defaults to `small` where
+     * Button defaults to `medium`, so chips written before the scale existed keep
+     * their height.
+     * @default 'small'
      */
     size?: StyledChipProps['size'];
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mirohq/design-system-chip",
-  "version": "1.3.0",
+  "version": "1.3.2",
   "description": "",
   "author": "Miro",
   "source": "src/index.ts",
@@ -27,10 +27,10 @@
   },
   "dependencies": {
     "@mirohq/design-system-base-button": "^1.2.38",
-    "@mirohq/design-system-stitches": "^3.3.33",
-    "@mirohq/design-system-spinner": "^2.2.35",
+    "@mirohq/design-system-icons": "^1.47.0",
     "@mirohq/design-system-primitive": "^2.2.1",
-    "@mirohq/design-system-icons": "^1.46.2",
+    "@mirohq/design-system-spinner": "^2.2.35",
+    "@mirohq/design-system-stitches": "^3.3.33",
     "@mirohq/design-system-styles": "^3.2.33"
   },
   "scripts": {