@elliemae/ds-chip 3.70.0-next.52 → 3.70.0-next.54

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.
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/config/useConfig.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["// import { useCallback } from 'react';\nimport type { GlobalAttributesT } from '@elliemae/ds-props-helpers';\nimport {\n useMemoMergePropsWithDefault,\n useGetGlobalAttributes,\n useValidateTypescriptPropTypes,\n useGetXstyledProps,\n useOwnerProps,\n} from '@elliemae/ds-props-helpers';\nimport { DSChipName } from '../constants/index.js';\nimport type { DSChipT } from '../react-desc-prop-types.js';\nimport { DSChipDefaultProps, DSChipPropTypes } from '../react-desc-prop-types.js';\n\nexport const useConfig = (props: DSChipT.Props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSChipT.InternalProps>(props, DSChipDefaultProps);\n\n useValidateTypescriptPropTypes(propsWithDefault, DSChipPropTypes, DSChipName);\n\n // const { applyAriaDisabled, onClick } = propsWithDefault;\n // const handleOnClick = useCallback(\n // (e: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n // if (applyAriaDisabled) {\n // console.log('retorno viejo');\n // return;\n // }\n // if (onClick) {\n // onClick(e);\n // }\n // },\n // [applyAriaDisabled, onClick],\n // );\n\n // exclude `shape` AND `label` as they are reused reserved keyword from global props,\n // we intend to \"consume\" those props, not \"spread\" in the html\n const { shape, label, ...globalPropsWithoutReusedReservedKeywords } = propsWithDefault;\n const globalAttrs = useGetGlobalAttributes<\n Omit<DSChipT.InternalProps, 'shape' | 'label'>,\n HTMLButtonElement,\n { type?: 'button' | 'reset' | 'submit' }\n >(globalPropsWithoutReusedReservedKeywords) as Omit<\n GlobalAttributesT<HTMLButtonElement, { type?: 'button' | 'reset' | 'submit' }>,\n 'shape' | 'label'\n >;\n\n const xStyledAttrs = useGetXstyledProps(propsWithDefault);\n const ownerPropsConfig = useOwnerProps(propsWithDefault, { ...props });\n\n return { ...propsWithDefault, globalAttrs, xStyledAttrs, ownerPropsConfig };\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAMO;AACP,uBAA2B;AAE3B,mCAAoD;AAE7C,MAAM,YAAY,CAAC,UAAyB;AACjD,QAAM,uBAAmB,sDAAoD,OAAO,+CAAkB;AAEtG,8DAA+B,kBAAkB,8CAAiB,2BAAU;AAkB5E,QAAM,EAAE,OAAO,OAAO,GAAG,yCAAyC,IAAI;AACtE,QAAM,kBAAc,gDAIlB,wCAAwC;AAK1C,QAAM,mBAAe,4CAAmB,gBAAgB;AACxD,QAAM,uBAAmB,uCAAc,kBAAkB,EAAE,GAAG,MAAM,CAAC;AAErE,SAAO,EAAE,GAAG,kBAAkB,aAAa,cAAc,iBAAiB;AAC5E;",
4
+ "sourcesContent": ["// import { useCallback } from 'react';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport {\n useMemoMergePropsWithDefault,\n useGetGlobalAttributes,\n useValidateTypescriptPropTypes,\n useGetXstyledProps,\n useOwnerProps,\n} from '@elliemae/ds-props-helpers';\nimport { DSChipName } from '../constants/index.js';\nimport type { DSChipT } from '../react-desc-prop-types.js';\nimport { DSChipDefaultProps, DSChipPropTypes } from '../react-desc-prop-types.js';\n\n// Explicit return type works around TS2742: without it, the inferred return type\n// requires naming a `pui-theme` type nested inside ds-system's own node_modules,\n// which is not portable across the package boundary during .d.ts generation.\n// https://github.com/microsoft/TypeScript/issues/47663\nexport const useConfig = (\n props: DSChipT.Props,\n): DSChipT.InternalProps & {\n globalAttrs: Omit<GlobalAttributesT<HTMLButtonElement, { type?: 'button' | 'reset' | 'submit' }>, 'shape' | 'label'>;\n xStyledAttrs: XstyledProps;\n ownerPropsConfig: ReturnType<typeof useOwnerProps<DSChipT.InternalProps, DSChipT.Props>>;\n} => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSChipT.InternalProps>(props, DSChipDefaultProps);\n\n useValidateTypescriptPropTypes(propsWithDefault, DSChipPropTypes, DSChipName);\n\n // const { applyAriaDisabled, onClick } = propsWithDefault;\n // const handleOnClick = useCallback(\n // (e: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n // if (applyAriaDisabled) {\n // console.log('retorno viejo');\n // return;\n // }\n // if (onClick) {\n // onClick(e);\n // }\n // },\n // [applyAriaDisabled, onClick],\n // );\n\n // exclude `shape` AND `label` as they are reused reserved keyword from global props,\n // we intend to \"consume\" those props, not \"spread\" in the html\n const { shape, label, ...globalPropsWithoutReusedReservedKeywords } = propsWithDefault;\n const globalAttrs = useGetGlobalAttributes<\n Omit<DSChipT.InternalProps, 'shape' | 'label'>,\n HTMLButtonElement,\n { type?: 'button' | 'reset' | 'submit' }\n >(globalPropsWithoutReusedReservedKeywords) as Omit<\n GlobalAttributesT<HTMLButtonElement, { type?: 'button' | 'reset' | 'submit' }>,\n 'shape' | 'label'\n >;\n\n const xStyledAttrs = useGetXstyledProps(propsWithDefault);\n const ownerPropsConfig = useOwnerProps(propsWithDefault, { ...props });\n\n return { ...propsWithDefault, globalAttrs, xStyledAttrs, ownerPropsConfig };\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAMO;AACP,uBAA2B;AAE3B,mCAAoD;AAM7C,MAAM,YAAY,CACvB,UAKG;AACH,QAAM,uBAAmB,sDAAoD,OAAO,+CAAkB;AAEtG,8DAA+B,kBAAkB,8CAAiB,2BAAU;AAkB5E,QAAM,EAAE,OAAO,OAAO,GAAG,yCAAyC,IAAI;AACtE,QAAM,kBAAc,gDAIlB,wCAAwC;AAK1C,QAAM,mBAAe,4CAAmB,gBAAgB;AACxD,QAAM,uBAAmB,uCAAc,kBAAkB,EAAE,GAAG,MAAM,CAAC;AAErE,SAAO,EAAE,GAAG,kBAAkB,aAAa,cAAc,iBAAiB;AAC5E;",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/react-desc-prop-types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import type React from 'react';\nimport type { GlobalAttributesT, XstyledProps, ValidationMap, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport {\n PropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n getPropsPerSlotPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport {\n CHIP_SIZES,\n CHIP_SHAPES,\n ChipSizesValuesArray,\n ChipSizesValuesString,\n ChipShapesValuesArray,\n ChipShapesValuesString,\n DSChipName,\n CHIP_SLOTS,\n} from './constants/index.js';\nimport type { ChipSizesT, ChipShapesT } from './sharedTypes.js';\n\nexport const DSChipDefaultProps: DSChipT.DefaultProps = {\n size: CHIP_SIZES.L,\n shape: CHIP_SHAPES.DEFAULT,\n applyAriaDisabled: false,\n wrapText: false,\n};\n\nexport declare namespace DSChipT {\n export interface DefaultProps {\n size: ChipSizesT;\n shape: ChipShapesT;\n applyAriaDisabled: boolean;\n wrapText: boolean;\n }\n export interface OptionalProps\n extends TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSChipName, typeof CHIP_SLOTS> {\n selected?: boolean;\n innerRef?: React.RefObject<HTMLButtonElement> | ((_ref: HTMLButtonElement) => void);\n }\n\n export interface RequiredProps {\n label: string;\n icon: React.ComponentType<{\n size?: string;\n }>;\n }\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLElement>,\n keyof DefaultProps | keyof XstyledProps | keyof RequiredProps | keyof OptionalProps\n >,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLElement>,\n keyof DefaultProps | keyof XstyledProps | keyof RequiredProps | keyof OptionalProps\n >,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const DSChipPropTypes: DSPropTypesSchema<DSChipT.Props> = {\n ...getPropsPerSlotPropTypes(DSChipName, CHIP_SLOTS),\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n icon: PropTypes.func.isRequired.description('Chip Icon').defaultValue(() => {}),\n label: PropTypes.string.isRequired.description('Chip Label').defaultValue(''),\n selected: PropTypes.bool.description('Whether chip is selected').defaultValue(''),\n shape: PropTypes.oneOf(ChipShapesValuesArray).description(ChipShapesValuesString).defaultValue(CHIP_SHAPES.DEFAULT),\n size: PropTypes.oneOf(ChipSizesValuesArray).description(ChipSizesValuesString).defaultValue(CHIP_SIZES.L),\n applyAriaDisabled: PropTypes.bool\n .description(\n 'Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION.',\n )\n .defaultValue(false),\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('Inner ref to button component.'),\n wrapText: PropTypes.bool.description('wrap text in the label of the chip').defaultValue(false),\n};\n\nexport const DSChipPropTypesSchema = DSChipPropTypes as unknown as ValidationMap<DSChipT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,8BAKO;AACP,uBASO;AAGA,MAAM,qBAA2C;AAAA,EACtD,MAAM,4BAAW;AAAA,EACjB,OAAO,6BAAY;AAAA,EACnB,mBAAmB;AAAA,EACnB,UAAU;AACZ;AA0CO,MAAM,kBAAoD;AAAA,EAC/D,OAAG,kDAAyB,6BAAY,2BAAU;AAAA,EAClD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,MAAM,kCAAU,KAAK,WAAW,YAAY,WAAW,EAAE,aAAa,MAAM;AAAA,EAAC,CAAC;AAAA,EAC9E,OAAO,kCAAU,OAAO,WAAW,YAAY,YAAY,EAAE,aAAa,EAAE;AAAA,EAC5E,UAAU,kCAAU,KAAK,YAAY,0BAA0B,EAAE,aAAa,EAAE;AAAA,EAChF,OAAO,kCAAU,MAAM,sCAAqB,EAAE,YAAY,uCAAsB,EAAE,aAAa,6BAAY,OAAO;AAAA,EAClH,MAAM,kCAAU,MAAM,qCAAoB,EAAE,YAAY,sCAAqB,EAAE,aAAa,4BAAW,CAAC;AAAA,EACxG,mBAAmB,kCAAU,KAC1B;AAAA,IACC;AAAA,EACF,EACC,aAAa,KAAK;AAAA,EACrB,UAAU,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,IAAI,CAAC,EAAE,YAAY,gCAAgC;AAAA,EAC9G,UAAU,kCAAU,KAAK,YAAY,oCAAoC,EAAE,aAAa,KAAK;AAC/F;AAEO,MAAM,wBAAwB;",
4
+ "sourcesContent": ["import type React from 'react';\nimport type { GlobalAttributesT, XstyledProps, ValidationMap, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport {\n PropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n getPropsPerSlotPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport {\n CHIP_SIZES,\n CHIP_SHAPES,\n ChipSizesValuesArray,\n ChipSizesValuesString,\n ChipShapesValuesArray,\n ChipShapesValuesString,\n DSChipName,\n CHIP_SLOTS,\n} from './constants/index.js';\nimport type { ChipSizesT, ChipShapesT } from './sharedTypes.js';\n\nexport const DSChipDefaultProps: DSChipT.DefaultProps = {\n size: CHIP_SIZES.L,\n shape: CHIP_SHAPES.DEFAULT,\n applyAriaDisabled: false,\n wrapText: false,\n};\n\nexport declare namespace DSChipT {\n export interface DefaultProps {\n size: ChipSizesT;\n shape: ChipShapesT;\n applyAriaDisabled: boolean;\n wrapText: boolean;\n }\n export interface OptionalProps extends TypescriptHelpersT.PropsForGlobalOnSlots<\n typeof DSChipName,\n typeof CHIP_SLOTS\n > {\n selected?: boolean;\n innerRef?: React.RefObject<HTMLButtonElement> | ((_ref: HTMLButtonElement) => void);\n }\n\n export interface RequiredProps {\n label: string;\n icon: React.ComponentType<{\n size?: string;\n }>;\n }\n export interface Props\n extends\n Partial<DefaultProps>,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLElement>,\n keyof DefaultProps | keyof XstyledProps | keyof RequiredProps | keyof OptionalProps\n >,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends\n DefaultProps,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLElement>,\n keyof DefaultProps | keyof XstyledProps | keyof RequiredProps | keyof OptionalProps\n >,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const DSChipPropTypes: DSPropTypesSchema<DSChipT.Props> = {\n ...getPropsPerSlotPropTypes(DSChipName, CHIP_SLOTS),\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n icon: PropTypes.func.isRequired.description('Chip Icon').defaultValue(() => {}),\n label: PropTypes.string.isRequired.description('Chip Label').defaultValue(''),\n selected: PropTypes.bool.description('Whether chip is selected').defaultValue(''),\n shape: PropTypes.oneOf(ChipShapesValuesArray).description(ChipShapesValuesString).defaultValue(CHIP_SHAPES.DEFAULT),\n size: PropTypes.oneOf(ChipSizesValuesArray).description(ChipSizesValuesString).defaultValue(CHIP_SIZES.L),\n applyAriaDisabled: PropTypes.bool\n .description(\n 'Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION.',\n )\n .defaultValue(false),\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('Inner ref to button component.'),\n wrapText: PropTypes.bool.description('wrap text in the label of the chip').defaultValue(false),\n};\n\nexport const DSChipPropTypesSchema = DSChipPropTypes as unknown as ValidationMap<DSChipT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,8BAKO;AACP,uBASO;AAGA,MAAM,qBAA2C;AAAA,EACtD,MAAM,4BAAW;AAAA,EACjB,OAAO,6BAAY;AAAA,EACnB,mBAAmB;AAAA,EACnB,UAAU;AACZ;AA8CO,MAAM,kBAAoD;AAAA,EAC/D,OAAG,kDAAyB,6BAAY,2BAAU;AAAA,EAClD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,MAAM,kCAAU,KAAK,WAAW,YAAY,WAAW,EAAE,aAAa,MAAM;AAAA,EAAC,CAAC;AAAA,EAC9E,OAAO,kCAAU,OAAO,WAAW,YAAY,YAAY,EAAE,aAAa,EAAE;AAAA,EAC5E,UAAU,kCAAU,KAAK,YAAY,0BAA0B,EAAE,aAAa,EAAE;AAAA,EAChF,OAAO,kCAAU,MAAM,sCAAqB,EAAE,YAAY,uCAAsB,EAAE,aAAa,6BAAY,OAAO;AAAA,EAClH,MAAM,kCAAU,MAAM,qCAAoB,EAAE,YAAY,sCAAqB,EAAE,aAAa,4BAAW,CAAC;AAAA,EACxG,mBAAmB,kCAAU,KAC1B;AAAA,IACC;AAAA,EACF,EACC,aAAa,KAAK;AAAA,EACrB,UAAU,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,IAAI,CAAC,EAAE,YAAY,gCAAgC;AAAA,EAC9G,UAAU,kCAAU,KAAK,YAAY,oCAAoC,EAAE,aAAa,KAAK;AAC/F;AAEO,MAAM,wBAAwB;",
6
6
  "names": []
7
7
  }
@@ -245,10 +245,10 @@ const StyledChip = (0, import_ds_system.styled)("button", { name: import_constan
245
245
  &:focus {
246
246
  &:before {
247
247
  ${buttonShape === import_constants.CHIP_SHAPES.ROUND ? import_ds_system.css`
248
- border: 2px solid ${({ theme }) => theme.colors.brand[800]};
249
- ` : import_ds_system.css`
250
- border: 2px solid ${({ theme }) => theme.colors.brand[700]};
251
- `}
248
+ border: 2px solid ${({ theme }) => theme.colors.brand[800]};
249
+ ` : import_ds_system.css`
250
+ border: 2px solid ${({ theme }) => theme.colors.brand[700]};
251
+ `}
252
252
  }
253
253
  }
254
254
  `}
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/styles.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable max-lines */\nimport { styled, css, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport {\n basicSizes,\n shapeSizes,\n CHIP_SHAPES,\n CHIP_SIZES,\n roundShapeLarge,\n roundShapeSmall,\n DSChipName,\n CHIP_SLOTS,\n roundShapeLargeMobile,\n roundShapeSmallMobile,\n} from './constants/index.js';\nimport type { ChipShapesT, ChipSizesT } from './sharedTypes.js';\n\nexport interface StyledChipPropsT {\n buttonSize: ChipSizesT;\n buttonShape: ChipShapesT;\n selected?: boolean;\n wrapText?: boolean;\n}\n\nexport interface StyledRoundShapePropsT {\n size: ChipSizesT;\n disabled?: boolean;\n}\n\nconst getChipSize = (shape: ChipShapesT) => (shape === CHIP_SHAPES.ROUND ? shapeSizes : basicSizes);\n\nconst wrapTextStyles = css`\n overflow-wrap: break-word;\n white-space: pre-wrap;\n overflow: visible;\n`;\n\nconst ellipsisStyles = css`\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const StyledChipLabel = styled('div', { name: DSChipName, slot: CHIP_SLOTS.LABEL })<{ size: ChipSizesT }>`\n font-size: ${({ theme }) => theme.fontSizes.label[200]};\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n word-wrap: break-word;\n text-align: center;\n padding-top: ${({ size }) => (size === CHIP_SIZES.L ? '2px' : '4px')};\n z-index: 0;\n line-height: 1.27;\n width: inherit;\n display: flex;\n align-items: center;\n justify-content: center;\n`;\n\nexport const StyledSpanWithEllipsis = styled(DSTypography, {\n name: DSChipName,\n slot: CHIP_SLOTS.ELLIPSIS,\n})<{ wrapText?: boolean }>`\n ${({ wrapText }) => (wrapText ? wrapTextStyles : ellipsisStyles)};\n max-width: 100%;\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n`;\n\nexport const StyledWrapper = styled('div', {\n name: DSChipName,\n slot: CHIP_SLOTS.ROOT,\n})<StyledChipPropsT>`\n display: flex;\n width: ${({ buttonSize, buttonShape }) => getChipSize(buttonShape)[buttonSize].width};\n ${xStyledCommonProps}\n max-width: ${({ buttonSize }) => basicSizes[buttonSize].maxWidth};\n ${({ wrapText, buttonSize, buttonShape }) =>\n wrapText ? `height: auto;` : ` height: ${getChipSize(buttonShape)[buttonSize].height};`}\n`;\n\nconst disabledRoundShape = css`\n background-color: ${({ theme }) => theme.colors.neutral[200]};\n\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral[500]};\n }\n`;\n\nexport const StyledRoundShape = styled('div', {\n name: DSChipName,\n slot: CHIP_SLOTS.ROUND_SHAPE,\n})<StyledRoundShapePropsT>`\n background-color: ${({ theme }) => theme.colors.brand[600]};\n width: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLarge : roundShapeSmall)};\n height: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLarge : roundShapeSmall)};\n border-radius: 50px;\n display: flex;\n align-items: center;\n justify-content: center;\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n width: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLargeMobile : roundShapeSmallMobile)};\n height: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLargeMobile : roundShapeSmallMobile)};\n }\n`;\n\nconst styledChipSelectedCss = css`\n // TODO: wrap css processor to process new HOC wrapping styled components\n ${StyledRoundShape.toString()} {\n background-color: ${({ theme }) => theme.colors.brand[800]};\n }\n color: ${({ theme }) => theme.colors.brand[800]};\n background-color: ${({ theme }) => theme.colors.brand[200]};\n\n .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[800]};\n }\n\n &:before {\n border: 1px solid ${({ theme }) => theme.colors.brand[600]};\n }\n\n &:focus {\n &:before {\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n }\n }\n`;\n\nconst disabledStyles = css`\n color: ${({ theme }) => theme.colors.neutral[500]};\n\n .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral[400]};\n }\n\n &:hover {\n ${StyledRoundShape} {\n background-color: ${({ theme }) => theme.colors.neutral[200]};\n }\n background-color: ${({ theme }) => theme.colors.neutral['050']};\n cursor: not-allowed;\n &:before {\n border-color: transparent;\n }\n }\n`;\n\nexport const StyledChip = styled('button', { name: DSChipName, slot: CHIP_SLOTS.BUTTON })<\n Pick<StyledChipPropsT, 'selected' | 'buttonShape' | 'buttonSize' | 'wrapText'>\n>`\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n border: none;\n min-height: 100%;\n height: fit-content;\n width: 100%;\n background-color: ${({ theme }) => theme.colors.neutral['000']};\n color: ${({ theme }) => theme.colors.brand[600]};\n border-radius: 4px;\n cursor: pointer;\n outline: none;\n ${({ buttonShape, buttonSize }) => {\n if (buttonShape === CHIP_SHAPES.ROUND && buttonSize === CHIP_SIZES.L) {\n return css`\n padding: 6px;\n `;\n }\n return css`\n padding: 10px 6px;\n `;\n }}\n ${StyledRoundShape} {\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral['000']};\n }\n ${({ disabled }) => disabled && disabledRoundShape}\n }\n &:before {\n content: '';\n position: absolute;\n z-index: 20;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border-radius: 4px;\n border: 2px solid transparent;\n pointer-events: none;\n }\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[600]};\n color: ${({ theme }) => theme.colors.neutral[600]};\n }\n\n &:hover,\n &:focus {\n z-index: 10;\n ${StyledSpanWithEllipsis} {\n ${({ wrapText }) =>\n !wrapText &&\n css`\n ${wrapTextStyles}\n `}\n }\n }\n\n &:hover {\n ${StyledRoundShape} {\n background-color: ${({ theme }) => theme.colors.brand[800]};\n }\n color: ${({ theme }) => theme.colors.brand[800]};\n background-color: ${({ theme }) => theme.colors.brand[200]};\n .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[800]};\n }\n }\n\n &:focus {\n &:before {\n ${({ buttonShape }) =>\n buttonShape === CHIP_SHAPES.ROUND\n ? css`\n border: 2px solid ${({ theme }) => theme.colors.brand[800]};\n `\n : css`\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n `}\n }\n }\n\n &:disabled {\n ${disabledStyles}\n }\n\n &[aria-disabled='true'] {\n ${disabledStyles}\n ${StyledRoundShape} {\n ${disabledRoundShape}\n }\n\n &:focus {\n &:before {\n border: 2px solid ${({ theme }) => theme.colors.neutral[400]};\n }\n }\n }\n\n ${({ selected, buttonShape }) =>\n !selected\n ? ''\n : css`\n ${styledChipSelectedCss}\n &:focus {\n &:before {\n ${buttonShape === CHIP_SHAPES.ROUND\n ? css`\n border: 2px solid ${({ theme }) => theme.colors.brand[800]};\n `\n : css`\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n `}\n }\n }\n `}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/* eslint-disable max-lines */\nimport { styled, css, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport {\n basicSizes,\n shapeSizes,\n CHIP_SHAPES,\n CHIP_SIZES,\n roundShapeLarge,\n roundShapeSmall,\n DSChipName,\n CHIP_SLOTS,\n roundShapeLargeMobile,\n roundShapeSmallMobile,\n} from './constants/index.js';\nimport type { ChipShapesT, ChipSizesT } from './sharedTypes.js';\n\nexport interface StyledChipPropsT {\n buttonSize: ChipSizesT;\n buttonShape: ChipShapesT;\n selected?: boolean;\n wrapText?: boolean;\n}\n\nexport interface StyledRoundShapePropsT {\n size: ChipSizesT;\n disabled?: boolean;\n}\n\nconst getChipSize = (shape: ChipShapesT) => (shape === CHIP_SHAPES.ROUND ? shapeSizes : basicSizes);\n\nconst wrapTextStyles = css`\n overflow-wrap: break-word;\n white-space: pre-wrap;\n overflow: visible;\n`;\n\nconst ellipsisStyles = css`\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const StyledChipLabel = styled('div', { name: DSChipName, slot: CHIP_SLOTS.LABEL })<{ size: ChipSizesT }>`\n font-size: ${({ theme }) => theme.fontSizes.label[200]};\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n word-wrap: break-word;\n text-align: center;\n padding-top: ${({ size }) => (size === CHIP_SIZES.L ? '2px' : '4px')};\n z-index: 0;\n line-height: 1.27;\n width: inherit;\n display: flex;\n align-items: center;\n justify-content: center;\n`;\n\nexport const StyledSpanWithEllipsis = styled(DSTypography, {\n name: DSChipName,\n slot: CHIP_SLOTS.ELLIPSIS,\n})<{ wrapText?: boolean }>`\n ${({ wrapText }) => (wrapText ? wrapTextStyles : ellipsisStyles)};\n max-width: 100%;\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n`;\n\nexport const StyledWrapper = styled('div', {\n name: DSChipName,\n slot: CHIP_SLOTS.ROOT,\n})<StyledChipPropsT>`\n display: flex;\n width: ${({ buttonSize, buttonShape }) => getChipSize(buttonShape)[buttonSize].width};\n ${xStyledCommonProps}\n max-width: ${({ buttonSize }) => basicSizes[buttonSize].maxWidth};\n ${({ wrapText, buttonSize, buttonShape }) =>\n wrapText ? `height: auto;` : ` height: ${getChipSize(buttonShape)[buttonSize].height};`}\n`;\n\nconst disabledRoundShape = css`\n background-color: ${({ theme }) => theme.colors.neutral[200]};\n\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral[500]};\n }\n`;\n\nexport const StyledRoundShape = styled('div', {\n name: DSChipName,\n slot: CHIP_SLOTS.ROUND_SHAPE,\n})<StyledRoundShapePropsT>`\n background-color: ${({ theme }) => theme.colors.brand[600]};\n width: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLarge : roundShapeSmall)};\n height: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLarge : roundShapeSmall)};\n border-radius: 50px;\n display: flex;\n align-items: center;\n justify-content: center;\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n width: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLargeMobile : roundShapeSmallMobile)};\n height: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLargeMobile : roundShapeSmallMobile)};\n }\n`;\n\nconst styledChipSelectedCss = css`\n // TODO: wrap css processor to process new HOC wrapping styled components\n ${StyledRoundShape.toString()} {\n background-color: ${({ theme }) => theme.colors.brand[800]};\n }\n color: ${({ theme }) => theme.colors.brand[800]};\n background-color: ${({ theme }) => theme.colors.brand[200]};\n\n .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[800]};\n }\n\n &:before {\n border: 1px solid ${({ theme }) => theme.colors.brand[600]};\n }\n\n &:focus {\n &:before {\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n }\n }\n`;\n\nconst disabledStyles = css`\n color: ${({ theme }) => theme.colors.neutral[500]};\n\n .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral[400]};\n }\n\n &:hover {\n ${StyledRoundShape} {\n background-color: ${({ theme }) => theme.colors.neutral[200]};\n }\n background-color: ${({ theme }) => theme.colors.neutral['050']};\n cursor: not-allowed;\n &:before {\n border-color: transparent;\n }\n }\n`;\n\nexport const StyledChip = styled('button', { name: DSChipName, slot: CHIP_SLOTS.BUTTON })<\n Pick<StyledChipPropsT, 'selected' | 'buttonShape' | 'buttonSize' | 'wrapText'>\n>`\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n border: none;\n min-height: 100%;\n height: fit-content;\n width: 100%;\n background-color: ${({ theme }) => theme.colors.neutral['000']};\n color: ${({ theme }) => theme.colors.brand[600]};\n border-radius: 4px;\n cursor: pointer;\n outline: none;\n ${({ buttonShape, buttonSize }) => {\n if (buttonShape === CHIP_SHAPES.ROUND && buttonSize === CHIP_SIZES.L) {\n return css`\n padding: 6px;\n `;\n }\n return css`\n padding: 10px 6px;\n `;\n }}\n ${StyledRoundShape} {\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral['000']};\n }\n ${({ disabled }) => disabled && disabledRoundShape}\n }\n &:before {\n content: '';\n position: absolute;\n z-index: 20;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border-radius: 4px;\n border: 2px solid transparent;\n pointer-events: none;\n }\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[600]};\n color: ${({ theme }) => theme.colors.neutral[600]};\n }\n\n &:hover,\n &:focus {\n z-index: 10;\n ${StyledSpanWithEllipsis} {\n ${({ wrapText }) =>\n !wrapText &&\n css`\n ${wrapTextStyles}\n `}\n }\n }\n\n &:hover {\n ${StyledRoundShape} {\n background-color: ${({ theme }) => theme.colors.brand[800]};\n }\n color: ${({ theme }) => theme.colors.brand[800]};\n background-color: ${({ theme }) => theme.colors.brand[200]};\n .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[800]};\n }\n }\n\n &:focus {\n &:before {\n ${({ buttonShape }) =>\n buttonShape === CHIP_SHAPES.ROUND\n ? css`\n border: 2px solid ${({ theme }) => theme.colors.brand[800]};\n `\n : css`\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n `}\n }\n }\n\n &:disabled {\n ${disabledStyles}\n }\n\n &[aria-disabled='true'] {\n ${disabledStyles}\n ${StyledRoundShape} {\n ${disabledRoundShape}\n }\n\n &:focus {\n &:before {\n border: 2px solid ${({ theme }) => theme.colors.neutral[400]};\n }\n }\n }\n\n ${({ selected, buttonShape }) =>\n !selected\n ? ''\n : css`\n ${styledChipSelectedCss}\n &:focus {\n &:before {\n ${\n buttonShape === CHIP_SHAPES.ROUND\n ? css`\n border: 2px solid ${({ theme }) => theme.colors.brand[800]};\n `\n : css`\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n `\n }\n }\n }\n `}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useConfig.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// import { useCallback } from 'react';\nimport type { GlobalAttributesT } from '@elliemae/ds-props-helpers';\nimport {\n useMemoMergePropsWithDefault,\n useGetGlobalAttributes,\n useValidateTypescriptPropTypes,\n useGetXstyledProps,\n useOwnerProps,\n} from '@elliemae/ds-props-helpers';\nimport { DSChipName } from '../constants/index.js';\nimport type { DSChipT } from '../react-desc-prop-types.js';\nimport { DSChipDefaultProps, DSChipPropTypes } from '../react-desc-prop-types.js';\n\nexport const useConfig = (props: DSChipT.Props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSChipT.InternalProps>(props, DSChipDefaultProps);\n\n useValidateTypescriptPropTypes(propsWithDefault, DSChipPropTypes, DSChipName);\n\n // const { applyAriaDisabled, onClick } = propsWithDefault;\n // const handleOnClick = useCallback(\n // (e: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n // if (applyAriaDisabled) {\n // console.log('retorno viejo');\n // return;\n // }\n // if (onClick) {\n // onClick(e);\n // }\n // },\n // [applyAriaDisabled, onClick],\n // );\n\n // exclude `shape` AND `label` as they are reused reserved keyword from global props,\n // we intend to \"consume\" those props, not \"spread\" in the html\n const { shape, label, ...globalPropsWithoutReusedReservedKeywords } = propsWithDefault;\n const globalAttrs = useGetGlobalAttributes<\n Omit<DSChipT.InternalProps, 'shape' | 'label'>,\n HTMLButtonElement,\n { type?: 'button' | 'reset' | 'submit' }\n >(globalPropsWithoutReusedReservedKeywords) as Omit<\n GlobalAttributesT<HTMLButtonElement, { type?: 'button' | 'reset' | 'submit' }>,\n 'shape' | 'label'\n >;\n\n const xStyledAttrs = useGetXstyledProps(propsWithDefault);\n const ownerPropsConfig = useOwnerProps(propsWithDefault, { ...props });\n\n return { ...propsWithDefault, globalAttrs, xStyledAttrs, ownerPropsConfig };\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACEvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,kBAAkB;AAE3B,SAAS,oBAAoB,uBAAuB;AAE7C,MAAM,YAAY,CAAC,UAAyB;AACjD,QAAM,mBAAmB,6BAAoD,OAAO,kBAAkB;AAEtG,iCAA+B,kBAAkB,iBAAiB,UAAU;AAkB5E,QAAM,EAAE,OAAO,OAAO,GAAG,yCAAyC,IAAI;AACtE,QAAM,cAAc,uBAIlB,wCAAwC;AAK1C,QAAM,eAAe,mBAAmB,gBAAgB;AACxD,QAAM,mBAAmB,cAAc,kBAAkB,EAAE,GAAG,MAAM,CAAC;AAErE,SAAO,EAAE,GAAG,kBAAkB,aAAa,cAAc,iBAAiB;AAC5E;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// import { useCallback } from 'react';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport {\n useMemoMergePropsWithDefault,\n useGetGlobalAttributes,\n useValidateTypescriptPropTypes,\n useGetXstyledProps,\n useOwnerProps,\n} from '@elliemae/ds-props-helpers';\nimport { DSChipName } from '../constants/index.js';\nimport type { DSChipT } from '../react-desc-prop-types.js';\nimport { DSChipDefaultProps, DSChipPropTypes } from '../react-desc-prop-types.js';\n\n// Explicit return type works around TS2742: without it, the inferred return type\n// requires naming a `pui-theme` type nested inside ds-system's own node_modules,\n// which is not portable across the package boundary during .d.ts generation.\n// https://github.com/microsoft/TypeScript/issues/47663\nexport const useConfig = (\n props: DSChipT.Props,\n): DSChipT.InternalProps & {\n globalAttrs: Omit<GlobalAttributesT<HTMLButtonElement, { type?: 'button' | 'reset' | 'submit' }>, 'shape' | 'label'>;\n xStyledAttrs: XstyledProps;\n ownerPropsConfig: ReturnType<typeof useOwnerProps<DSChipT.InternalProps, DSChipT.Props>>;\n} => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSChipT.InternalProps>(props, DSChipDefaultProps);\n\n useValidateTypescriptPropTypes(propsWithDefault, DSChipPropTypes, DSChipName);\n\n // const { applyAriaDisabled, onClick } = propsWithDefault;\n // const handleOnClick = useCallback(\n // (e: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n // if (applyAriaDisabled) {\n // console.log('retorno viejo');\n // return;\n // }\n // if (onClick) {\n // onClick(e);\n // }\n // },\n // [applyAriaDisabled, onClick],\n // );\n\n // exclude `shape` AND `label` as they are reused reserved keyword from global props,\n // we intend to \"consume\" those props, not \"spread\" in the html\n const { shape, label, ...globalPropsWithoutReusedReservedKeywords } = propsWithDefault;\n const globalAttrs = useGetGlobalAttributes<\n Omit<DSChipT.InternalProps, 'shape' | 'label'>,\n HTMLButtonElement,\n { type?: 'button' | 'reset' | 'submit' }\n >(globalPropsWithoutReusedReservedKeywords) as Omit<\n GlobalAttributesT<HTMLButtonElement, { type?: 'button' | 'reset' | 'submit' }>,\n 'shape' | 'label'\n >;\n\n const xStyledAttrs = useGetXstyledProps(propsWithDefault);\n const ownerPropsConfig = useOwnerProps(propsWithDefault, { ...props });\n\n return { ...propsWithDefault, globalAttrs, xStyledAttrs, ownerPropsConfig };\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACEvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,kBAAkB;AAE3B,SAAS,oBAAoB,uBAAuB;AAM7C,MAAM,YAAY,CACvB,UAKG;AACH,QAAM,mBAAmB,6BAAoD,OAAO,kBAAkB;AAEtG,iCAA+B,kBAAkB,iBAAiB,UAAU;AAkB5E,QAAM,EAAE,OAAO,OAAO,GAAG,yCAAyC,IAAI;AACtE,QAAM,cAAc,uBAIlB,wCAAwC;AAK1C,QAAM,eAAe,mBAAmB,gBAAgB;AACxD,QAAM,mBAAmB,cAAc,kBAAkB,EAAE,GAAG,MAAM,CAAC;AAErE,SAAO,EAAE,GAAG,kBAAkB,aAAa,cAAc,iBAAiB;AAC5E;",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport type { GlobalAttributesT, XstyledProps, ValidationMap, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport {\n PropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n getPropsPerSlotPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport {\n CHIP_SIZES,\n CHIP_SHAPES,\n ChipSizesValuesArray,\n ChipSizesValuesString,\n ChipShapesValuesArray,\n ChipShapesValuesString,\n DSChipName,\n CHIP_SLOTS,\n} from './constants/index.js';\nimport type { ChipSizesT, ChipShapesT } from './sharedTypes.js';\n\nexport const DSChipDefaultProps: DSChipT.DefaultProps = {\n size: CHIP_SIZES.L,\n shape: CHIP_SHAPES.DEFAULT,\n applyAriaDisabled: false,\n wrapText: false,\n};\n\nexport declare namespace DSChipT {\n export interface DefaultProps {\n size: ChipSizesT;\n shape: ChipShapesT;\n applyAriaDisabled: boolean;\n wrapText: boolean;\n }\n export interface OptionalProps\n extends TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSChipName, typeof CHIP_SLOTS> {\n selected?: boolean;\n innerRef?: React.RefObject<HTMLButtonElement> | ((_ref: HTMLButtonElement) => void);\n }\n\n export interface RequiredProps {\n label: string;\n icon: React.ComponentType<{\n size?: string;\n }>;\n }\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLElement>,\n keyof DefaultProps | keyof XstyledProps | keyof RequiredProps | keyof OptionalProps\n >,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLElement>,\n keyof DefaultProps | keyof XstyledProps | keyof RequiredProps | keyof OptionalProps\n >,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const DSChipPropTypes: DSPropTypesSchema<DSChipT.Props> = {\n ...getPropsPerSlotPropTypes(DSChipName, CHIP_SLOTS),\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n icon: PropTypes.func.isRequired.description('Chip Icon').defaultValue(() => {}),\n label: PropTypes.string.isRequired.description('Chip Label').defaultValue(''),\n selected: PropTypes.bool.description('Whether chip is selected').defaultValue(''),\n shape: PropTypes.oneOf(ChipShapesValuesArray).description(ChipShapesValuesString).defaultValue(CHIP_SHAPES.DEFAULT),\n size: PropTypes.oneOf(ChipSizesValuesArray).description(ChipSizesValuesString).defaultValue(CHIP_SIZES.L),\n applyAriaDisabled: PropTypes.bool\n .description(\n 'Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION.',\n )\n .defaultValue(false),\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('Inner ref to button component.'),\n wrapText: PropTypes.bool.description('wrap text in the label of the chip').defaultValue(false),\n};\n\nexport const DSChipPropTypesSchema = DSChipPropTypes as unknown as ValidationMap<DSChipT.Props>;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACGvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGA,MAAM,qBAA2C;AAAA,EACtD,MAAM,WAAW;AAAA,EACjB,OAAO,YAAY;AAAA,EACnB,mBAAmB;AAAA,EACnB,UAAU;AACZ;AA0CO,MAAM,kBAAoD;AAAA,EAC/D,GAAG,yBAAyB,YAAY,UAAU;AAAA,EAClD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,MAAM,UAAU,KAAK,WAAW,YAAY,WAAW,EAAE,aAAa,MAAM;AAAA,EAAC,CAAC;AAAA,EAC9E,OAAO,UAAU,OAAO,WAAW,YAAY,YAAY,EAAE,aAAa,EAAE;AAAA,EAC5E,UAAU,UAAU,KAAK,YAAY,0BAA0B,EAAE,aAAa,EAAE;AAAA,EAChF,OAAO,UAAU,MAAM,qBAAqB,EAAE,YAAY,sBAAsB,EAAE,aAAa,YAAY,OAAO;AAAA,EAClH,MAAM,UAAU,MAAM,oBAAoB,EAAE,YAAY,qBAAqB,EAAE,aAAa,WAAW,CAAC;AAAA,EACxG,mBAAmB,UAAU,KAC1B;AAAA,IACC;AAAA,EACF,EACC,aAAa,KAAK;AAAA,EACrB,UAAU,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,IAAI,CAAC,EAAE,YAAY,gCAAgC;AAAA,EAC9G,UAAU,UAAU,KAAK,YAAY,oCAAoC,EAAE,aAAa,KAAK;AAC/F;AAEO,MAAM,wBAAwB;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport type { GlobalAttributesT, XstyledProps, ValidationMap, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport {\n PropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n getPropsPerSlotPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport {\n CHIP_SIZES,\n CHIP_SHAPES,\n ChipSizesValuesArray,\n ChipSizesValuesString,\n ChipShapesValuesArray,\n ChipShapesValuesString,\n DSChipName,\n CHIP_SLOTS,\n} from './constants/index.js';\nimport type { ChipSizesT, ChipShapesT } from './sharedTypes.js';\n\nexport const DSChipDefaultProps: DSChipT.DefaultProps = {\n size: CHIP_SIZES.L,\n shape: CHIP_SHAPES.DEFAULT,\n applyAriaDisabled: false,\n wrapText: false,\n};\n\nexport declare namespace DSChipT {\n export interface DefaultProps {\n size: ChipSizesT;\n shape: ChipShapesT;\n applyAriaDisabled: boolean;\n wrapText: boolean;\n }\n export interface OptionalProps extends TypescriptHelpersT.PropsForGlobalOnSlots<\n typeof DSChipName,\n typeof CHIP_SLOTS\n > {\n selected?: boolean;\n innerRef?: React.RefObject<HTMLButtonElement> | ((_ref: HTMLButtonElement) => void);\n }\n\n export interface RequiredProps {\n label: string;\n icon: React.ComponentType<{\n size?: string;\n }>;\n }\n export interface Props\n extends\n Partial<DefaultProps>,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLElement>,\n keyof DefaultProps | keyof XstyledProps | keyof RequiredProps | keyof OptionalProps\n >,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends\n DefaultProps,\n OptionalProps,\n Omit<\n GlobalAttributesT<HTMLElement>,\n keyof DefaultProps | keyof XstyledProps | keyof RequiredProps | keyof OptionalProps\n >,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const DSChipPropTypes: DSPropTypesSchema<DSChipT.Props> = {\n ...getPropsPerSlotPropTypes(DSChipName, CHIP_SLOTS),\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n icon: PropTypes.func.isRequired.description('Chip Icon').defaultValue(() => {}),\n label: PropTypes.string.isRequired.description('Chip Label').defaultValue(''),\n selected: PropTypes.bool.description('Whether chip is selected').defaultValue(''),\n shape: PropTypes.oneOf(ChipShapesValuesArray).description(ChipShapesValuesString).defaultValue(CHIP_SHAPES.DEFAULT),\n size: PropTypes.oneOf(ChipSizesValuesArray).description(ChipSizesValuesString).defaultValue(CHIP_SIZES.L),\n applyAriaDisabled: PropTypes.bool\n .description(\n 'Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION.',\n )\n .defaultValue(false),\n innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('Inner ref to button component.'),\n wrapText: PropTypes.bool.description('wrap text in the label of the chip').defaultValue(false),\n};\n\nexport const DSChipPropTypesSchema = DSChipPropTypes as unknown as ValidationMap<DSChipT.Props>;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACGvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGA,MAAM,qBAA2C;AAAA,EACtD,MAAM,WAAW;AAAA,EACjB,OAAO,YAAY;AAAA,EACnB,mBAAmB;AAAA,EACnB,UAAU;AACZ;AA8CO,MAAM,kBAAoD;AAAA,EAC/D,GAAG,yBAAyB,YAAY,UAAU;AAAA,EAClD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,MAAM,UAAU,KAAK,WAAW,YAAY,WAAW,EAAE,aAAa,MAAM;AAAA,EAAC,CAAC;AAAA,EAC9E,OAAO,UAAU,OAAO,WAAW,YAAY,YAAY,EAAE,aAAa,EAAE;AAAA,EAC5E,UAAU,UAAU,KAAK,YAAY,0BAA0B,EAAE,aAAa,EAAE;AAAA,EAChF,OAAO,UAAU,MAAM,qBAAqB,EAAE,YAAY,sBAAsB,EAAE,aAAa,YAAY,OAAO;AAAA,EAClH,MAAM,UAAU,MAAM,oBAAoB,EAAE,YAAY,qBAAqB,EAAE,aAAa,WAAW,CAAC;AAAA,EACxG,mBAAmB,UAAU,KAC1B;AAAA,IACC;AAAA,EACF,EACC,aAAa,KAAK;AAAA,EACrB,UAAU,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,IAAI,CAAC,EAAE,YAAY,gCAAgC;AAAA,EAC9G,UAAU,UAAU,KAAK,YAAY,oCAAoC,EAAE,aAAa,KAAK;AAC/F;AAEO,MAAM,wBAAwB;",
6
6
  "names": []
