@remember-web/primitive 0.2.12 → 0.2.13
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/src/Chips/Chip/const.cjs.js +2 -2
- package/dist/src/Chips/Chip/const.cjs.js.map +1 -1
- package/dist/src/Chips/Chip/const.d.ts +2 -2
- package/dist/src/Chips/Chip/const.esm.js +2 -2
- package/dist/src/Chips/Chip/const.esm.js.map +1 -1
- package/dist/src/Chips/Chip/styles.cjs.js +1 -1
- package/dist/src/Chips/Chip/styles.cjs.js.map +1 -1
- package/dist/src/Chips/Chip/styles.d.ts.map +1 -1
- package/dist/src/Chips/Chip/styles.esm.js +1 -1
- package/dist/src/Chips/Chip/styles.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/Chips/Chip/Chip.stories.tsx +6 -1
- package/src/Chips/Chip/const.ts +2 -2
- package/src/Chips/Chip/styles.ts +3 -4
|
@@ -5,12 +5,12 @@ var mixin = require('@remember-web/mixin');
|
|
|
5
5
|
var CHIP_SIZE_STYLE = {
|
|
6
6
|
small: {
|
|
7
7
|
typography: 'Caption1',
|
|
8
|
-
padding: '
|
|
8
|
+
padding: '6px 10px',
|
|
9
9
|
height: '28px'
|
|
10
10
|
},
|
|
11
11
|
medium: {
|
|
12
12
|
typography: 'UIBody3',
|
|
13
|
-
padding: '
|
|
13
|
+
padding: '5px 12px',
|
|
14
14
|
height: '30px'
|
|
15
15
|
}
|
|
16
16
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"const.cjs.js","sources":["../../../../src/Chips/Chip/const.ts"],"sourcesContent":["import {\n bg100,\n bg200,\n bg300,\n contents000,\n contents100,\n contents150,\n contents200,\n contents300,\n contents999,\n primary100,\n} from '@remember-web/mixin';\nimport type { ChipSize, ChipVariant, ChipVariantStyleMap } from './types';\n\nexport const CHIP_SIZE_STYLE = {\n small: {\n typography: 'Caption1',\n padding: '
|
|
1
|
+
{"version":3,"file":"const.cjs.js","sources":["../../../../src/Chips/Chip/const.ts"],"sourcesContent":["import {\n bg100,\n bg200,\n bg300,\n contents000,\n contents100,\n contents150,\n contents200,\n contents300,\n contents999,\n primary100,\n} from '@remember-web/mixin';\nimport type { ChipSize, ChipVariant, ChipVariantStyleMap } from './types';\n\nexport const CHIP_SIZE_STYLE = {\n small: {\n typography: 'Caption1',\n padding: '6px 10px',\n height: '28px',\n },\n medium: {\n typography: 'UIBody3',\n padding: '5px 12px',\n height: '30px',\n },\n} as const satisfies Record<ChipSize, unknown>;\n\nexport const CHIP_VARIANT_STYLE: ChipVariantStyleMap = {\n filled: {\n default: {\n backgroundColor: bg200,\n color: contents150,\n leftIconColor: contents150,\n deleteButtonColor: contents200,\n },\n hover: {\n backgroundColor: bg200,\n color: contents100,\n leftIconColor: contents100,\n deleteButtonColor: contents150,\n },\n disabled: {\n backgroundColor: bg300,\n color: contents300,\n leftIconColor: contents300,\n deleteButtonColor: contents300,\n },\n selected: {\n backgroundColor: primary100,\n color: contents999,\n leftIconColor: contents999,\n deleteButtonColor: contents999,\n },\n selectedHover: {\n backgroundColor: contents100,\n color: contents999,\n leftIconColor: contents999,\n deleteButtonColor: contents999,\n },\n },\n\n outline: {\n default: {\n backgroundColor: bg100,\n color: contents150,\n leftIconColor: contents150,\n deleteButtonColor: contents200,\n border: `1px solid ${contents150}`,\n },\n hover: {\n backgroundColor: bg100,\n color: contents100,\n leftIconColor: contents100,\n deleteButtonColor: contents150,\n border: `1px solid ${contents100}`,\n },\n disabled: {\n backgroundColor: bg100,\n color: contents200,\n leftIconColor: contents200,\n deleteButtonColor: contents200,\n border: `1px solid ${contents200}`,\n },\n selected: {\n backgroundColor: primary100,\n color: contents999,\n leftIconColor: contents999,\n deleteButtonColor: contents999,\n border: '1px solid transparent',\n },\n selectedHover: {\n backgroundColor: contents100,\n color: contents999,\n leftIconColor: contents999,\n deleteButtonColor: contents999,\n border: '1px solid transparent',\n },\n },\n\n dashedLine: {\n default: {\n backgroundColor: bg100,\n color: contents150,\n leftIconColor: contents150,\n deleteButtonColor: contents200,\n border: `1px dashed ${contents150}`,\n },\n hover: {\n backgroundColor: bg100,\n color: contents100,\n leftIconColor: contents100,\n deleteButtonColor: contents150,\n border: `1px dashed ${contents100}`,\n },\n disabled: {\n backgroundColor: bg100,\n color: contents200,\n leftIconColor: contents200,\n deleteButtonColor: contents200,\n border: `1px dashed ${contents200}`,\n },\n selected: {\n backgroundColor: bg100,\n color: contents000,\n leftIconColor: contents000,\n deleteButtonColor: contents000,\n border: `1px solid ${primary100}`,\n },\n selectedHover: {\n backgroundColor: bg100,\n color: contents100,\n leftIconColor: contents100,\n deleteButtonColor: contents100,\n border: `1px solid ${contents100}`,\n },\n },\n} as const satisfies Record<ChipVariant, unknown>;\n"],"names":["CHIP_SIZE_STYLE","small","typography","padding","height","medium","CHIP_VARIANT_STYLE","filled","backgroundColor","bg200","color","contents150","leftIconColor","deleteButtonColor","contents200","hover","contents100","disabled","bg300","contents300","selected","primary100","contents999","selectedHover","outline","bg100","border","concat","dashedLine","contents000"],"mappings":"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"}
|
|
@@ -2,12 +2,12 @@ import type { ChipVariantStyleMap } from './types';
|
|
|
2
2
|
export declare const CHIP_SIZE_STYLE: {
|
|
3
3
|
readonly small: {
|
|
4
4
|
readonly typography: "Caption1";
|
|
5
|
-
readonly padding: "
|
|
5
|
+
readonly padding: "6px 10px";
|
|
6
6
|
readonly height: "28px";
|
|
7
7
|
};
|
|
8
8
|
readonly medium: {
|
|
9
9
|
readonly typography: "UIBody3";
|
|
10
|
-
readonly padding: "
|
|
10
|
+
readonly padding: "5px 12px";
|
|
11
11
|
readonly height: "30px";
|
|
12
12
|
};
|
|
13
13
|
};
|
|
@@ -3,12 +3,12 @@ import { bg200, contents150, contents200, contents100, bg300, contents300, prima
|
|
|
3
3
|
var CHIP_SIZE_STYLE = {
|
|
4
4
|
small: {
|
|
5
5
|
typography: 'Caption1',
|
|
6
|
-
padding: '
|
|
6
|
+
padding: '6px 10px',
|
|
7
7
|
height: '28px'
|
|
8
8
|
},
|
|
9
9
|
medium: {
|
|
10
10
|
typography: 'UIBody3',
|
|
11
|
-
padding: '
|
|
11
|
+
padding: '5px 12px',
|
|
12
12
|
height: '30px'
|
|
13
13
|
}
|
|
14
14
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"const.esm.js","sources":["../../../../src/Chips/Chip/const.ts"],"sourcesContent":["import {\n bg100,\n bg200,\n bg300,\n contents000,\n contents100,\n contents150,\n contents200,\n contents300,\n contents999,\n primary100,\n} from '@remember-web/mixin';\nimport type { ChipSize, ChipVariant, ChipVariantStyleMap } from './types';\n\nexport const CHIP_SIZE_STYLE = {\n small: {\n typography: 'Caption1',\n padding: '
|
|
1
|
+
{"version":3,"file":"const.esm.js","sources":["../../../../src/Chips/Chip/const.ts"],"sourcesContent":["import {\n bg100,\n bg200,\n bg300,\n contents000,\n contents100,\n contents150,\n contents200,\n contents300,\n contents999,\n primary100,\n} from '@remember-web/mixin';\nimport type { ChipSize, ChipVariant, ChipVariantStyleMap } from './types';\n\nexport const CHIP_SIZE_STYLE = {\n small: {\n typography: 'Caption1',\n padding: '6px 10px',\n height: '28px',\n },\n medium: {\n typography: 'UIBody3',\n padding: '5px 12px',\n height: '30px',\n },\n} as const satisfies Record<ChipSize, unknown>;\n\nexport const CHIP_VARIANT_STYLE: ChipVariantStyleMap = {\n filled: {\n default: {\n backgroundColor: bg200,\n color: contents150,\n leftIconColor: contents150,\n deleteButtonColor: contents200,\n },\n hover: {\n backgroundColor: bg200,\n color: contents100,\n leftIconColor: contents100,\n deleteButtonColor: contents150,\n },\n disabled: {\n backgroundColor: bg300,\n color: contents300,\n leftIconColor: contents300,\n deleteButtonColor: contents300,\n },\n selected: {\n backgroundColor: primary100,\n color: contents999,\n leftIconColor: contents999,\n deleteButtonColor: contents999,\n },\n selectedHover: {\n backgroundColor: contents100,\n color: contents999,\n leftIconColor: contents999,\n deleteButtonColor: contents999,\n },\n },\n\n outline: {\n default: {\n backgroundColor: bg100,\n color: contents150,\n leftIconColor: contents150,\n deleteButtonColor: contents200,\n border: `1px solid ${contents150}`,\n },\n hover: {\n backgroundColor: bg100,\n color: contents100,\n leftIconColor: contents100,\n deleteButtonColor: contents150,\n border: `1px solid ${contents100}`,\n },\n disabled: {\n backgroundColor: bg100,\n color: contents200,\n leftIconColor: contents200,\n deleteButtonColor: contents200,\n border: `1px solid ${contents200}`,\n },\n selected: {\n backgroundColor: primary100,\n color: contents999,\n leftIconColor: contents999,\n deleteButtonColor: contents999,\n border: '1px solid transparent',\n },\n selectedHover: {\n backgroundColor: contents100,\n color: contents999,\n leftIconColor: contents999,\n deleteButtonColor: contents999,\n border: '1px solid transparent',\n },\n },\n\n dashedLine: {\n default: {\n backgroundColor: bg100,\n color: contents150,\n leftIconColor: contents150,\n deleteButtonColor: contents200,\n border: `1px dashed ${contents150}`,\n },\n hover: {\n backgroundColor: bg100,\n color: contents100,\n leftIconColor: contents100,\n deleteButtonColor: contents150,\n border: `1px dashed ${contents100}`,\n },\n disabled: {\n backgroundColor: bg100,\n color: contents200,\n leftIconColor: contents200,\n deleteButtonColor: contents200,\n border: `1px dashed ${contents200}`,\n },\n selected: {\n backgroundColor: bg100,\n color: contents000,\n leftIconColor: contents000,\n deleteButtonColor: contents000,\n border: `1px solid ${primary100}`,\n },\n selectedHover: {\n backgroundColor: bg100,\n color: contents100,\n leftIconColor: contents100,\n deleteButtonColor: contents100,\n border: `1px solid ${contents100}`,\n },\n },\n} as const satisfies Record<ChipVariant, unknown>;\n"],"names":["CHIP_SIZE_STYLE","small","typography","padding","height","medium","CHIP_VARIANT_STYLE","filled","backgroundColor","bg200","color","contents150","leftIconColor","deleteButtonColor","contents200","hover","contents100","disabled","bg300","contents300","selected","primary100","contents999","selectedHover","outline","bg100","border","concat","dashedLine","contents000"],"mappings":"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"}
|
|
@@ -34,7 +34,7 @@ var StyledChip = styled__default.default.div(_templateObject4 || (_templateObjec
|
|
|
34
34
|
_ref$$clickable = _ref.$clickable,
|
|
35
35
|
$clickable = _ref$$clickable === void 0 ? false : _ref$$clickable,
|
|
36
36
|
props = _objectWithoutProperties__default.default(_ref, _excluded);
|
|
37
|
-
return styled.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral__default.default(["\n box-sizing: border-box;\n user-select: none;\n cursor: ", ";\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n gap: 4px;\n\n width: fit-content;\n border-radius: 50px;\n text-align:
|
|
37
|
+
return styled.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral__default.default(["\n box-sizing: border-box;\n user-select: none;\n cursor: ", ";\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n gap: 4px;\n\n width: fit-content;\n border-radius: 50px;\n text-align: left;\n transition: all 0.2s ease-in;\n height: auto; \n padding: ", ";\n\n ", "\n \n ", "\n "])), $clickable ? 'pointer' : 'default', _const.CHIP_SIZE_STYLE[$size].padding, mixin.getTypographyStyles(_const.CHIP_SIZE_STYLE[$size].typography), getVariantStyles(_objectSpread({
|
|
38
38
|
$variant: $variant,
|
|
39
39
|
$clickable: $clickable
|
|
40
40
|
}, props)));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.cjs.js","sources":["../../../../src/Chips/Chip/styles.ts"],"sourcesContent":["import { getTypographyStyles } from '@remember-web/mixin';\nimport styled, { css } from 'styled-components';\nimport { CHIP_SIZE_STYLE, CHIP_VARIANT_STYLE } from './const';\nimport type { ChipState, ChipStyleProps } from './types';\n\nconst getVariantStyles = (props: Partial<ChipStyleProps>) => {\n const { $variant = 'filled', $selected, $clickable } = props;\n const getStateStyle = (state: ChipState) => css`\n background-color: ${CHIP_VARIANT_STYLE[$variant][state].backgroundColor};\n color: ${CHIP_VARIANT_STYLE[$variant][state].color};\n border: ${CHIP_VARIANT_STYLE[$variant][state].border || 'none'};\n --left-icon-color: ${CHIP_VARIANT_STYLE[$variant][state].leftIconColor};\n --delete-button-color: ${CHIP_VARIANT_STYLE[$variant][state].deleteButtonColor};\n `;\n\n return css`\n ${getStateStyle('default')};\n\n ${\n $clickable &&\n css`\n &:hover:not([data-chip-disabled='true']) {\n ${getStateStyle($selected ? 'selectedHover' : 'hover')}\n }\n\n ${$selected ? '&' : '&:active'}:not([data-chip-disabled=\"true\"]) {\n ${getStateStyle('selected')} \n }\n `\n }\n \n &[data-chip-disabled='true'] {\n ${getStateStyle('disabled')}\n cursor: not-allowed;\n }\n\n & svg {\n color: var(--left-icon-color);\n }\n\n .delete-button svg {\n color: var(--delete-button-color);\n }\n `;\n};\n\nexport const StyledChip = styled.div<ChipStyleProps>`\n ${({ $size, $variant, $clickable = false, ...props }) => css`\n box-sizing: border-box;\n user-select: none;\n cursor: ${$clickable ? 'pointer' : 'default'};\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n gap: 4px;\n\n width: fit-content;\n border-radius: 50px;\n text-align:
|
|
1
|
+
{"version":3,"file":"styles.cjs.js","sources":["../../../../src/Chips/Chip/styles.ts"],"sourcesContent":["import { getTypographyStyles } from '@remember-web/mixin';\nimport styled, { css } from 'styled-components';\nimport { CHIP_SIZE_STYLE, CHIP_VARIANT_STYLE } from './const';\nimport type { ChipState, ChipStyleProps } from './types';\n\nconst getVariantStyles = (props: Partial<ChipStyleProps>) => {\n const { $variant = 'filled', $selected, $clickable } = props;\n const getStateStyle = (state: ChipState) => css`\n background-color: ${CHIP_VARIANT_STYLE[$variant][state].backgroundColor};\n color: ${CHIP_VARIANT_STYLE[$variant][state].color};\n border: ${CHIP_VARIANT_STYLE[$variant][state].border || 'none'};\n --left-icon-color: ${CHIP_VARIANT_STYLE[$variant][state].leftIconColor};\n --delete-button-color: ${CHIP_VARIANT_STYLE[$variant][state].deleteButtonColor};\n `;\n\n return css`\n ${getStateStyle('default')};\n\n ${\n $clickable &&\n css`\n &:hover:not([data-chip-disabled='true']) {\n ${getStateStyle($selected ? 'selectedHover' : 'hover')}\n }\n\n ${$selected ? '&' : '&:active'}:not([data-chip-disabled=\"true\"]) {\n ${getStateStyle('selected')} \n }\n `\n }\n \n &[data-chip-disabled='true'] {\n ${getStateStyle('disabled')}\n cursor: not-allowed;\n }\n\n & svg {\n color: var(--left-icon-color);\n }\n\n .delete-button svg {\n color: var(--delete-button-color);\n }\n `;\n};\n\nexport const StyledChip = styled.div<ChipStyleProps>`\n ${({ $size, $variant, $clickable = false, ...props }) => css`\n box-sizing: border-box;\n user-select: none;\n cursor: ${$clickable ? 'pointer' : 'default'};\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n gap: 4px;\n\n width: fit-content;\n border-radius: 50px;\n text-align: left;\n transition: all 0.2s ease-in;\n height: auto; \n padding: ${CHIP_SIZE_STYLE[$size].padding};\n\n ${getTypographyStyles(CHIP_SIZE_STYLE[$size].typography)}\n \n ${getVariantStyles({ $variant, $clickable, ...props })}\n `}\n`;\n\nexport const ButtonWrapper = styled.button`\n all: unset;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n `;\n"],"names":["getVariantStyles","props","_props$$variant","$variant","$selected","$clickable","getStateStyle","state","css","_templateObject","_taggedTemplateLiteral","CHIP_VARIANT_STYLE","backgroundColor","color","border","leftIconColor","deleteButtonColor","_templateObject2","_templateObject3","StyledChip","styled","div","_templateObject4","_ref","$size","_ref$$clickable","_objectWithoutProperties","_excluded","_templateObject5","CHIP_SIZE_STYLE","padding","getTypographyStyles","typography","_objectSpread","ButtonWrapper","button","_templateObject6"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/Chips/Chip/styles.ts"],"names":[],"mappings":";AAGA,OAAO,KAAK,EAAa,cAAc,EAAE,MAAM,SAAS,CAAC;AA2CzD,eAAO,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/Chips/Chip/styles.ts"],"names":[],"mappings":";AAGA,OAAO,KAAK,EAAa,cAAc,EAAE,MAAM,SAAS,CAAC;AA2CzD,eAAO,MAAM,UAAU,2NAuBtB,CAAC;AAEF,eAAO,MAAM,aAAa,4NAMvB,CAAC"}
|
|
@@ -25,7 +25,7 @@ var StyledChip = styled.div(_templateObject4 || (_templateObject4 = _taggedTempl
|
|
|
25
25
|
_ref$$clickable = _ref.$clickable,
|
|
26
26
|
$clickable = _ref$$clickable === void 0 ? false : _ref$$clickable,
|
|
27
27
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
28
|
-
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n box-sizing: border-box;\n user-select: none;\n cursor: ", ";\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n gap: 4px;\n\n width: fit-content;\n border-radius: 50px;\n text-align:
|
|
28
|
+
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n box-sizing: border-box;\n user-select: none;\n cursor: ", ";\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n gap: 4px;\n\n width: fit-content;\n border-radius: 50px;\n text-align: left;\n transition: all 0.2s ease-in;\n height: auto; \n padding: ", ";\n\n ", "\n \n ", "\n "])), $clickable ? 'pointer' : 'default', CHIP_SIZE_STYLE[$size].padding, getTypographyStyles(CHIP_SIZE_STYLE[$size].typography), getVariantStyles(_objectSpread({
|
|
29
29
|
$variant: $variant,
|
|
30
30
|
$clickable: $clickable
|
|
31
31
|
}, props)));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.esm.js","sources":["../../../../src/Chips/Chip/styles.ts"],"sourcesContent":["import { getTypographyStyles } from '@remember-web/mixin';\nimport styled, { css } from 'styled-components';\nimport { CHIP_SIZE_STYLE, CHIP_VARIANT_STYLE } from './const';\nimport type { ChipState, ChipStyleProps } from './types';\n\nconst getVariantStyles = (props: Partial<ChipStyleProps>) => {\n const { $variant = 'filled', $selected, $clickable } = props;\n const getStateStyle = (state: ChipState) => css`\n background-color: ${CHIP_VARIANT_STYLE[$variant][state].backgroundColor};\n color: ${CHIP_VARIANT_STYLE[$variant][state].color};\n border: ${CHIP_VARIANT_STYLE[$variant][state].border || 'none'};\n --left-icon-color: ${CHIP_VARIANT_STYLE[$variant][state].leftIconColor};\n --delete-button-color: ${CHIP_VARIANT_STYLE[$variant][state].deleteButtonColor};\n `;\n\n return css`\n ${getStateStyle('default')};\n\n ${\n $clickable &&\n css`\n &:hover:not([data-chip-disabled='true']) {\n ${getStateStyle($selected ? 'selectedHover' : 'hover')}\n }\n\n ${$selected ? '&' : '&:active'}:not([data-chip-disabled=\"true\"]) {\n ${getStateStyle('selected')} \n }\n `\n }\n \n &[data-chip-disabled='true'] {\n ${getStateStyle('disabled')}\n cursor: not-allowed;\n }\n\n & svg {\n color: var(--left-icon-color);\n }\n\n .delete-button svg {\n color: var(--delete-button-color);\n }\n `;\n};\n\nexport const StyledChip = styled.div<ChipStyleProps>`\n ${({ $size, $variant, $clickable = false, ...props }) => css`\n box-sizing: border-box;\n user-select: none;\n cursor: ${$clickable ? 'pointer' : 'default'};\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n gap: 4px;\n\n width: fit-content;\n border-radius: 50px;\n text-align:
|
|
1
|
+
{"version":3,"file":"styles.esm.js","sources":["../../../../src/Chips/Chip/styles.ts"],"sourcesContent":["import { getTypographyStyles } from '@remember-web/mixin';\nimport styled, { css } from 'styled-components';\nimport { CHIP_SIZE_STYLE, CHIP_VARIANT_STYLE } from './const';\nimport type { ChipState, ChipStyleProps } from './types';\n\nconst getVariantStyles = (props: Partial<ChipStyleProps>) => {\n const { $variant = 'filled', $selected, $clickable } = props;\n const getStateStyle = (state: ChipState) => css`\n background-color: ${CHIP_VARIANT_STYLE[$variant][state].backgroundColor};\n color: ${CHIP_VARIANT_STYLE[$variant][state].color};\n border: ${CHIP_VARIANT_STYLE[$variant][state].border || 'none'};\n --left-icon-color: ${CHIP_VARIANT_STYLE[$variant][state].leftIconColor};\n --delete-button-color: ${CHIP_VARIANT_STYLE[$variant][state].deleteButtonColor};\n `;\n\n return css`\n ${getStateStyle('default')};\n\n ${\n $clickable &&\n css`\n &:hover:not([data-chip-disabled='true']) {\n ${getStateStyle($selected ? 'selectedHover' : 'hover')}\n }\n\n ${$selected ? '&' : '&:active'}:not([data-chip-disabled=\"true\"]) {\n ${getStateStyle('selected')} \n }\n `\n }\n \n &[data-chip-disabled='true'] {\n ${getStateStyle('disabled')}\n cursor: not-allowed;\n }\n\n & svg {\n color: var(--left-icon-color);\n }\n\n .delete-button svg {\n color: var(--delete-button-color);\n }\n `;\n};\n\nexport const StyledChip = styled.div<ChipStyleProps>`\n ${({ $size, $variant, $clickable = false, ...props }) => css`\n box-sizing: border-box;\n user-select: none;\n cursor: ${$clickable ? 'pointer' : 'default'};\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n gap: 4px;\n\n width: fit-content;\n border-radius: 50px;\n text-align: left;\n transition: all 0.2s ease-in;\n height: auto; \n padding: ${CHIP_SIZE_STYLE[$size].padding};\n\n ${getTypographyStyles(CHIP_SIZE_STYLE[$size].typography)}\n \n ${getVariantStyles({ $variant, $clickable, ...props })}\n `}\n`;\n\nexport const ButtonWrapper = styled.button`\n all: unset;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n `;\n"],"names":["getVariantStyles","props","_props$$variant","$variant","$selected","$clickable","getStateStyle","state","css","_templateObject","_taggedTemplateLiteral","CHIP_VARIANT_STYLE","backgroundColor","color","border","leftIconColor","deleteButtonColor","_templateObject2","_templateObject3","StyledChip","styled","div","_templateObject4","_ref","$size","_ref$$clickable","_objectWithoutProperties","_excluded","_templateObject5","CHIP_SIZE_STYLE","padding","getTypographyStyles","typography","_objectSpread","ButtonWrapper","button","_templateObject6"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -50,7 +50,7 @@ const meta = {
|
|
|
50
50
|
} satisfies Meta<typeof Chip>;
|
|
51
51
|
|
|
52
52
|
export const Default: Story = {
|
|
53
|
-
render: ({ leftIcon, deleteIcon,
|
|
53
|
+
render: ({ leftIcon, deleteIcon, ...args }) => {
|
|
54
54
|
const leftIconString = String(leftIcon);
|
|
55
55
|
const leftIconElement =
|
|
56
56
|
leftIcon && isIconName(leftIconString)
|
|
@@ -63,6 +63,11 @@ export const Default: Story = {
|
|
|
63
63
|
? createElement(getIconComponentFromName(rightIconString))
|
|
64
64
|
: undefined;
|
|
65
65
|
|
|
66
|
+
if (args.clickable === false && Object.hasOwn(args, 'selected')) {
|
|
67
|
+
const { selected, ...rest } = args;
|
|
68
|
+
args = rest;
|
|
69
|
+
}
|
|
70
|
+
|
|
66
71
|
return (
|
|
67
72
|
<Chip
|
|
68
73
|
{...args}
|
package/src/Chips/Chip/const.ts
CHANGED
|
@@ -15,12 +15,12 @@ import type { ChipSize, ChipVariant, ChipVariantStyleMap } from './types';
|
|
|
15
15
|
export const CHIP_SIZE_STYLE = {
|
|
16
16
|
small: {
|
|
17
17
|
typography: 'Caption1',
|
|
18
|
-
padding: '
|
|
18
|
+
padding: '6px 10px',
|
|
19
19
|
height: '28px',
|
|
20
20
|
},
|
|
21
21
|
medium: {
|
|
22
22
|
typography: 'UIBody3',
|
|
23
|
-
padding: '
|
|
23
|
+
padding: '5px 12px',
|
|
24
24
|
height: '30px',
|
|
25
25
|
},
|
|
26
26
|
} as const satisfies Record<ChipSize, unknown>;
|
package/src/Chips/Chip/styles.ts
CHANGED
|
@@ -58,14 +58,13 @@ export const StyledChip = styled.div<ChipStyleProps>`
|
|
|
58
58
|
|
|
59
59
|
width: fit-content;
|
|
60
60
|
border-radius: 50px;
|
|
61
|
-
text-align:
|
|
61
|
+
text-align: left;
|
|
62
62
|
transition: all 0.2s ease-in;
|
|
63
|
-
|
|
64
|
-
height: ${CHIP_SIZE_STYLE[$size].height};
|
|
63
|
+
height: auto;
|
|
65
64
|
padding: ${CHIP_SIZE_STYLE[$size].padding};
|
|
66
65
|
|
|
67
66
|
${getTypographyStyles(CHIP_SIZE_STYLE[$size].typography)}
|
|
68
|
-
|
|
67
|
+
|
|
69
68
|
${getVariantStyles({ $variant, $clickable, ...props })}
|
|
70
69
|
`}
|
|
71
70
|
`;
|