@mirohq/design-system-chip 1.0.5 → 1.1.0-stop-using-strict-component-props.0
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.
- package/dist/main.js.map +1 -1
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +3 -4
- package/package.json +3 -3
package/dist/main.js.map
CHANGED
|
@@ -1 +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 {
|
|
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 type { ComponentPropsWithRef } from 'react'\nimport { styled } 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 = ComponentPropsWithRef<typeof StyledChip>\n","import type { ComponentPropsWithRef } from 'react'\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 = ComponentPropsWithRef<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;;;;"}
|
package/dist/module.js.map
CHANGED
|
@@ -1 +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 {
|
|
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 type { ComponentPropsWithRef } from 'react'\nimport { styled } 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 = ComponentPropsWithRef<typeof StyledChip>\n","import type { ComponentPropsWithRef } from 'react'\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 = ComponentPropsWithRef<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;;;;"}
|
package/dist/types.d.ts
CHANGED
|
@@ -1,16 +1,15 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import react__default, { ForwardRefExoticComponent } from 'react';
|
|
2
|
+
import react__default, { ComponentPropsWithRef, ForwardRefExoticComponent } from 'react';
|
|
3
3
|
import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
|
|
4
4
|
import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
|
|
5
|
-
import { StrictComponentProps } from '@mirohq/design-system-stitches';
|
|
6
5
|
import * as _mirohq_design_system_primitive from '@mirohq/design-system-primitive';
|
|
7
6
|
import * as _mirohq_design_system_components_primitive from '@mirohq/design-system-components/primitive';
|
|
8
7
|
|
|
9
8
|
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">>, {}, {}>;
|
|
10
|
-
type StyledChipProps =
|
|
9
|
+
type StyledChipProps = ComponentPropsWithRef<typeof StyledChip>;
|
|
11
10
|
|
|
12
11
|
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">>, {}, {}>;
|
|
13
|
-
type StyledImageSlotProps =
|
|
12
|
+
type StyledImageSlotProps = ComponentPropsWithRef<typeof StyledImageSlot>;
|
|
14
13
|
|
|
15
14
|
interface ImageSlotProps extends StyledImageSlotProps {
|
|
16
15
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mirohq/design-system-chip",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.1.0-stop-using-strict-component-props.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"author": "Miro",
|
|
6
6
|
"source": "src/index.ts",
|
|
@@ -27,10 +27,10 @@
|
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
29
|
"@mirohq/design-system-base-button": "^1.0.0",
|
|
30
|
-
"@mirohq/design-system-icons": "^1.4.0",
|
|
31
30
|
"@mirohq/design-system-primitive": "^2.0.0",
|
|
32
31
|
"@mirohq/design-system-stitches": "^3.0.0",
|
|
33
|
-
"@mirohq/design-system-styles": "^2.0.0"
|
|
32
|
+
"@mirohq/design-system-styles": "^2.0.0",
|
|
33
|
+
"@mirohq/design-system-icons": "^1.5.0"
|
|
34
34
|
},
|
|
35
35
|
"scripts": {
|
|
36
36
|
"build": "rollup -c ../../../rollup.config.js",
|