7
7
  }
@@ -219,10 +219,10 @@ const StyledChip = styled("button", { name: DSChipName, slot: CHIP_SLOTS.BUTTON
219
219
  &:focus {
220
220
  &:before {
221
221
  ${buttonShape === CHIP_SHAPES.ROUND ? css`
222
- border: 2px solid ${({ theme }) => theme.colors.brand[800]};
223
- ` : css`
224
- border: 2px solid ${({ theme }) => theme.colors.brand[700]};
225
- `}
222
+ border: 2px solid ${({ theme }) => theme.colors.brand[800]};
223
+ ` : css`
224
+ border: 2px solid ${({ theme }) => theme.colors.brand[700]};
225
+ `}
226
226
  }
227
227
  }
228
228
  `}
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/styles.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { styled, css, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport {\n basicSizes,\n shapeSizes,\n CHIP_SHAPES,\n CHIP_SIZES,\n roundShapeLarge,\n roundShapeSmall,\n DSChipName,\n CHIP_SLOTS,\n roundShapeLargeMobile,\n roundShapeSmallMobile,\n} from './constants/index.js';\nimport type { ChipShapesT, ChipSizesT } from './sharedTypes.js';\n\nexport interface StyledChipPropsT {\n buttonSize: ChipSizesT;\n buttonShape: ChipShapesT;\n selected?: boolean;\n wrapText?: boolean;\n}\n\nexport interface StyledRoundShapePropsT {\n size: ChipSizesT;\n disabled?: boolean;\n}\n\nconst getChipSize = (shape: ChipShapesT) => (shape === CHIP_SHAPES.ROUND ? shapeSizes : basicSizes);\n\nconst wrapTextStyles = css`\n overflow-wrap: break-word;\n white-space: pre-wrap;\n overflow: visible;\n`;\n\nconst ellipsisStyles = css`\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const StyledChipLabel = styled('div', { name: DSChipName, slot: CHIP_SLOTS.LABEL })<{ size: ChipSizesT }>`\n font-size: ${({ theme }) => theme.fontSizes.label[200]};\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n word-wrap: break-word;\n text-align: center;\n padding-top: ${({ size }) => (size === CHIP_SIZES.L ? '2px' : '4px')};\n z-index: 0;\n line-height: 1.27;\n width: inherit;\n display: flex;\n align-items: center;\n justify-content: center;\n`;\n\nexport const StyledSpanWithEllipsis = styled(DSTypography, {\n name: DSChipName,\n slot: CHIP_SLOTS.ELLIPSIS,\n})<{ wrapText?: boolean }>`\n ${({ wrapText }) => (wrapText ? wrapTextStyles : ellipsisStyles)};\n max-width: 100%;\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n`;\n\nexport const StyledWrapper = styled('div', {\n name: DSChipName,\n slot: CHIP_SLOTS.ROOT,\n})<StyledChipPropsT>`\n display: flex;\n width: ${({ buttonSize, buttonShape }) => getChipSize(buttonShape)[buttonSize].width};\n ${xStyledCommonProps}\n max-width: ${({ buttonSize }) => basicSizes[buttonSize].maxWidth};\n ${({ wrapText, buttonSize, buttonShape }) =>\n wrapText ? `height: auto;` : ` height: ${getChipSize(buttonShape)[buttonSize].height};`}\n`;\n\nconst disabledRoundShape = css`\n background-color: ${({ theme }) => theme.colors.neutral[200]};\n\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral[500]};\n }\n`;\n\nexport const StyledRoundShape = styled('div', {\n name: DSChipName,\n slot: CHIP_SLOTS.ROUND_SHAPE,\n})<StyledRoundShapePropsT>`\n background-color: ${({ theme }) => theme.colors.brand[600]};\n width: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLarge : roundShapeSmall)};\n height: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLarge : roundShapeSmall)};\n border-radius: 50px;\n display: flex;\n align-items: center;\n justify-content: center;\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n width: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLargeMobile : roundShapeSmallMobile)};\n height: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLargeMobile : roundShapeSmallMobile)};\n }\n`;\n\nconst styledChipSelectedCss = css`\n // TODO: wrap css processor to process new HOC wrapping styled components\n ${StyledRoundShape.toString()} {\n background-color: ${({ theme }) => theme.colors.brand[800]};\n }\n color: ${({ theme }) => theme.colors.brand[800]};\n background-color: ${({ theme }) => theme.colors.brand[200]};\n\n .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[800]};\n }\n\n &:before {\n border: 1px solid ${({ theme }) => theme.colors.brand[600]};\n }\n\n &:focus {\n &:before {\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n }\n }\n`;\n\nconst disabledStyles = css`\n color: ${({ theme }) => theme.colors.neutral[500]};\n\n .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral[400]};\n }\n\n &:hover {\n ${StyledRoundShape} {\n background-color: ${({ theme }) => theme.colors.neutral[200]};\n }\n background-color: ${({ theme }) => theme.colors.neutral['050']};\n cursor: not-allowed;\n &:before {\n border-color: transparent;\n }\n }\n`;\n\nexport const StyledChip = styled('button', { name: DSChipName, slot: CHIP_SLOTS.BUTTON })<\n Pick<StyledChipPropsT, 'selected' | 'buttonShape' | 'buttonSize' | 'wrapText'>\n>`\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n border: none;\n min-height: 100%;\n height: fit-content;\n width: 100%;\n background-color: ${({ theme }) => theme.colors.neutral['000']};\n color: ${({ theme }) => theme.colors.brand[600]};\n border-radius: 4px;\n cursor: pointer;\n outline: none;\n ${({ buttonShape, buttonSize }) => {\n if (buttonShape === CHIP_SHAPES.ROUND && buttonSize === CHIP_SIZES.L) {\n return css`\n padding: 6px;\n `;\n }\n return css`\n padding: 10px 6px;\n `;\n }}\n ${StyledRoundShape} {\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral['000']};\n }\n ${({ disabled }) => disabled && disabledRoundShape}\n }\n &:before {\n content: '';\n position: absolute;\n z-index: 20;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border-radius: 4px;\n border: 2px solid transparent;\n pointer-events: none;\n }\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[600]};\n color: ${({ theme }) => theme.colors.neutral[600]};\n }\n\n &:hover,\n &:focus {\n z-index: 10;\n ${StyledSpanWithEllipsis} {\n ${({ wrapText }) =>\n !wrapText &&\n css`\n ${wrapTextStyles}\n `}\n }\n }\n\n &:hover {\n ${StyledRoundShape} {\n background-color: ${({ theme }) => theme.colors.brand[800]};\n }\n color: ${({ theme }) => theme.colors.brand[800]};\n background-color: ${({ theme }) => theme.colors.brand[200]};\n .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[800]};\n }\n }\n\n &:focus {\n &:before {\n ${({ buttonShape }) =>\n buttonShape === CHIP_SHAPES.ROUND\n ? css`\n border: 2px solid ${({ theme }) => theme.colors.brand[800]};\n `\n : css`\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n `}\n }\n }\n\n &:disabled {\n ${disabledStyles}\n }\n\n &[aria-disabled='true'] {\n ${disabledStyles}\n ${StyledRoundShape} {\n ${disabledRoundShape}\n }\n\n &:focus {\n &:before {\n border: 2px solid ${({ theme }) => theme.colors.neutral[400]};\n }\n }\n }\n\n ${({ selected, buttonShape }) =>\n !selected\n ? ''\n : css`\n ${styledChipSelectedCss}\n &:focus {\n &:before {\n ${buttonShape === CHIP_SHAPES.ROUND\n ? css`\n border: 2px solid ${({ theme }) => theme.colors.brand[800]};\n `\n : css`\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n `}\n }\n }\n `}\n`;\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { styled, css, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport {\n basicSizes,\n shapeSizes,\n CHIP_SHAPES,\n CHIP_SIZES,\n roundShapeLarge,\n roundShapeSmall,\n DSChipName,\n CHIP_SLOTS,\n roundShapeLargeMobile,\n roundShapeSmallMobile,\n} from './constants/index.js';\nimport type { ChipShapesT, ChipSizesT } from './sharedTypes.js';\n\nexport interface StyledChipPropsT {\n buttonSize: ChipSizesT;\n buttonShape: ChipShapesT;\n selected?: boolean;\n wrapText?: boolean;\n}\n\nexport interface StyledRoundShapePropsT {\n size: ChipSizesT;\n disabled?: boolean;\n}\n\nconst getChipSize = (shape: ChipShapesT) => (shape === CHIP_SHAPES.ROUND ? shapeSizes : basicSizes);\n\nconst wrapTextStyles = css`\n overflow-wrap: break-word;\n white-space: pre-wrap;\n overflow: visible;\n`;\n\nconst ellipsisStyles = css`\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const StyledChipLabel = styled('div', { name: DSChipName, slot: CHIP_SLOTS.LABEL })<{ size: ChipSizesT }>`\n font-size: ${({ theme }) => theme.fontSizes.label[200]};\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n word-wrap: break-word;\n text-align: center;\n padding-top: ${({ size }) => (size === CHIP_SIZES.L ? '2px' : '4px')};\n z-index: 0;\n line-height: 1.27;\n width: inherit;\n display: flex;\n align-items: center;\n justify-content: center;\n`;\n\nexport const StyledSpanWithEllipsis = styled(DSTypography, {\n name: DSChipName,\n slot: CHIP_SLOTS.ELLIPSIS,\n})<{ wrapText?: boolean }>`\n ${({ wrapText }) => (wrapText ? wrapTextStyles : ellipsisStyles)};\n max-width: 100%;\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n`;\n\nexport const StyledWrapper = styled('div', {\n name: DSChipName,\n slot: CHIP_SLOTS.ROOT,\n})<StyledChipPropsT>`\n display: flex;\n width: ${({ buttonSize, buttonShape }) => getChipSize(buttonShape)[buttonSize].width};\n ${xStyledCommonProps}\n max-width: ${({ buttonSize }) => basicSizes[buttonSize].maxWidth};\n ${({ wrapText, buttonSize, buttonShape }) =>\n wrapText ? `height: auto;` : ` height: ${getChipSize(buttonShape)[buttonSize].height};`}\n`;\n\nconst disabledRoundShape = css`\n background-color: ${({ theme }) => theme.colors.neutral[200]};\n\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral[500]};\n }\n`;\n\nexport const StyledRoundShape = styled('div', {\n name: DSChipName,\n slot: CHIP_SLOTS.ROUND_SHAPE,\n})<StyledRoundShapePropsT>`\n background-color: ${({ theme }) => theme.colors.brand[600]};\n width: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLarge : roundShapeSmall)};\n height: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLarge : roundShapeSmall)};\n border-radius: 50px;\n display: flex;\n align-items: center;\n justify-content: center;\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n width: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLargeMobile : roundShapeSmallMobile)};\n height: ${({ size }) => (size === CHIP_SIZES.L ? roundShapeLargeMobile : roundShapeSmallMobile)};\n }\n`;\n\nconst styledChipSelectedCss = css`\n // TODO: wrap css processor to process new HOC wrapping styled components\n ${StyledRoundShape.toString()} {\n background-color: ${({ theme }) => theme.colors.brand[800]};\n }\n color: ${({ theme }) => theme.colors.brand[800]};\n background-color: ${({ theme }) => theme.colors.brand[200]};\n\n .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[800]};\n }\n\n &:before {\n border: 1px solid ${({ theme }) => theme.colors.brand[600]};\n }\n\n &:focus {\n &:before {\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n }\n }\n`;\n\nconst disabledStyles = css`\n color: ${({ theme }) => theme.colors.neutral[500]};\n\n .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral[400]};\n }\n\n &:hover {\n ${StyledRoundShape} {\n background-color: ${({ theme }) => theme.colors.neutral[200]};\n }\n background-color: ${({ theme }) => theme.colors.neutral['050']};\n cursor: not-allowed;\n &:before {\n border-color: transparent;\n }\n }\n`;\n\nexport const StyledChip = styled('button', { name: DSChipName, slot: CHIP_SLOTS.BUTTON })<\n Pick<StyledChipPropsT, 'selected' | 'buttonShape' | 'buttonSize' | 'wrapText'>\n>`\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n border: none;\n min-height: 100%;\n height: fit-content;\n width: 100%;\n background-color: ${({ theme }) => theme.colors.neutral['000']};\n color: ${({ theme }) => theme.colors.brand[600]};\n border-radius: 4px;\n cursor: pointer;\n outline: none;\n ${({ buttonShape, buttonSize }) => {\n if (buttonShape === CHIP_SHAPES.ROUND && buttonSize === CHIP_SIZES.L) {\n return css`\n padding: 6px;\n `;\n }\n return css`\n padding: 10px 6px;\n `;\n }}\n ${StyledRoundShape} {\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.neutral['000']};\n }\n ${({ disabled }) => disabled && disabledRoundShape}\n }\n &:before {\n content: '';\n position: absolute;\n z-index: 20;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border-radius: 4px;\n border: 2px solid transparent;\n pointer-events: none;\n }\n & .DSIcon-root .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[600]};\n color: ${({ theme }) => theme.colors.neutral[600]};\n }\n\n &:hover,\n &:focus {\n z-index: 10;\n ${StyledSpanWithEllipsis} {\n ${({ wrapText }) =>\n !wrapText &&\n css`\n ${wrapTextStyles}\n `}\n }\n }\n\n &:hover {\n ${StyledRoundShape} {\n background-color: ${({ theme }) => theme.colors.brand[800]};\n }\n color: ${({ theme }) => theme.colors.brand[800]};\n background-color: ${({ theme }) => theme.colors.brand[200]};\n .DSIcon-svg {\n fill: ${({ theme }) => theme.colors.brand[800]};\n }\n }\n\n &:focus {\n &:before {\n ${({ buttonShape }) =>\n buttonShape === CHIP_SHAPES.ROUND\n ? css`\n border: 2px solid ${({ theme }) => theme.colors.brand[800]};\n `\n : css`\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n `}\n }\n }\n\n &:disabled {\n ${disabledStyles}\n }\n\n &[aria-disabled='true'] {\n ${disabledStyles}\n ${StyledRoundShape} {\n ${disabledRoundShape}\n }\n\n &:focus {\n &:before {\n border: 2px solid ${({ theme }) => theme.colors.neutral[400]};\n }\n }\n }\n\n ${({ selected, buttonShape }) =>\n !selected\n ? ''\n : css`\n ${styledChipSelectedCss}\n &:focus {\n &:before {\n ${\n buttonShape === CHIP_SHAPES.ROUND\n ? css`\n border: 2px solid ${({ theme }) => theme.colors.brand[800]};\n `\n : css`\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n `\n }\n }\n }\n `}\n`;\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }