@mirohq/design-system-chip 1.1.15-fix-button-types.2 → 1.2.0-fix-stitches-types.0

package/dist/main.js

@@ -1,7 +1,5 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var designSystemIcons = require('@mirohq/design-system-icons');
@@ -10,10 +8,6 @@ var designSystemPrimitive = require('@mirohq/design-system-primitive');
 var designSystemBaseButton = require('@mirohq/design-system-base-button');
 var designSystemStyles = require('@mirohq/design-system-styles');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
 const StyledChip = designSystemStitches.styled(designSystemPrimitive.Primitive.div, {
   fontSize: "$150",
   lineHeight: 1.3,
@@ -44,7 +38,7 @@ const StyledImageSlot = designSystemStitches.styled(designSystemPrimitive.Primit
 
 const ImageSlot = StyledImageSlot;
 
-const Chip = React__default["default"].forwardRef(
+const Chip = React.forwardRef(
   ({ children, removable = true, onRemove, removeAriaLabel, ...restProps }, forwardRef) => /* @__PURE__ */ jsxRuntime.jsxs(StyledChip, { ...restProps, ref: forwardRef, children: [
     /* @__PURE__ */ jsxRuntime.jsx(StyledChipContent, { children }),
     removable && /* @__PURE__ */ jsxRuntime.jsx(

package/dist/main.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.js","sources":["../src/chip.styled.tsx","../src/partials/image-icon.styled.tsx","../src/partials/image-slot.tsx","../src/chip.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport type { 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\nexport const StyledChip = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.3,\n  padding: '$50 $100',\n  borderRadius: '$round',\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: '$50',\n  backgroundColor: '$background-neutrals-subtle',\n  color: '$text-neutrals',\n  maxWidth: '100%',\n})\n\nexport const StyledChipContent = styled(Primitive.div, {\n  overflow: 'hidden',\n  whiteSpace: 'nowrap',\n  textOverflow: 'ellipsis',\n})\n\nexport const StyledChipButton = styled(BaseButton, {\n  color: '$icon-neutrals-inactive',\n  ...focus.css({\n    boxShadow: '$focus',\n  }),\n})\n\nexport type StyledChipProps = StrictComponentProps<typeof StyledChip>\n","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  paddingInline: '$50',\n})\n\nexport type StyledImageSlotProps = StrictComponentProps<typeof StyledImageSlot>\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 { ElementRef, ForwardRefExoticComponent } from 'react'\nimport { IconCross } from '@mirohq/design-system-icons'\n\nimport { StyledChip, StyledChipButton, StyledChipContent } from './chip.styled'\nimport type { StyledChipProps } from './chip.styled'\nimport { ImageSlot } from './partials/image-slot'\n\ninterface RemovableProps {\n  /**\n   * Event handler called when the chip's remove button is clicked.\n   */\n  onRemove: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n\n  /**\n   * Remove button label to make the button recognizable by the screen readers.\n   */\n  removeAriaLabel: string\n}\n\nexport type ChipProps = (StyledChipProps & {\n  /**\n   * Show a button to remove the Chip\n   * @default true\n   */\n  removable?: boolean\n}) &\n  (\n    | RemovableProps\n    | { removable: false; removeAriaLabel?: never; onRemove?: never }\n  )\n\nexport const Chip = React.forwardRef<ElementRef<typeof StyledChip>, ChipProps>(\n  (\n    { children, removable = true, onRemove, removeAriaLabel, ...restProps },\n    forwardRef\n  ) => (\n    <StyledChip {...restProps} ref={forwardRef}>\n      <StyledChipContent>{children}</StyledChipContent>\n      {removable && (\n        <StyledChipButton\n          type='button'\n          onClick={onRemove}\n          aria-label={removeAriaLabel}\n        >\n          <IconCross size='small' />\n        </StyledChipButton>\n      )}\n    </StyledChip>\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","React","jsxs","jsx","IconCross"],"mappings":";;;;;;;;;;;;;;;;AAMa,MAAA,UAAA,GAAaA,2BAAO,CAAAC,+BAAA,CAAU,GAAK,EAAA;AAAA,EAC9C,QAAU,EAAA,MAAA;AAAA,EACV,UAAY,EAAA,GAAA;AAAA,EACZ,OAAS,EAAA,UAAA;AAAA,EACT,YAAc,EAAA,QAAA;AAAA,EACd,OAAS,EAAA,aAAA;AAAA,EACT,UAAY,EAAA,QAAA;AAAA,EACZ,GAAK,EAAA,KAAA;AAAA,EACL,eAAiB,EAAA,6BAAA;AAAA,EACjB,KAAO,EAAA,gBAAA;AAAA,EACP,QAAU,EAAA,MAAA;AACZ,CAAC,CAAA,CAAA;AAEY,MAAA,iBAAA,GAAoBD,2BAAO,CAAAC,+BAAA,CAAU,GAAK,EAAA;AAAA,EACrD,QAAU,EAAA,QAAA;AAAA,EACV,UAAY,EAAA,QAAA;AAAA,EACZ,YAAc,EAAA,UAAA;AAChB,CAAC,CAAA,CAAA;AAEY,MAAA,gBAAA,GAAmBD,4BAAOE,iCAAY,EAAA;AAAA,EACjD,KAAO,EAAA,yBAAA;AAAA,EACP,GAAGC,yBAAM,GAAI,CAAA;AAAA,IACX,SAAW,EAAA,QAAA;AAAA,GACZ,CAAA;AACH,CAAC,CAAA;;AC1BY,MAAA,eAAA,GAAkBH,2BAAO,CAAAC,+BAAA,CAAU,IAAM,EAAA;AAAA,EACpD,aAAe,EAAA,KAAA;AACjB,CAAC,CAAA;;ACDM,MAAM,SAAY,GAAA,eAAA;;AC2BlB,MAAM,OAAOG,yBAAM,CAAA,UAAA;AAAA,EACxB,CACE,EAAE,QAAA,EAAU,SAAY,GAAA,IAAA,EAAM,UAAU,eAAiB,EAAA,GAAG,SAAU,EAAA,EACtE,+BAECC,eAAA,CAAA,UAAA,EAAA,EAAY,GAAG,SAAA,EAAW,KAAK,UAC9B,EAAA,QAAA,EAAA;AAAA,oBAAAC,cAAA,CAAC,qBAAmB,QAAS,EAAA,CAAA;AAAA,IAC5B,SACC,oBAAAA,cAAA;AAAA,MAAC,gBAAA;AAAA,MAAA;AAAA,QACC,IAAK,EAAA,QAAA;AAAA,QACL,OAAS,EAAA,QAAA;AAAA,QACT,YAAY,EAAA,eAAA;AAAA,QAEZ,QAAA,kBAAAA,cAAA,CAACC,2BAAU,EAAA,EAAA,IAAA,EAAK,OAAQ,EAAA,CAAA;AAAA,OAAA;AAAA,KAC1B;AAAA,GAEJ,EAAA,CAAA;AAEJ,EAAA;AAMA,IAAA,CAAK,SAAY,GAAA,SAAA;;;;"}
+{"version":3,"file":"main.js","sources":["../src/chip.styled.tsx","../src/partials/image-icon.styled.tsx","../src/partials/image-slot.tsx","../src/chip.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport type { 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\nexport const StyledChip = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.3,\n  padding: '$50 $100',\n  borderRadius: '$round',\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: '$50',\n  backgroundColor: '$background-neutrals-subtle',\n  color: '$text-neutrals',\n  maxWidth: '100%',\n})\n\nexport const StyledChipContent = styled(Primitive.div, {\n  overflow: 'hidden',\n  whiteSpace: 'nowrap',\n  textOverflow: 'ellipsis',\n})\n\nexport const StyledChipButton = styled(BaseButton, {\n  color: '$icon-neutrals-inactive',\n  ...focus.css({\n    boxShadow: '$focus',\n  }),\n})\n\nexport type StyledChipProps = StrictComponentProps<typeof StyledChip>\n","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  paddingInline: '$50',\n})\n\nexport type StyledImageSlotProps = StrictComponentProps<typeof StyledImageSlot>\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 { ElementRef, ForwardRefExoticComponent } from 'react'\nimport { IconCross } from '@mirohq/design-system-icons'\n\nimport { StyledChip, StyledChipButton, StyledChipContent } from './chip.styled'\nimport type { StyledChipProps } from './chip.styled'\nimport { ImageSlot } from './partials/image-slot'\n\ninterface RemovableProps {\n  /**\n   * Event handler called when the chip's remove button is clicked.\n   */\n  onRemove: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n\n  /**\n   * Remove button label to make the button recognizable by the screen readers.\n   */\n  removeAriaLabel: string\n}\n\nexport type ChipProps = (StyledChipProps & {\n  /**\n   * Show a button to remove the Chip\n   * @default true\n   */\n  removable?: boolean\n}) &\n  (\n    | RemovableProps\n    | { removable: false; removeAriaLabel?: never; onRemove?: never }\n  )\n\nexport const Chip = React.forwardRef<ElementRef<typeof StyledChip>, ChipProps>(\n  (\n    { children, removable = true, onRemove, removeAriaLabel, ...restProps },\n    forwardRef\n  ) => (\n    <StyledChip {...restProps} ref={forwardRef}>\n      <StyledChipContent>{children}</StyledChipContent>\n      {removable && (\n        <StyledChipButton\n          type='button'\n          onClick={onRemove}\n          aria-label={removeAriaLabel}\n        >\n          <IconCross size='small' />\n        </StyledChipButton>\n      )}\n    </StyledChip>\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","jsx","IconCross"],"mappings":";;;;;;;;;;AAMO,MAAM,UAAA,GAAaA,2BAAA,CAAOC,+BAAA,CAAU,GAAA,EAAK;AAAA,EAC9C,QAAA,EAAU,MAAA;AAAA,EACV,UAAA,EAAY,GAAA;AAAA,EACZ,OAAA,EAAS,UAAA;AAAA,EACT,YAAA,EAAc,QAAA;AAAA,EACd,OAAA,EAAS,aAAA;AAAA,EACT,UAAA,EAAY,QAAA;AAAA,EACZ,GAAA,EAAK,KAAA;AAAA,EACL,eAAA,EAAiB,6BAAA;AAAA,EACjB,KAAA,EAAO,gBAAA;AAAA,EACP,QAAA,EAAU;AACZ,CAAC,CAAA;AAEM,MAAM,iBAAA,GAAoBD,2BAAA,CAAOC,+BAAA,CAAU,GAAA,EAAK;AAAA,EACrD,QAAA,EAAU,QAAA;AAAA,EACV,UAAA,EAAY,QAAA;AAAA,EACZ,YAAA,EAAc;AAChB,CAAC,CAAA;AAEM,MAAM,gBAAA,GAAmBD,4BAAOE,iCAAA,EAAY;AAAA,EACjD,KAAA,EAAO,yBAAA;AAAA,EACP,GAAGC,yBAAM,GAAA,CAAI;AAAA,IACX,SAAA,EAAW;AAAA,GACZ;AACH,CAAC,CAAA;;AC1BM,MAAM,eAAA,GAAkBH,2BAAA,CAAOC,+BAAA,CAAU,IAAA,EAAM;AAAA,EACpD,aAAA,EAAe;AACjB,CAAC,CAAA;;ACDM,MAAM,SAAA,GAAY,eAAA;;AC2BlB,MAAM,OAAO,KAAA,CAAM,UAAA;AAAA,EACxB,CACE,EAAE,QAAA,EAAU,SAAA,GAAY,IAAA,EAAM,UAAU,eAAA,EAAiB,GAAG,SAAA,EAAU,EACtE,+BAEAG,eAAA,CAAC,UAAA,EAAA,EAAY,GAAG,SAAA,EAAW,KAAK,UAAA,EAC9B,QAAA,EAAA;AAAA,oBAAAC,cAAA,CAAC,qBAAmB,QAAA,EAAS,CAAA;AAAA,IAC5B,SAAA,oBACCA,cAAA;AAAA,MAAC,gBAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,QAAA;AAAA,QACL,OAAA,EAAS,QAAA;AAAA,QACT,YAAA,EAAY,eAAA;AAAA,QAEZ,QAAA,kBAAAA,cAAA,CAACC,2BAAA,EAAA,EAAU,IAAA,EAAK,OAAA,EAAQ;AAAA;AAAA;AAC1B,GAAA,EAEJ;AAEJ;AAMA,IAAA,CAAK,SAAA,GAAY,SAAA;;;;"}

package/dist/module.js.map

@@ -1 +1 @@
-{"version":3,"file":"module.js","sources":["../src/chip.styled.tsx","../src/partials/image-icon.styled.tsx","../src/partials/image-slot.tsx","../src/chip.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport type { 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\nexport const StyledChip = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.3,\n  padding: '$50 $100',\n  borderRadius: '$round',\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: '$50',\n  backgroundColor: '$background-neutrals-subtle',\n  color: '$text-neutrals',\n  maxWidth: '100%',\n})\n\nexport const StyledChipContent = styled(Primitive.div, {\n  overflow: 'hidden',\n  whiteSpace: 'nowrap',\n  textOverflow: 'ellipsis',\n})\n\nexport const StyledChipButton = styled(BaseButton, {\n  color: '$icon-neutrals-inactive',\n  ...focus.css({\n    boxShadow: '$focus',\n  }),\n})\n\nexport type StyledChipProps = StrictComponentProps<typeof StyledChip>\n","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  paddingInline: '$50',\n})\n\nexport type StyledImageSlotProps = StrictComponentProps<typeof StyledImageSlot>\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 { ElementRef, ForwardRefExoticComponent } from 'react'\nimport { IconCross } from '@mirohq/design-system-icons'\n\nimport { StyledChip, StyledChipButton, StyledChipContent } from './chip.styled'\nimport type { StyledChipProps } from './chip.styled'\nimport { ImageSlot } from './partials/image-slot'\n\ninterface RemovableProps {\n  /**\n   * Event handler called when the chip's remove button is clicked.\n   */\n  onRemove: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n\n  /**\n   * Remove button label to make the button recognizable by the screen readers.\n   */\n  removeAriaLabel: string\n}\n\nexport type ChipProps = (StyledChipProps & {\n  /**\n   * Show a button to remove the Chip\n   * @default true\n   */\n  removable?: boolean\n}) &\n  (\n    | RemovableProps\n    | { removable: false; removeAriaLabel?: never; onRemove?: never }\n  )\n\nexport const Chip = React.forwardRef<ElementRef<typeof StyledChip>, ChipProps>(\n  (\n    { children, removable = true, onRemove, removeAriaLabel, ...restProps },\n    forwardRef\n  ) => (\n    <StyledChip {...restProps} ref={forwardRef}>\n      <StyledChipContent>{children}</StyledChipContent>\n      {removable && (\n        <StyledChipButton\n          type='button'\n          onClick={onRemove}\n          aria-label={removeAriaLabel}\n        >\n          <IconCross size='small' />\n        </StyledChipButton>\n      )}\n    </StyledChip>\n  )\n) as ForwardRefExoticComponent<ChipProps> & Partials\n\nexport interface Partials {\n  ImageSlot: typeof ImageSlot\n}\n\nChip.ImageSlot = ImageSlot\n"],"names":[],"mappings":";;;;;;;;AAMa,MAAA,UAAA,GAAa,MAAO,CAAA,SAAA,CAAU,GAAK,EAAA;AAAA,EAC9C,QAAU,EAAA,MAAA;AAAA,EACV,UAAY,EAAA,GAAA;AAAA,EACZ,OAAS,EAAA,UAAA;AAAA,EACT,YAAc,EAAA,QAAA;AAAA,EACd,OAAS,EAAA,aAAA;AAAA,EACT,UAAY,EAAA,QAAA;AAAA,EACZ,GAAK,EAAA,KAAA;AAAA,EACL,eAAiB,EAAA,6BAAA;AAAA,EACjB,KAAO,EAAA,gBAAA;AAAA,EACP,QAAU,EAAA,MAAA;AACZ,CAAC,CAAA,CAAA;AAEY,MAAA,iBAAA,GAAoB,MAAO,CAAA,SAAA,CAAU,GAAK,EAAA;AAAA,EACrD,QAAU,EAAA,QAAA;AAAA,EACV,UAAY,EAAA,QAAA;AAAA,EACZ,YAAc,EAAA,UAAA;AAChB,CAAC,CAAA,CAAA;AAEY,MAAA,gBAAA,GAAmB,OAAO,UAAY,EAAA;AAAA,EACjD,KAAO,EAAA,yBAAA;AAAA,EACP,GAAG,MAAM,GAAI,CAAA;AAAA,IACX,SAAW,EAAA,QAAA;AAAA,GACZ,CAAA;AACH,CAAC,CAAA;;AC1BY,MAAA,eAAA,GAAkB,MAAO,CAAA,SAAA,CAAU,IAAM,EAAA;AAAA,EACpD,aAAe,EAAA,KAAA;AACjB,CAAC,CAAA;;ACDM,MAAM,SAAY,GAAA,eAAA;;AC2BlB,MAAM,OAAO,KAAM,CAAA,UAAA;AAAA,EACxB,CACE,EAAE,QAAA,EAAU,SAAY,GAAA,IAAA,EAAM,UAAU,eAAiB,EAAA,GAAG,SAAU,EAAA,EACtE,+BAEC,IAAA,CAAA,UAAA,EAAA,EAAY,GAAG,SAAA,EAAW,KAAK,UAC9B,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,qBAAmB,QAAS,EAAA,CAAA;AAAA,IAC5B,SACC,oBAAA,GAAA;AAAA,MAAC,gBAAA;AAAA,MAAA;AAAA,QACC,IAAK,EAAA,QAAA;AAAA,QACL,OAAS,EAAA,QAAA;AAAA,QACT,YAAY,EAAA,eAAA;AAAA,QAEZ,QAAA,kBAAA,GAAA,CAAC,SAAU,EAAA,EAAA,IAAA,EAAK,OAAQ,EAAA,CAAA;AAAA,OAAA;AAAA,KAC1B;AAAA,GAEJ,EAAA,CAAA;AAEJ,EAAA;AAMA,IAAA,CAAK,SAAY,GAAA,SAAA;;;;"}
+{"version":3,"file":"module.js","sources":["../src/chip.styled.tsx","../src/partials/image-icon.styled.tsx","../src/partials/image-slot.tsx","../src/chip.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport type { 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\nexport const StyledChip = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.3,\n  padding: '$50 $100',\n  borderRadius: '$round',\n  display: 'inline-flex',\n  alignItems: 'center',\n  gap: '$50',\n  backgroundColor: '$background-neutrals-subtle',\n  color: '$text-neutrals',\n  maxWidth: '100%',\n})\n\nexport const StyledChipContent = styled(Primitive.div, {\n  overflow: 'hidden',\n  whiteSpace: 'nowrap',\n  textOverflow: 'ellipsis',\n})\n\nexport const StyledChipButton = styled(BaseButton, {\n  color: '$icon-neutrals-inactive',\n  ...focus.css({\n    boxShadow: '$focus',\n  }),\n})\n\nexport type StyledChipProps = StrictComponentProps<typeof StyledChip>\n","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  paddingInline: '$50',\n})\n\nexport type StyledImageSlotProps = StrictComponentProps<typeof StyledImageSlot>\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 { ElementRef, ForwardRefExoticComponent } from 'react'\nimport { IconCross } from '@mirohq/design-system-icons'\n\nimport { StyledChip, StyledChipButton, StyledChipContent } from './chip.styled'\nimport type { StyledChipProps } from './chip.styled'\nimport { ImageSlot } from './partials/image-slot'\n\ninterface RemovableProps {\n  /**\n   * Event handler called when the chip's remove button is clicked.\n   */\n  onRemove: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n\n  /**\n   * Remove button label to make the button recognizable by the screen readers.\n   */\n  removeAriaLabel: string\n}\n\nexport type ChipProps = (StyledChipProps & {\n  /**\n   * Show a button to remove the Chip\n   * @default true\n   */\n  removable?: boolean\n}) &\n  (\n    | RemovableProps\n    | { removable: false; removeAriaLabel?: never; onRemove?: never }\n  )\n\nexport const Chip = React.forwardRef<ElementRef<typeof StyledChip>, ChipProps>(\n  (\n    { children, removable = true, onRemove, removeAriaLabel, ...restProps },\n    forwardRef\n  ) => (\n    <StyledChip {...restProps} ref={forwardRef}>\n      <StyledChipContent>{children}</StyledChipContent>\n      {removable && (\n        <StyledChipButton\n          type='button'\n          onClick={onRemove}\n          aria-label={removeAriaLabel}\n        >\n          <IconCross size='small' />\n        </StyledChipButton>\n      )}\n    </StyledChip>\n  )\n) as ForwardRefExoticComponent<ChipProps> & Partials\n\nexport interface Partials {\n  ImageSlot: typeof ImageSlot\n}\n\nChip.ImageSlot = ImageSlot\n"],"names":[],"mappings":";;;;;;;;AAMO,MAAM,UAAA,GAAa,MAAA,CAAO,SAAA,CAAU,GAAA,EAAK;AAAA,EAC9C,QAAA,EAAU,MAAA;AAAA,EACV,UAAA,EAAY,GAAA;AAAA,EACZ,OAAA,EAAS,UAAA;AAAA,EACT,YAAA,EAAc,QAAA;AAAA,EACd,OAAA,EAAS,aAAA;AAAA,EACT,UAAA,EAAY,QAAA;AAAA,EACZ,GAAA,EAAK,KAAA;AAAA,EACL,eAAA,EAAiB,6BAAA;AAAA,EACjB,KAAA,EAAO,gBAAA;AAAA,EACP,QAAA,EAAU;AACZ,CAAC,CAAA;AAEM,MAAM,iBAAA,GAAoB,MAAA,CAAO,SAAA,CAAU,GAAA,EAAK;AAAA,EACrD,QAAA,EAAU,QAAA;AAAA,EACV,UAAA,EAAY,QAAA;AAAA,EACZ,YAAA,EAAc;AAChB,CAAC,CAAA;AAEM,MAAM,gBAAA,GAAmB,OAAO,UAAA,EAAY;AAAA,EACjD,KAAA,EAAO,yBAAA;AAAA,EACP,GAAG,MAAM,GAAA,CAAI;AAAA,IACX,SAAA,EAAW;AAAA,GACZ;AACH,CAAC,CAAA;;AC1BM,MAAM,eAAA,GAAkB,MAAA,CAAO,SAAA,CAAU,IAAA,EAAM;AAAA,EACpD,aAAA,EAAe;AACjB,CAAC,CAAA;;ACDM,MAAM,SAAA,GAAY,eAAA;;AC2BlB,MAAM,OAAO,KAAA,CAAM,UAAA;AAAA,EACxB,CACE,EAAE,QAAA,EAAU,SAAA,GAAY,IAAA,EAAM,UAAU,eAAA,EAAiB,GAAG,SAAA,EAAU,EACtE,+BAEA,IAAA,CAAC,UAAA,EAAA,EAAY,GAAG,SAAA,EAAW,KAAK,UAAA,EAC9B,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,qBAAmB,QAAA,EAAS,CAAA;AAAA,IAC5B,SAAA,oBACC,GAAA;AAAA,MAAC,gBAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,QAAA;AAAA,QACL,OAAA,EAAS,QAAA;AAAA,QACT,YAAA,EAAY,eAAA;AAAA,QAEZ,QAAA,kBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,IAAA,EAAK,OAAA,EAAQ;AAAA;AAAA;AAC1B,GAAA,EAEJ;AAEJ;AAMA,IAAA,CAAK,SAAA,GAAY,SAAA;;;;"}

package/dist/types.d.ts

@@ -1,20 +1,39 @@
 import * as react from 'react';
 import react__default, { ForwardRefExoticComponent } from 'react';
-import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
 import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
 import { StrictComponentProps } from '@mirohq/design-system-stitches';
 import * as _mirohq_design_system_primitive from '@mirohq/design-system-primitive';
 import * as _mirohq_design_system_components_primitive from '@mirohq/design-system-components/primitive';
 
-declare const StyledChip: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
+/* Utilities */
+/* ========================================================================== */
+
+/** Returns a string with the given prefix followed by the given values. */
+type Prefixed<K extends string, T> = `${K}${Extract<T, boolean | number | string>}`
+
+type TransformProps<Props, Media> = {
+	[K in keyof Props]: (
+		| Props[K]
+		| (
+			& {
+				[KMedia in Prefixed<'@', 'initial' | keyof Media>]?: Props[K]
+			}
+			& {
+				[KMedia in string]: Props[K]
+			}
+		)
+	)
+}
+
+declare const StyledChip: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
 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> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLSpanElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"span">>, {}, {}>;
+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>;
 
 interface ImageSlotProps extends StyledImageSlotProps {
 }
-declare const ImageSlot: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"span">>>, never> & _stitches_react_types_styled_component.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 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">>, {}, {}>;
 
 interface RemovableProps {
     /**
@@ -42,4 +61,5 @@ interface Partials {
     ImageSlot: typeof ImageSlot;
 }
 
-export { Chip, ImageSlotProps as ChipImageSlotProps, ChipProps };
+export { Chip };
+export type { ImageSlotProps as ChipImageSlotProps, ChipProps };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mirohq/design-system-chip",
-  "version": "1.1.15-fix-button-types.2",
+  "version": "1.2.0-fix-stitches-types.0",
   "description": "",
   "author": "Miro",
   "source": "src/index.ts",
@@ -26,11 +26,11 @@
     "react": "^16.14 || ^17 || ^18 || ^19"
   },
   "dependencies": {
-    "@mirohq/design-system-icons": "^1.27.0",
-    "@mirohq/design-system-primitive": "^2.1.0",
-    "@mirohq/design-system-stitches": "^3.1.2",
-    "@mirohq/design-system-styles": "^3.0.1",
-    "@mirohq/design-system-base-button": "^1.1.3-fix-button-types.2"
+    "@mirohq/design-system-base-button": "^1.2.0-fix-stitches-types.0",
+    "@mirohq/design-system-icons": "^1.28.0-fix-stitches-types.0",
+    "@mirohq/design-system-primitive": "^2.2.0-fix-stitches-types.0",
+    "@mirohq/design-system-stitches": "^3.2.0-fix-stitches-types.0",
+    "@mirohq/design-system-styles": "^3.1.0-fix-stitches-types.0"
   },
   "scripts": {
     "build": "rollup -c ../../../rollup.config.js",