@razorpay/blade 11.15.2 → 11.16.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.
Files changed (87) hide show
  1. package/build/lib/native/components/Amount/Amount.js +1 -1
  2. package/build/lib/native/components/Amount/Amount.js.map +1 -1
  3. package/build/lib/native/components/Chip/Chip.js +1 -1
  4. package/build/lib/native/components/Chip/Chip.js.map +1 -1
  5. package/build/lib/native/components/Chip/ChipGroup.js +4 -2
  6. package/build/lib/native/components/Chip/ChipGroup.js.map +1 -1
  7. package/build/lib/native/components/Chip/chipTokens.js +2 -2
  8. package/build/lib/native/components/Chip/chipTokens.js.map +1 -1
  9. package/build/lib/native/components/Chip/getAnimatedChipStyles.js +1 -1
  10. package/build/lib/native/components/Chip/getAnimatedChipStyles.js.map +1 -1
  11. package/build/lib/native/components/Chip/useChipGroup.js +1 -1
  12. package/build/lib/native/components/Chip/useChipGroup.js.map +1 -1
  13. package/build/lib/native/components/Indicator/Indicator.js +4 -4
  14. package/build/lib/native/components/Indicator/Indicator.js.map +1 -1
  15. package/build/lib/native/components/Indicator/indicatorTokens.js +8 -0
  16. package/build/lib/native/components/Indicator/indicatorTokens.js.map +1 -0
  17. package/build/lib/native/components/List/ListItemIcons.js +1 -1
  18. package/build/lib/native/components/List/ListItemIcons.js.map +1 -1
  19. package/build/lib/native/tokens/global/colors.js +1 -1
  20. package/build/lib/native/tokens/global/colors.js.map +1 -1
  21. package/build/lib/native/tokens/global/opacity.js +1 -1
  22. package/build/lib/native/tokens/global/opacity.js.map +1 -1
  23. package/build/lib/native/tokens/theme/bladeTheme.js +1 -1
  24. package/build/lib/native/tokens/theme/bladeTheme.js.map +1 -1
  25. package/build/lib/native/tokens/theme/createTheme.js +1 -1
  26. package/build/lib/native/tokens/theme/createTheme.js.map +1 -1
  27. package/build/lib/web/development/components/Amount/Amount.js +3 -3
  28. package/build/lib/web/development/components/Amount/Amount.js.map +1 -1
  29. package/build/lib/web/development/components/Breadcrumb/BreadcrumbItem.web.js +1 -1
  30. package/build/lib/web/development/components/Breadcrumb/BreadcrumbItem.web.js.map +1 -1
  31. package/build/lib/web/development/components/Chip/Chip.js +5 -0
  32. package/build/lib/web/development/components/Chip/Chip.js.map +1 -1
  33. package/build/lib/web/development/components/Chip/ChipGroup.js +40 -6
  34. package/build/lib/web/development/components/Chip/ChipGroup.js.map +1 -1
  35. package/build/lib/web/development/components/Chip/chipTokens.js +12 -5
  36. package/build/lib/web/development/components/Chip/chipTokens.js.map +1 -1
  37. package/build/lib/web/development/components/Chip/getAnimatedChipStyles.js +1 -2
  38. package/build/lib/web/development/components/Chip/getAnimatedChipStyles.js.map +1 -1
  39. package/build/lib/web/development/components/Chip/useChipGroup.js +8 -2
  40. package/build/lib/web/development/components/Chip/useChipGroup.js.map +1 -1
  41. package/build/lib/web/development/components/Indicator/Indicator.js +28 -32
  42. package/build/lib/web/development/components/Indicator/Indicator.js.map +1 -1
  43. package/build/lib/web/development/components/Indicator/indicatorTokens.js +41 -0
  44. package/build/lib/web/development/components/Indicator/indicatorTokens.js.map +1 -0
  45. package/build/lib/web/development/components/List/ListItemIcons.js +2 -2
  46. package/build/lib/web/development/components/List/ListItemIcons.js.map +1 -1
  47. package/build/lib/web/development/tokens/global/colors.js +222 -218
  48. package/build/lib/web/development/tokens/global/colors.js.map +1 -1
  49. package/build/lib/web/development/tokens/global/opacity.js +13 -12
  50. package/build/lib/web/development/tokens/global/opacity.js.map +1 -1
  51. package/build/lib/web/development/tokens/theme/bladeTheme.js +27 -27
  52. package/build/lib/web/development/tokens/theme/bladeTheme.js.map +1 -1
  53. package/build/lib/web/development/tokens/theme/createTheme.js +4 -4
  54. package/build/lib/web/development/tokens/theme/createTheme.js.map +1 -1
  55. package/build/lib/web/production/components/Amount/Amount.js +3 -3
  56. package/build/lib/web/production/components/Amount/Amount.js.map +1 -1
  57. package/build/lib/web/production/components/Breadcrumb/BreadcrumbItem.web.js +1 -1
  58. package/build/lib/web/production/components/Breadcrumb/BreadcrumbItem.web.js.map +1 -1
  59. package/build/lib/web/production/components/Chip/Chip.js +5 -0
  60. package/build/lib/web/production/components/Chip/Chip.js.map +1 -1
  61. package/build/lib/web/production/components/Chip/ChipGroup.js +40 -6
  62. package/build/lib/web/production/components/Chip/ChipGroup.js.map +1 -1
  63. package/build/lib/web/production/components/Chip/chipTokens.js +12 -5
  64. package/build/lib/web/production/components/Chip/chipTokens.js.map +1 -1
  65. package/build/lib/web/production/components/Chip/getAnimatedChipStyles.js +1 -2
  66. package/build/lib/web/production/components/Chip/getAnimatedChipStyles.js.map +1 -1
  67. package/build/lib/web/production/components/Chip/useChipGroup.js +8 -2
  68. package/build/lib/web/production/components/Chip/useChipGroup.js.map +1 -1
  69. package/build/lib/web/production/components/Indicator/Indicator.js +28 -32
  70. package/build/lib/web/production/components/Indicator/Indicator.js.map +1 -1
  71. package/build/lib/web/production/components/Indicator/indicatorTokens.js +41 -0
  72. package/build/lib/web/production/components/Indicator/indicatorTokens.js.map +1 -0
  73. package/build/lib/web/production/components/List/ListItemIcons.js +2 -2
  74. package/build/lib/web/production/components/List/ListItemIcons.js.map +1 -1
  75. package/build/lib/web/production/tokens/global/colors.js +222 -218
  76. package/build/lib/web/production/tokens/global/colors.js.map +1 -1
  77. package/build/lib/web/production/tokens/global/opacity.js +13 -12
  78. package/build/lib/web/production/tokens/global/opacity.js.map +1 -1
  79. package/build/lib/web/production/tokens/theme/bladeTheme.js +27 -27
  80. package/build/lib/web/production/tokens/theme/bladeTheme.js.map +1 -1
  81. package/build/lib/web/production/tokens/theme/createTheme.js +4 -4
  82. package/build/lib/web/production/tokens/theme/createTheme.js.map +1 -1
  83. package/build/types/components/index.d.ts +63 -6
  84. package/build/types/components/index.native.d.ts +63 -6
  85. package/build/types/tokens/index.d.ts +27 -24
  86. package/build/types/tokens/index.native.d.ts +27 -24
  87. package/package.json +1 -1
@@ -21,7 +21,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
21
21
  import { Text } from '../Typography/Text/Text.js';
22
22
  import '../Typography/Code/Code.js';
23
23
 
24
- var _excluded=["value","suffix","type","size","weight","isAffixSubtle","isStrikethrough","color","currencyIndicator","currency","testID"];var getTextColorProps=function getTextColorProps(_ref){var color=_ref.color;var props={amountValueColor:'surface.text.gray.normal'};if(!color)return props;props.amountValueColor=color;return props;};var AmountValue=function AmountValue(_ref2){var amount=_ref2.amount,_ref2$size=_ref2.size,size=_ref2$size===void 0?'medium':_ref2$size,_ref2$type=_ref2.type,type=_ref2$type===void 0?'body':_ref2$type,_ref2$weight=_ref2.weight,weight=_ref2$weight===void 0?'regular':_ref2$weight,amountValueColor=_ref2.amountValueColor,isAffixSubtle=_ref2.isAffixSubtle,suffix=_ref2.suffix;var isReactNative=getPlatformType()==='react-native';var affixFontSize=isAffixSubtle?subtleFontSizes[type][size]:normalAmountSizes[type][size];var numberFontFamily=type==='body'?'text':'heading';if(suffix==='decimals'&&isAffixSubtle){var AmountWrapper=isReactNative?Text:React__default.Fragment;return jsxs(AmountWrapper,{children:[jsx(BaseText,{fontSize:normalAmountSizes[type][size],fontWeight:weight,lineHeight:amountLineHeights[type][size],color:amountValueColor,fontFamily:numberFontFamily,as:isReactNative?undefined:'span',children:amount.integer}),jsxs(BaseText,{fontWeight:weight,fontSize:affixFontSize,fontFamily:numberFontFamily,color:amountValueColor,as:isReactNative?undefined:'span',opacity:isAffixSubtle?opacity[8]:1,children:[amount.decimal,amount.fraction]})]});}return jsx(BaseText,{fontSize:normalAmountSizes[type][size],fontWeight:weight,fontFamily:numberFontFamily,color:amountValueColor,lineHeight:amountLineHeights[type][size],children:amount.formatted});};var formatAmountWithSuffix=function formatAmountWithSuffix(_ref3){var suffix=_ref3.suffix,value=_ref3.value;try{switch(suffix){case'decimals':{var options={intlOptions:{maximumFractionDigits:2,minimumFractionDigits:2}};return Object.assign({},formatNumberByParts(value,options),{formatted:formatNumber(value,options)});}case'humanize':{var formatted=formatNumber(value,{intlOptions:{notation:'compact',maximumFractionDigits:2,trailingZeroDisplay:'stripIfInteger'}});return {formatted:formatted};}default:{var _formatted=formatNumber(value,{intlOptions:{maximumFractionDigits:0,roundingMode:'floor'}});return {formatted:_formatted};}}}catch(err){return {formatted:`${value}`};}};var _Amount=function _Amount(_ref4){var value=_ref4.value,_ref4$suffix=_ref4.suffix,suffix=_ref4$suffix===void 0?'decimals':_ref4$suffix,_ref4$type=_ref4.type,type=_ref4$type===void 0?'body':_ref4$type,_ref4$size=_ref4.size,size=_ref4$size===void 0?'medium':_ref4$size,_ref4$weight=_ref4.weight,weight=_ref4$weight===void 0?'regular':_ref4$weight,_ref4$isAffixSubtle=_ref4.isAffixSubtle,isAffixSubtle=_ref4$isAffixSubtle===void 0?true:_ref4$isAffixSubtle,_ref4$isStrikethrough=_ref4.isStrikethrough,isStrikethrough=_ref4$isStrikethrough===void 0?false:_ref4$isStrikethrough,color=_ref4.color,_ref4$currencyIndicat=_ref4.currencyIndicator,currencyIndicator=_ref4$currencyIndicat===void 0?'currency-symbol':_ref4$currencyIndicat,_ref4$currency=_ref4.currency,currency=_ref4$currency===void 0?'INR':_ref4$currency,testID=_ref4.testID,styledProps=_objectWithoutProperties(_ref4,_excluded);if(__DEV__){if(typeof value!=='number'){throwBladeError({message:'`value` prop must be of type `number` for Amount.',moduleName:'Amount'});}if(color==='neutral'){throwBladeError({message:'`neutral` color is not supported.',moduleName:'Amount'});}var bodySizes=objectKeysWithType(normalAmountSizes.body);if((type==='body'||!type)&&!bodySizes.includes(size)){throwBladeError({message:`size="${size}" is not allowed with type="body"`,moduleName:'Amount'});}var displaySizes=objectKeysWithType(normalAmountSizes.display);if(type==='display'&&!displaySizes.includes(size)){throwBladeError({message:`size="${size}" is not allowed with type="display"`,moduleName:'Amount'});}var headingSizes=objectKeysWithType(normalAmountSizes.heading);if(type==='heading'&&!headingSizes.includes(size)){throwBladeError({message:`size="${size}" is not allowed with type="heading"`,moduleName:'Amount'});}}var _getTextColorProps=getTextColorProps({color:color}),amountValueColor=_getTextColorProps.amountValueColor;var isPrefixSymbol,currencySymbol;try{var byParts=formatNumberByParts(value,{currency:currency});isPrefixSymbol=byParts.isPrefixSymbol;currencySymbol=byParts.currency;}catch(err){isPrefixSymbol=true;currencySymbol=currency;}var currencyPosition=isPrefixSymbol?'left':'right';var renderedValue=formatAmountWithSuffix({suffix:suffix,value:value});var currencySymbolOrCode=currencyIndicator==='currency-symbol'?currencySymbol:currency;var currencyFontSize=isAffixSubtle?subtleFontSizes[type][size]:normalAmountSizes[type][size];var isReactNative=getPlatformType()==='react-native';return jsx(BaseBox,Object.assign({display:isReactNative?'flex':'inline-flex',flexDirection:"row"},metaAttribute({name:MetaConstants.Amount,testID:testID}),getStyledProps(styledProps),{children:jsxs(BaseBox,{display:isReactNative?'flex':'inline-flex',alignItems:"baseline",flexDirection:"row",position:"relative",children:[currencyPosition==='left'&&jsx(BaseText,{marginRight:"spacing.1",fontWeight:weight,fontSize:currencyFontSize,color:amountValueColor,as:isReactNative?undefined:'span',opacity:isAffixSubtle?opacity[8]:1,children:currencySymbolOrCode}),jsx(AmountValue,{amount:renderedValue,amountValueColor:amountValueColor,type:type,weight:weight,size:size,isAffixSubtle:isAffixSubtle,suffix:suffix,currency:currency}),currencyPosition==='right'&&jsx(BaseText,{marginLeft:"spacing.1",fontWeight:weight,fontSize:currencyFontSize,color:amountValueColor,as:isReactNative?undefined:'span',opacity:isAffixSubtle?opacity[8]:1,children:currencySymbolOrCode}),isStrikethrough&&jsx(BaseBox,{borderBottomColor:amountValueColor,borderBottomWidth:type==='body'?'thin':'thicker',borderBottomStyle:"solid",position:"absolute",width:"100%",top:"50%"})]})}));};var Amount=assignWithoutSideEffects(_Amount,{displayName:'Amount',componentId:'Amount'});
24
+ var _excluded=["value","suffix","type","size","weight","isAffixSubtle","isStrikethrough","color","currencyIndicator","currency","testID"];var getTextColorProps=function getTextColorProps(_ref){var color=_ref.color;var props={amountValueColor:'surface.text.gray.normal'};if(!color)return props;props.amountValueColor=color;return props;};var AmountValue=function AmountValue(_ref2){var amount=_ref2.amount,_ref2$size=_ref2.size,size=_ref2$size===void 0?'medium':_ref2$size,_ref2$type=_ref2.type,type=_ref2$type===void 0?'body':_ref2$type,_ref2$weight=_ref2.weight,weight=_ref2$weight===void 0?'regular':_ref2$weight,amountValueColor=_ref2.amountValueColor,isAffixSubtle=_ref2.isAffixSubtle,suffix=_ref2.suffix;var isReactNative=getPlatformType()==='react-native';var affixFontSize=isAffixSubtle?subtleFontSizes[type][size]:normalAmountSizes[type][size];var numberFontFamily=type==='body'?'text':'heading';if(suffix==='decimals'&&isAffixSubtle){var AmountWrapper=isReactNative?Text:React__default.Fragment;return jsxs(AmountWrapper,{children:[jsx(BaseText,{fontSize:normalAmountSizes[type][size],fontWeight:weight,lineHeight:amountLineHeights[type][size],color:amountValueColor,fontFamily:numberFontFamily,as:isReactNative?undefined:'span',children:amount.integer}),jsxs(BaseText,{fontWeight:weight,fontSize:affixFontSize,fontFamily:numberFontFamily,color:amountValueColor,as:isReactNative?undefined:'span',opacity:isAffixSubtle?opacity[800]:1,children:[amount.decimal,amount.fraction]})]});}return jsx(BaseText,{fontSize:normalAmountSizes[type][size],fontWeight:weight,fontFamily:numberFontFamily,color:amountValueColor,lineHeight:amountLineHeights[type][size],children:amount.formatted});};var formatAmountWithSuffix=function formatAmountWithSuffix(_ref3){var suffix=_ref3.suffix,value=_ref3.value;try{switch(suffix){case'decimals':{var options={intlOptions:{maximumFractionDigits:2,minimumFractionDigits:2}};return Object.assign({},formatNumberByParts(value,options),{formatted:formatNumber(value,options)});}case'humanize':{var formatted=formatNumber(value,{intlOptions:{notation:'compact',maximumFractionDigits:2,trailingZeroDisplay:'stripIfInteger'}});return {formatted:formatted};}default:{var _formatted=formatNumber(value,{intlOptions:{maximumFractionDigits:0,roundingMode:'floor'}});return {formatted:_formatted};}}}catch(err){return {formatted:`${value}`};}};var _Amount=function _Amount(_ref4){var value=_ref4.value,_ref4$suffix=_ref4.suffix,suffix=_ref4$suffix===void 0?'decimals':_ref4$suffix,_ref4$type=_ref4.type,type=_ref4$type===void 0?'body':_ref4$type,_ref4$size=_ref4.size,size=_ref4$size===void 0?'medium':_ref4$size,_ref4$weight=_ref4.weight,weight=_ref4$weight===void 0?'regular':_ref4$weight,_ref4$isAffixSubtle=_ref4.isAffixSubtle,isAffixSubtle=_ref4$isAffixSubtle===void 0?true:_ref4$isAffixSubtle,_ref4$isStrikethrough=_ref4.isStrikethrough,isStrikethrough=_ref4$isStrikethrough===void 0?false:_ref4$isStrikethrough,color=_ref4.color,_ref4$currencyIndicat=_ref4.currencyIndicator,currencyIndicator=_ref4$currencyIndicat===void 0?'currency-symbol':_ref4$currencyIndicat,_ref4$currency=_ref4.currency,currency=_ref4$currency===void 0?'INR':_ref4$currency,testID=_ref4.testID,styledProps=_objectWithoutProperties(_ref4,_excluded);if(__DEV__){if(typeof value!=='number'){throwBladeError({message:'`value` prop must be of type `number` for Amount.',moduleName:'Amount'});}if(color==='neutral'){throwBladeError({message:'`neutral` color is not supported.',moduleName:'Amount'});}var bodySizes=objectKeysWithType(normalAmountSizes.body);if((type==='body'||!type)&&!bodySizes.includes(size)){throwBladeError({message:`size="${size}" is not allowed with type="body"`,moduleName:'Amount'});}var displaySizes=objectKeysWithType(normalAmountSizes.display);if(type==='display'&&!displaySizes.includes(size)){throwBladeError({message:`size="${size}" is not allowed with type="display"`,moduleName:'Amount'});}var headingSizes=objectKeysWithType(normalAmountSizes.heading);if(type==='heading'&&!headingSizes.includes(size)){throwBladeError({message:`size="${size}" is not allowed with type="heading"`,moduleName:'Amount'});}}var _getTextColorProps=getTextColorProps({color:color}),amountValueColor=_getTextColorProps.amountValueColor;var isPrefixSymbol,currencySymbol;try{var byParts=formatNumberByParts(value,{currency:currency});isPrefixSymbol=byParts.isPrefixSymbol;currencySymbol=byParts.currency;}catch(err){isPrefixSymbol=true;currencySymbol=currency;}var currencyPosition=isPrefixSymbol?'left':'right';var renderedValue=formatAmountWithSuffix({suffix:suffix,value:value});var currencySymbolOrCode=currencyIndicator==='currency-symbol'?currencySymbol:currency;var currencyFontSize=isAffixSubtle?subtleFontSizes[type][size]:normalAmountSizes[type][size];var isReactNative=getPlatformType()==='react-native';return jsx(BaseBox,Object.assign({display:isReactNative?'flex':'inline-flex',flexDirection:"row"},metaAttribute({name:MetaConstants.Amount,testID:testID}),getStyledProps(styledProps),{children:jsxs(BaseBox,{display:isReactNative?'flex':'inline-flex',alignItems:"baseline",flexDirection:"row",position:"relative",children:[currencyPosition==='left'&&jsx(BaseText,{marginRight:"spacing.1",fontWeight:weight,fontSize:currencyFontSize,color:amountValueColor,as:isReactNative?undefined:'span',opacity:isAffixSubtle?opacity[800]:1,children:currencySymbolOrCode}),jsx(AmountValue,{amount:renderedValue,amountValueColor:amountValueColor,type:type,weight:weight,size:size,isAffixSubtle:isAffixSubtle,suffix:suffix,currency:currency}),currencyPosition==='right'&&jsx(BaseText,{marginLeft:"spacing.1",fontWeight:weight,fontSize:currencyFontSize,color:amountValueColor,as:isReactNative?undefined:'span',opacity:isAffixSubtle?opacity[800]:1,children:currencySymbolOrCode}),isStrikethrough&&jsx(BaseBox,{borderBottomColor:amountValueColor,borderBottomWidth:type==='body'?'thin':'thicker',borderBottomStyle:"solid",position:"absolute",width:"100%",top:"50%"})]})}));};var Amount=assignWithoutSideEffects(_Amount,{displayName:'Amount',componentId:'Amount'});
25
25
 
26
26
  export { Amount, formatAmountWithSuffix };
27
27
  //# sourceMappingURL=Amount.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Amount.js","sources":["../../../../../src/components/Amount/Amount.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport React from 'react';\nimport type { CurrencyCodeType } from '@razorpay/i18nify-js/currency';\nimport { formatNumber, formatNumberByParts } from '@razorpay/i18nify-js/currency';\nimport type { AmountTypeProps } from './amountTokens';\nimport { normalAmountSizes, subtleFontSizes, amountLineHeights } from './amountTokens';\nimport type { BaseTextProps } from '~components/Typography/BaseText/types';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { TestID } from '~utils/types';\nimport { getPlatformType } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport { objectKeysWithType } from '~utils/objectKeysWithType';\nimport { BaseText } from '~components/Typography/BaseText';\nimport { Text } from '~components/Typography';\nimport { opacity } from '~tokens/global';\nimport type { FontFamily } from '~tokens/global';\n\ntype AmountCommonProps = {\n /**\n * The value to be rendered within the component.\n *\n */\n value: number;\n /**\n * Sets the color of the amount.\n *\n * @default undefined\n */\n color?: BaseTextProps['color'];\n /**\n * Indicates what the suffix of amount should be\n *\n * @default 'decimals'\n */\n suffix?: 'decimals' | 'none' | 'humanize';\n /**\n * Makes the currency indicator(currency symbol/code) and decimal digits small and faded\n *\n * @default true\n */\n isAffixSubtle?: true | false;\n /**\n * Determines the visual representation of the currency, choose between displaying the currency symbol or code.\n *\n * Note: Currency symbol and code is determined by the locale set in user's browser or set via @razorpay/i18nify-react library.\n *\n * @default 'currency-symbol'\n */\n currencyIndicator?: 'currency-symbol' | 'currency-code';\n /**\n * The currency of the amount. Note that this component\n * only displays the provided value in the specified currency, it does not perform any currency conversion.\n *\n * @default 'INR'\n * */\n currency?: CurrencyCodeType;\n /**\n * If true, the amount text will have a line through it.\n *\n * @default false\n */\n isStrikethrough?: boolean;\n} & TestID &\n StyledPropsBlade;\n\ntype ColorProps = {\n amountValueColor: BaseTextProps['color'];\n};\n\ntype AmountProps = AmountTypeProps & AmountCommonProps;\n\nconst getTextColorProps = ({ color }: { color: AmountProps['color'] }): ColorProps => {\n const props: ColorProps = {\n amountValueColor: 'surface.text.gray.normal',\n };\n if (!color) return props;\n props.amountValueColor = color;\n return props;\n};\n\ntype AmountType = Partial<ReturnType<typeof formatNumberByParts>> & { formatted: string };\n\ninterface AmountValue extends Omit<AmountProps, 'value'> {\n amountValueColor: BaseTextProps['color'];\n amount: AmountType;\n size: Exclude<AmountProps['size'], undefined>;\n}\n\nconst AmountValue = ({\n amount,\n size = 'medium',\n type = 'body',\n weight = 'regular',\n amountValueColor,\n isAffixSubtle,\n suffix,\n}: AmountValue): ReactElement => {\n const isReactNative = getPlatformType() === 'react-native';\n const affixFontSize = isAffixSubtle ? subtleFontSizes[type][size] : normalAmountSizes[type][size];\n const numberFontFamily: keyof FontFamily = type === 'body' ? 'text' : 'heading';\n if (suffix === 'decimals' && isAffixSubtle) {\n // Native does not support alignItems of Text inside a div, instead we need to wrap is in a Text\n const AmountWrapper = isReactNative ? Text : React.Fragment;\n\n return (\n <AmountWrapper>\n <BaseText\n fontSize={normalAmountSizes[type][size]}\n fontWeight={weight}\n lineHeight={amountLineHeights[type][size]}\n color={amountValueColor}\n fontFamily={numberFontFamily}\n as={isReactNative ? undefined : 'span'}\n >\n {amount.integer}\n </BaseText>\n <BaseText\n fontWeight={weight}\n fontSize={affixFontSize}\n fontFamily={numberFontFamily}\n color={amountValueColor}\n as={isReactNative ? undefined : 'span'}\n opacity={isAffixSubtle ? opacity[8] : 1}\n >\n {amount.decimal}\n {amount.fraction}\n </BaseText>\n </AmountWrapper>\n );\n }\n\n return (\n <BaseText\n fontSize={normalAmountSizes[type][size]}\n fontWeight={weight}\n fontFamily={numberFontFamily}\n color={amountValueColor}\n lineHeight={amountLineHeights[type][size]}\n >\n {amount.formatted}\n </BaseText>\n );\n};\n\ntype FormatAmountWithSuffixType = {\n suffix: AmountProps['suffix'];\n value: number;\n};\n\n/**\n * Returns a parsed object based on the suffix passed in parameters\n * === Logic ===\n * value = 12500.45 \n * if suffix === 'decimals' => {\n \"formatted\": \"12,500.45\",\n \"integer\": \"12,500\",\n \"decimal\": \".\",\n \"fraction\": \"45\",\n \"isPrefixSymbol\": false,\n \"rawParts\": [{\"type\": \"integer\",\"value\": \"12\"},{\"type\": \"group\",\"value\": \",\"},{\"type\": \"integer\",\"value\": \"500\"},{\"type\": \"decimal\",\"value\": \".\"},{\"type\": \"fraction\",\"value\": \"45\"}]\n}\n * else if suffix === 'humanize' => { formatted: \"1.2T\" }\n * else => { formatted: \"1,23,456\" }\n * @returns {AmountType}\n */\nexport const formatAmountWithSuffix = ({\n suffix,\n value,\n}: FormatAmountWithSuffixType): AmountType => {\n try {\n switch (suffix) {\n case 'decimals': {\n const options = {\n intlOptions: {\n maximumFractionDigits: 2,\n minimumFractionDigits: 2,\n },\n };\n return {\n ...formatNumberByParts(value, options),\n formatted: formatNumber(value, options),\n };\n }\n case 'humanize': {\n const formatted = formatNumber(value, {\n intlOptions: {\n notation: 'compact',\n maximumFractionDigits: 2,\n trailingZeroDisplay: 'stripIfInteger',\n },\n });\n return {\n formatted,\n };\n }\n\n default: {\n const formatted = formatNumber(value, {\n intlOptions: {\n maximumFractionDigits: 0,\n roundingMode: 'floor',\n },\n });\n return {\n formatted,\n };\n }\n }\n } catch (err: unknown) {\n return {\n formatted: `${value}`,\n };\n }\n};\n\nconst _Amount = ({\n value,\n suffix = 'decimals',\n type = 'body',\n size = 'medium',\n weight = 'regular',\n isAffixSubtle = true,\n isStrikethrough = false,\n color,\n currencyIndicator = 'currency-symbol',\n currency = 'INR',\n testID,\n ...styledProps\n}: AmountProps): ReactElement => {\n if (__DEV__) {\n if (typeof value !== 'number') {\n throwBladeError({\n message: '`value` prop must be of type `number` for Amount.',\n moduleName: 'Amount',\n });\n }\n // @ts-expect-error neutral color should throw error\n if (color === 'neutral') {\n throwBladeError({\n message: '`neutral` color is not supported.',\n moduleName: 'Amount',\n });\n }\n\n const bodySizes = objectKeysWithType(normalAmountSizes.body);\n if ((type === 'body' || !type) && !bodySizes.includes(size)) {\n throwBladeError({\n message: `size=\"${size}\" is not allowed with type=\"body\"`,\n moduleName: 'Amount',\n });\n }\n\n const displaySizes = objectKeysWithType(normalAmountSizes.display);\n if (type === 'display' && !displaySizes.includes(size)) {\n throwBladeError({\n message: `size=\"${size}\" is not allowed with type=\"display\"`,\n moduleName: 'Amount',\n });\n }\n\n const headingSizes = objectKeysWithType(normalAmountSizes.heading);\n if (type === 'heading' && !headingSizes.includes(size)) {\n throwBladeError({\n message: `size=\"${size}\" is not allowed with type=\"heading\"`,\n moduleName: 'Amount',\n });\n }\n }\n\n const { amountValueColor } = getTextColorProps({\n color,\n });\n\n let isPrefixSymbol, currencySymbol;\n try {\n const byParts = formatNumberByParts(value, {\n currency,\n });\n isPrefixSymbol = byParts.isPrefixSymbol;\n currencySymbol = byParts.currency;\n } catch (err: unknown) {\n isPrefixSymbol = true;\n currencySymbol = currency;\n }\n\n const currencyPosition = isPrefixSymbol ? 'left' : 'right';\n const renderedValue = formatAmountWithSuffix({ suffix, value });\n const currencySymbolOrCode = currencyIndicator === 'currency-symbol' ? currencySymbol : currency;\n\n const currencyFontSize = isAffixSubtle\n ? subtleFontSizes[type][size]\n : normalAmountSizes[type][size];\n const isReactNative = getPlatformType() === 'react-native';\n\n return (\n <BaseBox\n display={(isReactNative ? 'flex' : 'inline-flex') as never}\n flexDirection=\"row\"\n {...metaAttribute({ name: MetaConstants.Amount, testID })}\n {...getStyledProps(styledProps)}\n >\n <BaseBox\n display={(isReactNative ? 'flex' : 'inline-flex') as never}\n alignItems=\"baseline\"\n flexDirection=\"row\"\n position=\"relative\"\n >\n {currencyPosition === 'left' && (\n <BaseText\n marginRight=\"spacing.1\"\n fontWeight={weight}\n fontSize={currencyFontSize}\n color={amountValueColor}\n as={isReactNative ? undefined : 'span'}\n opacity={isAffixSubtle ? opacity[8] : 1}\n >\n {currencySymbolOrCode}\n </BaseText>\n )}\n <AmountValue\n amount={renderedValue}\n amountValueColor={amountValueColor}\n type={type}\n weight={weight}\n size={size}\n isAffixSubtle={isAffixSubtle}\n suffix={suffix}\n currency={currency}\n />\n {currencyPosition === 'right' && (\n <BaseText\n marginLeft=\"spacing.1\"\n fontWeight={weight}\n fontSize={currencyFontSize}\n color={amountValueColor}\n as={isReactNative ? undefined : 'span'}\n opacity={isAffixSubtle ? opacity[8] : 1}\n >\n {currencySymbolOrCode}\n </BaseText>\n )}\n {isStrikethrough && (\n // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error\n // @ts-ignore: the borderBottomColor error below is thrown here as well\n <BaseBox\n // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error\n // @ts-ignore- intentionally setting the border color to the color prop for this hacky strikethrough\n borderBottomColor={amountValueColor}\n borderBottomWidth={type === 'body' ? 'thin' : 'thicker'}\n borderBottomStyle=\"solid\"\n position=\"absolute\"\n width=\"100%\"\n top=\"50%\"\n />\n )}\n </BaseBox>\n </BaseBox>\n );\n};\n\nconst Amount = assignWithoutSideEffects(_Amount, {\n displayName: 'Amount',\n componentId: 'Amount',\n});\n\nexport type { AmountProps };\nexport { Amount };\n"],"names":["getTextColorProps","_ref","color","props","amountValueColor","AmountValue","_ref2","amount","_ref2$size","size","_ref2$type","type","_ref2$weight","weight","isAffixSubtle","suffix","isReactNative","getPlatformType","affixFontSize","subtleFontSizes","normalAmountSizes","numberFontFamily","AmountWrapper","Text","React","Fragment","_jsxs","children","_jsx","BaseText","fontSize","fontWeight","lineHeight","amountLineHeights","fontFamily","as","undefined","integer","opacity","decimal","fraction","formatted","formatAmountWithSuffix","_ref3","value","options","intlOptions","maximumFractionDigits","minimumFractionDigits","Object","assign","formatNumberByParts","formatNumber","notation","trailingZeroDisplay","roundingMode","err","_Amount","_ref4","_ref4$suffix","_ref4$type","_ref4$size","_ref4$weight","_ref4$isAffixSubtle","_ref4$isStrikethrough","isStrikethrough","_ref4$currencyIndicat","currencyIndicator","_ref4$currency","currency","testID","styledProps","_objectWithoutProperties","_excluded","__DEV__","throwBladeError","message","moduleName","bodySizes","objectKeysWithType","body","includes","displaySizes","display","headingSizes","heading","_getTextColorProps","isPrefixSymbol","currencySymbol","byParts","currencyPosition","renderedValue","currencySymbolOrCode","currencyFontSize","BaseBox","flexDirection","metaAttribute","name","MetaConstants","Amount","getStyledProps","alignItems","position","marginRight","marginLeft","borderBottomColor","borderBottomWidth","borderBottomStyle","width","top","assignWithoutSideEffects","displayName","componentId"],"mappings":"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"}
1
+ {"version":3,"file":"Amount.js","sources":["../../../../../src/components/Amount/Amount.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport React from 'react';\nimport type { CurrencyCodeType } from '@razorpay/i18nify-js/currency';\nimport { formatNumber, formatNumberByParts } from '@razorpay/i18nify-js/currency';\nimport type { AmountTypeProps } from './amountTokens';\nimport { normalAmountSizes, subtleFontSizes, amountLineHeights } from './amountTokens';\nimport type { BaseTextProps } from '~components/Typography/BaseText/types';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { TestID } from '~utils/types';\nimport { getPlatformType } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport { objectKeysWithType } from '~utils/objectKeysWithType';\nimport { BaseText } from '~components/Typography/BaseText';\nimport { Text } from '~components/Typography';\nimport { opacity } from '~tokens/global';\nimport type { FontFamily } from '~tokens/global';\n\ntype AmountCommonProps = {\n /**\n * The value to be rendered within the component.\n *\n */\n value: number;\n /**\n * Sets the color of the amount.\n *\n * @default undefined\n */\n color?: BaseTextProps['color'];\n /**\n * Indicates what the suffix of amount should be\n *\n * @default 'decimals'\n */\n suffix?: 'decimals' | 'none' | 'humanize';\n /**\n * Makes the currency indicator(currency symbol/code) and decimal digits small and faded\n *\n * @default true\n */\n isAffixSubtle?: true | false;\n /**\n * Determines the visual representation of the currency, choose between displaying the currency symbol or code.\n *\n * Note: Currency symbol and code is determined by the locale set in user's browser or set via @razorpay/i18nify-react library.\n *\n * @default 'currency-symbol'\n */\n currencyIndicator?: 'currency-symbol' | 'currency-code';\n /**\n * The currency of the amount. Note that this component\n * only displays the provided value in the specified currency, it does not perform any currency conversion.\n *\n * @default 'INR'\n * */\n currency?: CurrencyCodeType;\n /**\n * If true, the amount text will have a line through it.\n *\n * @default false\n */\n isStrikethrough?: boolean;\n} & TestID &\n StyledPropsBlade;\n\ntype ColorProps = {\n amountValueColor: BaseTextProps['color'];\n};\n\ntype AmountProps = AmountTypeProps & AmountCommonProps;\n\nconst getTextColorProps = ({ color }: { color: AmountProps['color'] }): ColorProps => {\n const props: ColorProps = {\n amountValueColor: 'surface.text.gray.normal',\n };\n if (!color) return props;\n props.amountValueColor = color;\n return props;\n};\n\ntype AmountType = Partial<ReturnType<typeof formatNumberByParts>> & { formatted: string };\n\ninterface AmountValue extends Omit<AmountProps, 'value'> {\n amountValueColor: BaseTextProps['color'];\n amount: AmountType;\n size: Exclude<AmountProps['size'], undefined>;\n}\n\nconst AmountValue = ({\n amount,\n size = 'medium',\n type = 'body',\n weight = 'regular',\n amountValueColor,\n isAffixSubtle,\n suffix,\n}: AmountValue): ReactElement => {\n const isReactNative = getPlatformType() === 'react-native';\n const affixFontSize = isAffixSubtle ? subtleFontSizes[type][size] : normalAmountSizes[type][size];\n const numberFontFamily: keyof FontFamily = type === 'body' ? 'text' : 'heading';\n if (suffix === 'decimals' && isAffixSubtle) {\n // Native does not support alignItems of Text inside a div, instead we need to wrap is in a Text\n const AmountWrapper = isReactNative ? Text : React.Fragment;\n\n return (\n <AmountWrapper>\n <BaseText\n fontSize={normalAmountSizes[type][size]}\n fontWeight={weight}\n lineHeight={amountLineHeights[type][size]}\n color={amountValueColor}\n fontFamily={numberFontFamily}\n as={isReactNative ? undefined : 'span'}\n >\n {amount.integer}\n </BaseText>\n <BaseText\n fontWeight={weight}\n fontSize={affixFontSize}\n fontFamily={numberFontFamily}\n color={amountValueColor}\n as={isReactNative ? undefined : 'span'}\n opacity={isAffixSubtle ? opacity[800] : 1}\n >\n {amount.decimal}\n {amount.fraction}\n </BaseText>\n </AmountWrapper>\n );\n }\n\n return (\n <BaseText\n fontSize={normalAmountSizes[type][size]}\n fontWeight={weight}\n fontFamily={numberFontFamily}\n color={amountValueColor}\n lineHeight={amountLineHeights[type][size]}\n >\n {amount.formatted}\n </BaseText>\n );\n};\n\ntype FormatAmountWithSuffixType = {\n suffix: AmountProps['suffix'];\n value: number;\n};\n\n/**\n * Returns a parsed object based on the suffix passed in parameters\n * === Logic ===\n * value = 12500.45 \n * if suffix === 'decimals' => {\n \"formatted\": \"12,500.45\",\n \"integer\": \"12,500\",\n \"decimal\": \".\",\n \"fraction\": \"45\",\n \"isPrefixSymbol\": false,\n \"rawParts\": [{\"type\": \"integer\",\"value\": \"12\"},{\"type\": \"group\",\"value\": \",\"},{\"type\": \"integer\",\"value\": \"500\"},{\"type\": \"decimal\",\"value\": \".\"},{\"type\": \"fraction\",\"value\": \"45\"}]\n}\n * else if suffix === 'humanize' => { formatted: \"1.2T\" }\n * else => { formatted: \"1,23,456\" }\n * @returns {AmountType}\n */\nexport const formatAmountWithSuffix = ({\n suffix,\n value,\n}: FormatAmountWithSuffixType): AmountType => {\n try {\n switch (suffix) {\n case 'decimals': {\n const options = {\n intlOptions: {\n maximumFractionDigits: 2,\n minimumFractionDigits: 2,\n },\n };\n return {\n ...formatNumberByParts(value, options),\n formatted: formatNumber(value, options),\n };\n }\n case 'humanize': {\n const formatted = formatNumber(value, {\n intlOptions: {\n notation: 'compact',\n maximumFractionDigits: 2,\n trailingZeroDisplay: 'stripIfInteger',\n },\n });\n return {\n formatted,\n };\n }\n\n default: {\n const formatted = formatNumber(value, {\n intlOptions: {\n maximumFractionDigits: 0,\n roundingMode: 'floor',\n },\n });\n return {\n formatted,\n };\n }\n }\n } catch (err: unknown) {\n return {\n formatted: `${value}`,\n };\n }\n};\n\nconst _Amount = ({\n value,\n suffix = 'decimals',\n type = 'body',\n size = 'medium',\n weight = 'regular',\n isAffixSubtle = true,\n isStrikethrough = false,\n color,\n currencyIndicator = 'currency-symbol',\n currency = 'INR',\n testID,\n ...styledProps\n}: AmountProps): ReactElement => {\n if (__DEV__) {\n if (typeof value !== 'number') {\n throwBladeError({\n message: '`value` prop must be of type `number` for Amount.',\n moduleName: 'Amount',\n });\n }\n // @ts-expect-error neutral color should throw error\n if (color === 'neutral') {\n throwBladeError({\n message: '`neutral` color is not supported.',\n moduleName: 'Amount',\n });\n }\n\n const bodySizes = objectKeysWithType(normalAmountSizes.body);\n if ((type === 'body' || !type) && !bodySizes.includes(size)) {\n throwBladeError({\n message: `size=\"${size}\" is not allowed with type=\"body\"`,\n moduleName: 'Amount',\n });\n }\n\n const displaySizes = objectKeysWithType(normalAmountSizes.display);\n if (type === 'display' && !displaySizes.includes(size)) {\n throwBladeError({\n message: `size=\"${size}\" is not allowed with type=\"display\"`,\n moduleName: 'Amount',\n });\n }\n\n const headingSizes = objectKeysWithType(normalAmountSizes.heading);\n if (type === 'heading' && !headingSizes.includes(size)) {\n throwBladeError({\n message: `size=\"${size}\" is not allowed with type=\"heading\"`,\n moduleName: 'Amount',\n });\n }\n }\n\n const { amountValueColor } = getTextColorProps({\n color,\n });\n\n let isPrefixSymbol, currencySymbol;\n try {\n const byParts = formatNumberByParts(value, {\n currency,\n });\n isPrefixSymbol = byParts.isPrefixSymbol;\n currencySymbol = byParts.currency;\n } catch (err: unknown) {\n isPrefixSymbol = true;\n currencySymbol = currency;\n }\n\n const currencyPosition = isPrefixSymbol ? 'left' : 'right';\n const renderedValue = formatAmountWithSuffix({ suffix, value });\n const currencySymbolOrCode = currencyIndicator === 'currency-symbol' ? currencySymbol : currency;\n\n const currencyFontSize = isAffixSubtle\n ? subtleFontSizes[type][size]\n : normalAmountSizes[type][size];\n const isReactNative = getPlatformType() === 'react-native';\n\n return (\n <BaseBox\n display={(isReactNative ? 'flex' : 'inline-flex') as never}\n flexDirection=\"row\"\n {...metaAttribute({ name: MetaConstants.Amount, testID })}\n {...getStyledProps(styledProps)}\n >\n <BaseBox\n display={(isReactNative ? 'flex' : 'inline-flex') as never}\n alignItems=\"baseline\"\n flexDirection=\"row\"\n position=\"relative\"\n >\n {currencyPosition === 'left' && (\n <BaseText\n marginRight=\"spacing.1\"\n fontWeight={weight}\n fontSize={currencyFontSize}\n color={amountValueColor}\n as={isReactNative ? undefined : 'span'}\n opacity={isAffixSubtle ? opacity[800] : 1}\n >\n {currencySymbolOrCode}\n </BaseText>\n )}\n <AmountValue\n amount={renderedValue}\n amountValueColor={amountValueColor}\n type={type}\n weight={weight}\n size={size}\n isAffixSubtle={isAffixSubtle}\n suffix={suffix}\n currency={currency}\n />\n {currencyPosition === 'right' && (\n <BaseText\n marginLeft=\"spacing.1\"\n fontWeight={weight}\n fontSize={currencyFontSize}\n color={amountValueColor}\n as={isReactNative ? undefined : 'span'}\n opacity={isAffixSubtle ? opacity[800] : 1}\n >\n {currencySymbolOrCode}\n </BaseText>\n )}\n {isStrikethrough && (\n // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error\n // @ts-ignore: the borderBottomColor error below is thrown here as well\n <BaseBox\n // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error\n // @ts-ignore- intentionally setting the border color to the color prop for this hacky strikethrough\n borderBottomColor={amountValueColor}\n borderBottomWidth={type === 'body' ? 'thin' : 'thicker'}\n borderBottomStyle=\"solid\"\n position=\"absolute\"\n width=\"100%\"\n top=\"50%\"\n />\n )}\n </BaseBox>\n </BaseBox>\n );\n};\n\nconst Amount = assignWithoutSideEffects(_Amount, {\n displayName: 'Amount',\n componentId: 'Amount',\n});\n\nexport type { AmountProps };\nexport { Amount };\n"],"names":["getTextColorProps","_ref","color","props","amountValueColor","AmountValue","_ref2","amount","_ref2$size","size","_ref2$type","type","_ref2$weight","weight","isAffixSubtle","suffix","isReactNative","getPlatformType","affixFontSize","subtleFontSizes","normalAmountSizes","numberFontFamily","AmountWrapper","Text","React","Fragment","_jsxs","children","_jsx","BaseText","fontSize","fontWeight","lineHeight","amountLineHeights","fontFamily","as","undefined","integer","opacity","decimal","fraction","formatted","formatAmountWithSuffix","_ref3","value","options","intlOptions","maximumFractionDigits","minimumFractionDigits","Object","assign","formatNumberByParts","formatNumber","notation","trailingZeroDisplay","roundingMode","err","_Amount","_ref4","_ref4$suffix","_ref4$type","_ref4$size","_ref4$weight","_ref4$isAffixSubtle","_ref4$isStrikethrough","isStrikethrough","_ref4$currencyIndicat","currencyIndicator","_ref4$currency","currency","testID","styledProps","_objectWithoutProperties","_excluded","__DEV__","throwBladeError","message","moduleName","bodySizes","objectKeysWithType","body","includes","displaySizes","display","headingSizes","heading","_getTextColorProps","isPrefixSymbol","currencySymbol","byParts","currencyPosition","renderedValue","currencySymbolOrCode","currencyFontSize","BaseBox","flexDirection","metaAttribute","name","MetaConstants","Amount","getStyledProps","alignItems","position","marginRight","marginLeft","borderBottomColor","borderBottomWidth","borderBottomStyle","width","top","assignWithoutSideEffects","displayName","componentId"],"mappings":"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"}
@@ -32,7 +32,7 @@ import '@gorhom/portal';
32
32
  import 'react-native-gesture-handler';
33
33
  import '../BottomSheet/BottomSheetStack.js';
34
34
 
35
- var _excluded=["isDisabled","value","children","icon","color","testID"];var _Chip=function _Chip(_ref,ref){var _groupProps$state,_groupProps$defaultVa,_ref2;var isDisabled=_ref.isDisabled,value=_ref.value,children=_ref.children,Icon=_ref.icon,color=_ref.color,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;var groupProps=useChipGroupContext();var isInsideGroup=!isEmpty(groupProps);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isPressed=_React$useState2[0],setIsPressed=_React$useState2[1];if(__DEV__){if(!isInsideGroup){throwBladeError({moduleName:'Chip',message:'<Chip /> component should only be used within the context of a <ChipGroup /> component'});}}var _isDisabled=isDisabled!=null?isDisabled:groupProps==null?void 0:groupProps.isDisabled;var _name=groupProps==null?void 0:groupProps.name;var _isChecked=groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var defaultChecked=typeof(groupProps==null?void 0:groupProps.defaultValue)==='undefined'?undefined:groupProps==null?void 0:(_groupProps$defaultVa=groupProps.defaultValue)==null?void 0:_groupProps$defaultVa.includes(value);var useChip=(groupProps==null?void 0:groupProps.selectionType)==='single'?useRadio:useCheckbox;var _size=(groupProps==null?void 0:groupProps.size)||'small';var chipColor=(_ref2=color!=null?color:groupProps==null?void 0:groupProps.color)!=null?_ref2:'primary';var handleChange=function handleChange(_ref3){var isChecked=_ref3.isChecked,value=_ref3.value;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.addValue(value);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue(value);}};var _useChip=useChip({defaultChecked:defaultChecked,isChecked:_isChecked,isDisabled:_isDisabled,name:_name,value:value,onChange:handleChange}),state=_useChip.state,inputProps=_useChip.inputProps;var handlePointerPressedIn=React__default.useCallback(function(){if(_isDisabled)return;setIsPressed(true);},[_isDisabled]);var handlePointerPressedOut=React__default.useCallback(function(){if(_isDisabled)return;setIsPressed(false);},[_isDisabled]);var handleKeyboardPressedIn=React__default.useCallback(function(e){if(_isDisabled)return;if(e.key===' '){setIsPressed(true);}},[_isDisabled]);var handleKeyboardPressedOut=React__default.useCallback(function(e){if(_isDisabled)return;if(e.key===' '){setIsPressed(false);}},[_isDisabled]);var textVariant='unchecked';if(_isChecked&&chipColor){textVariant=chipColor;}if(_isDisabled){textVariant='disabled';}var chipTextColor=chipColorTokens.text[textVariant];var chipIconColor=chipColorTokens.icon[textVariant];var colorVariant='unchecked';var stateVariant=_isDisabled?'disabled':'default';if(_isChecked&&chipColor){colorVariant=chipColor;}var chipBackgroundColor=chipColorTokens.background[colorVariant][stateVariant];var chipBorderColor=chipColorTokens.border[colorVariant][stateVariant];return jsx(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.Chip,testID:testID}),getStyledProps(styledProps),{display:isReactNative()?'flex':'inline-flex',children:jsx(SelectorLabel,{componentName:MetaConstants.ChipLabel,onTouchStart:handlePointerPressedIn,onTouchEnd:handlePointerPressedOut,onMouseDown:handlePointerPressedIn,onMouseUp:handlePointerPressedOut,onMouseOut:handlePointerPressedOut,onKeyDown:handleKeyboardPressedIn,onKeyUp:handleKeyboardPressedOut,inputProps:isReactNative()?inputProps:{},style:{cursor:_isDisabled?'not-allowed':'pointer'},children:jsx(BaseBox,{display:"flex",flexDirection:"column",children:jsxs(BaseBox,{display:"flex",alignItems:"center",flexDirection:"row",children:[jsx(SelectorInput,{hoverTokens:getChipInputHoverTokens(chipColor),isChecked:state.isChecked,isDisabled:_isDisabled,inputProps:inputProps,ref:ref}),jsx(AnimatedChip,{borderColor:chipBorderColor,isDisabled:_isDisabled,isPressed:isPressed,isDesktop:matchedDeviceType==='desktop',children:jsxs(StyledChipWrapper,{borderColor:chipBorderColor,isChecked:_isChecked,isDisabled:_isDisabled,color:chipColor,display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center",overflow:"hidden",backgroundColor:chipBackgroundColor,borderRadius:"max",borderWidth:['xsmall','small'].includes(_size)?'thinner':'thin',paddingLeft:chipHorizontalPaddingTokens[Boolean(Icon)?'withIcon':'withoutIcon'].left[_size],paddingRight:chipHorizontalPaddingTokens[Boolean(Icon)?'withIcon':'withoutIcon'].right[_size],height:makeSize(chipHeightTokens[_size]),children:[Icon?jsx(BaseBox,{paddingRight:"spacing.3",display:"flex",children:jsx(Icon,{color:chipIconColor,size:chipIconSizes[_size]})}):null,jsx(Text,Object.assign({},chipTextSizes[_size],{truncateAfterLines:1,color:chipTextColor,children:children}))]})})]})})})}));};var Chip=assignWithoutSideEffects(React__default.forwardRef(_Chip),{displayName:'Chip'});
35
+ var _excluded=["isDisabled","value","children","icon","color","testID"];var _Chip=function _Chip(_ref,ref){var _groupProps$state,_groupProps$defaultVa,_ref2;var isDisabled=_ref.isDisabled,value=_ref.value,children=_ref.children,Icon=_ref.icon,color=_ref.color,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;var groupProps=useChipGroupContext();var isInsideGroup=!isEmpty(groupProps);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isPressed=_React$useState2[0],setIsPressed=_React$useState2[1];if(__DEV__){if(!isInsideGroup){throwBladeError({moduleName:'Chip',message:'<Chip /> component should only be used within the context of a <ChipGroup /> component'});}}var hasError=(groupProps==null?void 0:groupProps.validationState)==='error';var _isDisabled=isDisabled!=null?isDisabled:groupProps==null?void 0:groupProps.isDisabled;var _isRequired=(groupProps==null?void 0:groupProps.isRequired)||(groupProps==null?void 0:groupProps.necessityIndicator)==='required';var _name=groupProps==null?void 0:groupProps.name;var _isChecked=groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var defaultChecked=typeof(groupProps==null?void 0:groupProps.defaultValue)==='undefined'?undefined:groupProps==null?void 0:(_groupProps$defaultVa=groupProps.defaultValue)==null?void 0:_groupProps$defaultVa.includes(value);var useChip=(groupProps==null?void 0:groupProps.selectionType)==='single'?useRadio:useCheckbox;var _size=(groupProps==null?void 0:groupProps.size)||'small';var chipColor=(_ref2=color!=null?color:groupProps==null?void 0:groupProps.color)!=null?_ref2:'primary';var handleChange=function handleChange(_ref3){var isChecked=_ref3.isChecked,value=_ref3.value;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.addValue(value);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue(value);}};var _useChip=useChip({defaultChecked:defaultChecked,isChecked:_isChecked,isDisabled:_isDisabled,isRequired:_isRequired,hasError:hasError,name:_name,value:value,onChange:handleChange}),state=_useChip.state,inputProps=_useChip.inputProps;var handlePointerPressedIn=React__default.useCallback(function(){if(_isDisabled)return;setIsPressed(true);},[_isDisabled]);var handlePointerPressedOut=React__default.useCallback(function(){if(_isDisabled)return;setIsPressed(false);},[_isDisabled]);var handleKeyboardPressedIn=React__default.useCallback(function(e){if(_isDisabled)return;if(e.key===' '){setIsPressed(true);}},[_isDisabled]);var handleKeyboardPressedOut=React__default.useCallback(function(e){if(_isDisabled)return;if(e.key===' '){setIsPressed(false);}},[_isDisabled]);var textVariant='unchecked';if(_isChecked&&chipColor){textVariant=chipColor;}if(_isDisabled){textVariant='disabled';}var chipTextColor=chipColorTokens.text[textVariant];var chipIconColor=chipColorTokens.icon[textVariant];var colorVariant='unchecked';var stateVariant=_isDisabled?'disabled':'default';if(_isChecked&&chipColor){colorVariant=chipColor;}var chipBackgroundColor=chipColorTokens.background[colorVariant][stateVariant];var chipBorderColor=chipColorTokens.border[colorVariant][stateVariant];return jsx(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.Chip,testID:testID}),getStyledProps(styledProps),{display:isReactNative()?'flex':'inline-flex',children:jsx(SelectorLabel,{componentName:MetaConstants.ChipLabel,onTouchStart:handlePointerPressedIn,onTouchEnd:handlePointerPressedOut,onMouseDown:handlePointerPressedIn,onMouseUp:handlePointerPressedOut,onMouseOut:handlePointerPressedOut,onKeyDown:handleKeyboardPressedIn,onKeyUp:handleKeyboardPressedOut,inputProps:isReactNative()?inputProps:{},style:{cursor:_isDisabled?'not-allowed':'pointer'},children:jsx(BaseBox,{display:"flex",flexDirection:"column",children:jsxs(BaseBox,{display:"flex",alignItems:"center",flexDirection:"row",children:[jsx(SelectorInput,{hoverTokens:getChipInputHoverTokens(chipColor),isChecked:state.isChecked,isDisabled:_isDisabled,inputProps:inputProps,hasError:hasError,ref:ref}),jsx(AnimatedChip,{borderColor:chipBorderColor,isDisabled:_isDisabled,isPressed:isPressed,isDesktop:matchedDeviceType==='desktop',children:jsxs(StyledChipWrapper,{borderColor:chipBorderColor,isChecked:_isChecked,isDisabled:_isDisabled,color:chipColor,display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center",overflow:"hidden",backgroundColor:chipBackgroundColor,borderRadius:"max",borderWidth:['xsmall','small'].includes(_size)?'thinner':'thin',paddingLeft:chipHorizontalPaddingTokens[Boolean(Icon)?'withIcon':'withoutIcon'].left[_size],paddingRight:chipHorizontalPaddingTokens[Boolean(Icon)?'withIcon':'withoutIcon'].right[_size],height:makeSize(chipHeightTokens[_size]),children:[Icon?jsx(BaseBox,{paddingRight:"spacing.3",display:"flex",children:jsx(Icon,{color:chipIconColor,size:chipIconSizes[_size]})}):null,jsx(Text,Object.assign({},chipTextSizes[_size],{truncateAfterLines:1,color:chipTextColor,children:children}))]})})]})})})}));};var Chip=assignWithoutSideEffects(React__default.forwardRef(_Chip),{displayName:'Chip'});
36
36
 
37
37
  export { Chip };
38
38
  //# sourceMappingURL=Chip.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Chip.js","sources":["../../../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import React from 'react';\nimport { useChipGroupContext } from './ChipGroupContext';\nimport {\n chipIconSizes,\n chipTextSizes,\n chipColorTokens,\n getChipInputHoverTokens,\n chipHeightTokens,\n chipHorizontalPaddingTokens,\n} from './chipTokens';\nimport type { ChipProps } from './types';\nimport { AnimatedChip } from './AnimatedChip';\nimport { StyledChipWrapper } from './StyledChipWrapper';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport type { BladeElementRef } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport { useCheckbox } from '~components/Checkbox/useCheckbox';\nimport { useRadio } from '~components/Radio/useRadio';\nimport { isReactNative, makeSize, useBreakpoint } from '~utils';\nimport { Text } from '~components/Typography';\nimport { useTheme } from '~components/BladeProvider';\n\ntype OnChange = ({\n isChecked,\n event,\n value,\n}: {\n isChecked: boolean;\n event?: React.ChangeEvent;\n value?: string;\n}) => void;\n\nconst _Chip: React.ForwardRefRenderFunction<BladeElementRef, ChipProps> = (\n { isDisabled, value, children, icon: Icon, color, testID, ...styledProps },\n ref,\n) => {\n const { theme } = useTheme();\n const { matchedDeviceType } = useBreakpoint({ breakpoints: theme.breakpoints });\n const groupProps = useChipGroupContext();\n const isInsideGroup = !isEmpty(groupProps);\n const [isPressed, setIsPressed] = React.useState(false);\n\n if (__DEV__) {\n if (!isInsideGroup) {\n throwBladeError({\n moduleName: 'Chip',\n message:\n '<Chip /> component should only be used within the context of a <ChipGroup /> component',\n });\n }\n }\n\n const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n const _name = groupProps?.name;\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion\n const _isChecked = groupProps?.state?.isChecked(value!);\n // Check if the defaultValue property of groupProps is undefined\n const defaultChecked =\n typeof groupProps?.defaultValue === 'undefined'\n ? undefined // If undefined, defaultChecked is also undefined\n : groupProps?.defaultValue?.includes(value as string); // If multiple selection, check if value is in defaultValue array\n const useChip = groupProps?.selectionType === 'single' ? useRadio : useCheckbox;\n const _size = groupProps?.size || 'small';\n const chipColor = color ?? groupProps?.color ?? 'primary';\n\n const handleChange: OnChange = ({ isChecked, value }) => {\n if (isChecked) {\n groupProps?.state?.addValue(value!);\n } else {\n groupProps?.state?.removeValue(value!);\n }\n };\n\n const { state, inputProps } = useChip({\n defaultChecked,\n isChecked: _isChecked,\n isDisabled: _isDisabled,\n name: _name,\n value,\n onChange: handleChange,\n });\n\n const handlePointerPressedIn = React.useCallback(() => {\n if (_isDisabled) return;\n setIsPressed(true);\n }, [_isDisabled]);\n\n const handlePointerPressedOut = React.useCallback(() => {\n if (_isDisabled) return;\n setIsPressed(false);\n }, [_isDisabled]);\n\n const handleKeyboardPressedIn = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (_isDisabled) return;\n if (e.key === ' ') {\n setIsPressed(true);\n }\n },\n [_isDisabled],\n );\n\n const handleKeyboardPressedOut = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (_isDisabled) return;\n if (e.key === ' ') {\n setIsPressed(false);\n }\n },\n [_isDisabled],\n );\n\n let textVariant = 'unchecked';\n if (_isChecked && chipColor) {\n textVariant = chipColor;\n }\n if (_isDisabled) {\n textVariant = 'disabled';\n }\n const chipTextColor = chipColorTokens.text[textVariant];\n const chipIconColor = chipColorTokens.icon[textVariant];\n\n let colorVariant = 'unchecked';\n const stateVariant = _isDisabled ? 'disabled' : 'default';\n if (_isChecked && chipColor) {\n colorVariant = chipColor;\n }\n const chipBackgroundColor = chipColorTokens.background[colorVariant][stateVariant];\n const chipBorderColor = chipColorTokens.border[colorVariant][stateVariant];\n\n return (\n <BaseBox\n {...metaAttribute({ name: MetaConstants.Chip, testID })}\n {...getStyledProps(styledProps)}\n display={(isReactNative() ? 'flex' : 'inline-flex') as never}\n >\n <SelectorLabel\n componentName={MetaConstants.ChipLabel}\n onTouchStart={handlePointerPressedIn}\n onTouchEnd={handlePointerPressedOut}\n onMouseDown={handlePointerPressedIn}\n onMouseUp={handlePointerPressedOut}\n onMouseOut={handlePointerPressedOut}\n onKeyDown={handleKeyboardPressedIn}\n onKeyUp={handleKeyboardPressedOut}\n inputProps={isReactNative() ? inputProps : {}}\n style={{ cursor: _isDisabled ? 'not-allowed' : 'pointer' }}\n >\n <BaseBox display=\"flex\" flexDirection=\"column\">\n <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n <SelectorInput\n hoverTokens={getChipInputHoverTokens(chipColor)}\n isChecked={state.isChecked}\n isDisabled={_isDisabled}\n inputProps={inputProps}\n ref={ref}\n />\n <AnimatedChip\n borderColor={chipBorderColor}\n isDisabled={_isDisabled}\n isPressed={isPressed}\n isDesktop={matchedDeviceType === 'desktop'}\n >\n <StyledChipWrapper\n borderColor={chipBorderColor}\n isChecked={_isChecked}\n isDisabled={_isDisabled}\n color={chipColor}\n display=\"flex\"\n flexDirection=\"row\"\n justifyContent=\"center\"\n alignItems=\"center\"\n overflow=\"hidden\"\n backgroundColor={chipBackgroundColor}\n borderRadius=\"max\"\n borderWidth={['xsmall', 'small'].includes(_size) ? 'thinner' : 'thin'}\n paddingLeft={\n chipHorizontalPaddingTokens[Boolean(Icon) ? 'withIcon' : 'withoutIcon'].left[\n _size\n ]\n }\n paddingRight={\n chipHorizontalPaddingTokens[Boolean(Icon) ? 'withIcon' : 'withoutIcon'].right[\n _size\n ]\n }\n height={makeSize(chipHeightTokens[_size])}\n >\n {Icon ? (\n <BaseBox paddingRight=\"spacing.3\" display=\"flex\">\n <Icon color={chipIconColor} size={chipIconSizes[_size]} />\n </BaseBox>\n ) : null}\n <Text {...chipTextSizes[_size]} truncateAfterLines={1} color={chipTextColor}>\n {children}\n </Text>\n </StyledChipWrapper>\n </AnimatedChip>\n </BaseBox>\n </BaseBox>\n </SelectorLabel>\n </BaseBox>\n );\n};\n\nconst Chip = assignWithoutSideEffects(React.forwardRef(_Chip), {\n displayName: 'Chip',\n});\n\nexport { Chip };\nexport type { ChipProps };\n"],"names":["_Chip","_ref","ref","_groupProps$state","_groupProps$defaultVa","_ref2","isDisabled","value","children","Icon","icon","color","testID","styledProps","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","_useBreakpoint","useBreakpoint","breakpoints","matchedDeviceType","groupProps","useChipGroupContext","isInsideGroup","isEmpty","_React$useState","React","useState","_React$useState2","_slicedToArray","isPressed","setIsPressed","__DEV__","throwBladeError","moduleName","message","_isDisabled","_name","name","_isChecked","state","isChecked","defaultChecked","defaultValue","undefined","includes","useChip","selectionType","useRadio","useCheckbox","_size","size","chipColor","handleChange","_ref3","_groupProps$state2","addValue","_groupProps$state3","removeValue","_useChip","onChange","inputProps","handlePointerPressedIn","useCallback","handlePointerPressedOut","handleKeyboardPressedIn","e","key","handleKeyboardPressedOut","textVariant","chipTextColor","chipColorTokens","text","chipIconColor","colorVariant","stateVariant","chipBackgroundColor","background","chipBorderColor","border","_jsx","BaseBox","Object","assign","metaAttribute","MetaConstants","Chip","getStyledProps","display","isReactNative","SelectorLabel","componentName","ChipLabel","onTouchStart","onTouchEnd","onMouseDown","onMouseUp","onMouseOut","onKeyDown","onKeyUp","style","cursor","flexDirection","_jsxs","alignItems","SelectorInput","hoverTokens","getChipInputHoverTokens","AnimatedChip","borderColor","isDesktop","StyledChipWrapper","justifyContent","overflow","backgroundColor","borderRadius","borderWidth","paddingLeft","chipHorizontalPaddingTokens","Boolean","left","paddingRight","right","height","makeSize","chipHeightTokens","chipIconSizes","Text","chipTextSizes","truncateAfterLines","assignWithoutSideEffects","forwardRef","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"Chip.js","sources":["../../../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import React from 'react';\nimport { useChipGroupContext } from './ChipGroupContext';\nimport {\n chipIconSizes,\n chipTextSizes,\n chipColorTokens,\n getChipInputHoverTokens,\n chipHeightTokens,\n chipHorizontalPaddingTokens,\n} from './chipTokens';\nimport type { ChipProps } from './types';\nimport { AnimatedChip } from './AnimatedChip';\nimport { StyledChipWrapper } from './StyledChipWrapper';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport type { BladeElementRef } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport { useCheckbox } from '~components/Checkbox/useCheckbox';\nimport { useRadio } from '~components/Radio/useRadio';\nimport { isReactNative, makeSize, useBreakpoint } from '~utils';\nimport { Text } from '~components/Typography';\nimport { useTheme } from '~components/BladeProvider';\n\ntype OnChange = ({\n isChecked,\n event,\n value,\n}: {\n isChecked: boolean;\n event?: React.ChangeEvent;\n value?: string;\n}) => void;\n\nconst _Chip: React.ForwardRefRenderFunction<BladeElementRef, ChipProps> = (\n { isDisabled, value, children, icon: Icon, color, testID, ...styledProps },\n ref,\n) => {\n const { theme } = useTheme();\n const { matchedDeviceType } = useBreakpoint({ breakpoints: theme.breakpoints });\n const groupProps = useChipGroupContext();\n const isInsideGroup = !isEmpty(groupProps);\n const [isPressed, setIsPressed] = React.useState(false);\n\n if (__DEV__) {\n if (!isInsideGroup) {\n throwBladeError({\n moduleName: 'Chip',\n message:\n '<Chip /> component should only be used within the context of a <ChipGroup /> component',\n });\n }\n }\n\n const hasError = groupProps?.validationState === 'error';\n const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n const _isRequired = groupProps?.isRequired || groupProps?.necessityIndicator === 'required';\n const _name = groupProps?.name;\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion\n const _isChecked = groupProps?.state?.isChecked(value!);\n // Check if the defaultValue property of groupProps is undefined\n const defaultChecked =\n typeof groupProps?.defaultValue === 'undefined'\n ? undefined // If undefined, defaultChecked is also undefined\n : groupProps?.defaultValue?.includes(value as string); // If multiple selection, check if value is in defaultValue array\n const useChip = groupProps?.selectionType === 'single' ? useRadio : useCheckbox;\n const _size = groupProps?.size || 'small';\n const chipColor = color ?? groupProps?.color ?? 'primary';\n\n const handleChange: OnChange = ({ isChecked, value }) => {\n if (isChecked) {\n groupProps?.state?.addValue(value!);\n } else {\n groupProps?.state?.removeValue(value!);\n }\n };\n\n const { state, inputProps } = useChip({\n defaultChecked,\n isChecked: _isChecked,\n isDisabled: _isDisabled,\n isRequired: _isRequired,\n hasError,\n name: _name,\n value,\n onChange: handleChange,\n });\n\n const handlePointerPressedIn = React.useCallback(() => {\n if (_isDisabled) return;\n setIsPressed(true);\n }, [_isDisabled]);\n\n const handlePointerPressedOut = React.useCallback(() => {\n if (_isDisabled) return;\n setIsPressed(false);\n }, [_isDisabled]);\n\n const handleKeyboardPressedIn = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (_isDisabled) return;\n if (e.key === ' ') {\n setIsPressed(true);\n }\n },\n [_isDisabled],\n );\n\n const handleKeyboardPressedOut = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (_isDisabled) return;\n if (e.key === ' ') {\n setIsPressed(false);\n }\n },\n [_isDisabled],\n );\n\n let textVariant = 'unchecked';\n if (_isChecked && chipColor) {\n textVariant = chipColor;\n }\n if (_isDisabled) {\n textVariant = 'disabled';\n }\n const chipTextColor = chipColorTokens.text[textVariant];\n const chipIconColor = chipColorTokens.icon[textVariant];\n\n let colorVariant = 'unchecked';\n const stateVariant = _isDisabled ? 'disabled' : 'default';\n if (_isChecked && chipColor) {\n colorVariant = chipColor;\n }\n const chipBackgroundColor = chipColorTokens.background[colorVariant][stateVariant];\n const chipBorderColor = chipColorTokens.border[colorVariant][stateVariant];\n\n return (\n <BaseBox\n {...metaAttribute({ name: MetaConstants.Chip, testID })}\n {...getStyledProps(styledProps)}\n display={(isReactNative() ? 'flex' : 'inline-flex') as never}\n >\n <SelectorLabel\n componentName={MetaConstants.ChipLabel}\n onTouchStart={handlePointerPressedIn}\n onTouchEnd={handlePointerPressedOut}\n onMouseDown={handlePointerPressedIn}\n onMouseUp={handlePointerPressedOut}\n onMouseOut={handlePointerPressedOut}\n onKeyDown={handleKeyboardPressedIn}\n onKeyUp={handleKeyboardPressedOut}\n inputProps={isReactNative() ? inputProps : {}}\n style={{ cursor: _isDisabled ? 'not-allowed' : 'pointer' }}\n >\n <BaseBox display=\"flex\" flexDirection=\"column\">\n <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n <SelectorInput\n hoverTokens={getChipInputHoverTokens(chipColor)}\n isChecked={state.isChecked}\n isDisabled={_isDisabled}\n inputProps={inputProps}\n hasError={hasError}\n ref={ref}\n />\n <AnimatedChip\n borderColor={chipBorderColor}\n isDisabled={_isDisabled}\n isPressed={isPressed}\n isDesktop={matchedDeviceType === 'desktop'}\n >\n <StyledChipWrapper\n borderColor={chipBorderColor}\n isChecked={_isChecked}\n isDisabled={_isDisabled}\n color={chipColor}\n display=\"flex\"\n flexDirection=\"row\"\n justifyContent=\"center\"\n alignItems=\"center\"\n overflow=\"hidden\"\n backgroundColor={chipBackgroundColor}\n borderRadius=\"max\"\n borderWidth={['xsmall', 'small'].includes(_size) ? 'thinner' : 'thin'}\n paddingLeft={\n chipHorizontalPaddingTokens[Boolean(Icon) ? 'withIcon' : 'withoutIcon'].left[\n _size\n ]\n }\n paddingRight={\n chipHorizontalPaddingTokens[Boolean(Icon) ? 'withIcon' : 'withoutIcon'].right[\n _size\n ]\n }\n height={makeSize(chipHeightTokens[_size])}\n >\n {Icon ? (\n <BaseBox paddingRight=\"spacing.3\" display=\"flex\">\n <Icon color={chipIconColor} size={chipIconSizes[_size]} />\n </BaseBox>\n ) : null}\n <Text {...chipTextSizes[_size]} truncateAfterLines={1} color={chipTextColor}>\n {children}\n </Text>\n </StyledChipWrapper>\n </AnimatedChip>\n </BaseBox>\n </BaseBox>\n </SelectorLabel>\n </BaseBox>\n );\n};\n\nconst Chip = assignWithoutSideEffects(React.forwardRef(_Chip), {\n displayName: 'Chip',\n});\n\nexport { Chip };\nexport type { ChipProps };\n"],"names":["_Chip","_ref","ref","_groupProps$state","_groupProps$defaultVa","_ref2","isDisabled","value","children","Icon","icon","color","testID","styledProps","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","_useBreakpoint","useBreakpoint","breakpoints","matchedDeviceType","groupProps","useChipGroupContext","isInsideGroup","isEmpty","_React$useState","React","useState","_React$useState2","_slicedToArray","isPressed","setIsPressed","__DEV__","throwBladeError","moduleName","message","hasError","validationState","_isDisabled","_isRequired","isRequired","necessityIndicator","_name","name","_isChecked","state","isChecked","defaultChecked","defaultValue","undefined","includes","useChip","selectionType","useRadio","useCheckbox","_size","size","chipColor","handleChange","_ref3","_groupProps$state2","addValue","_groupProps$state3","removeValue","_useChip","onChange","inputProps","handlePointerPressedIn","useCallback","handlePointerPressedOut","handleKeyboardPressedIn","e","key","handleKeyboardPressedOut","textVariant","chipTextColor","chipColorTokens","text","chipIconColor","colorVariant","stateVariant","chipBackgroundColor","background","chipBorderColor","border","_jsx","BaseBox","Object","assign","metaAttribute","MetaConstants","Chip","getStyledProps","display","isReactNative","SelectorLabel","componentName","ChipLabel","onTouchStart","onTouchEnd","onMouseDown","onMouseUp","onMouseOut","onKeyDown","onKeyUp","style","cursor","flexDirection","_jsxs","alignItems","SelectorInput","hoverTokens","getChipInputHoverTokens","AnimatedChip","borderColor","isDesktop","StyledChipWrapper","justifyContent","overflow","backgroundColor","borderRadius","borderWidth","paddingLeft","chipHorizontalPaddingTokens","Boolean","left","paddingRight","right","height","makeSize","chipHeightTokens","chipIconSizes","Text","chipTextSizes","truncateAfterLines","assignWithoutSideEffects","forwardRef","displayName"],"mappings":"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"}
@@ -1,9 +1,11 @@
1
1
  import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
2
2
  import React__default from 'react';
3
- import { chipGroupGapTokens } from './chipTokens.js';
3
+ import { chipGroupLabelSizeTokens, chipGroupGapTokens } from './chipTokens.js';
4
4
  import { ChipGroupProvider } from './ChipGroupContext.js';
5
5
  import { useChipGroup } from './useChipGroup.js';
6
6
  import { BaseBox } from '../Box/BaseBox/BaseBox.native.js';
7
+ import { FormHint } from '../Form/FormHint.js';
8
+ import { FormLabel } from '../Form/FormLabel.js';
7
9
  import { SelectorGroupField } from '../Form/Selector/SelectorGroupField.js';
8
10
  import { getStyledProps } from '../Box/styledProps/getStyledProps.js';
9
11
  import '@babel/runtime/helpers/slicedToArray';
@@ -18,7 +20,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
18
20
  import { Text } from '../Typography/Text/Text.js';
19
21
  import '../Typography/Code/Code.js';
20
22
 
21
- var _excluded=["accessibilityLabel","children","isDisabled","name","defaultValue","onChange","value","size","color","testID","selectionType"];var ChipGroup=function ChipGroup(_ref){var accessibilityLabel=_ref.accessibilityLabel,children=_ref.children,_ref$isDisabled=_ref.isDisabled,isDisabled=_ref$isDisabled===void 0?false:_ref$isDisabled,name=_ref.name,defaultValue=_ref.defaultValue,onChange=_ref.onChange,value=_ref.value,_ref$size=_ref.size,size=_ref$size===void 0?'small':_ref$size,_ref$color=_ref.color,color=_ref$color===void 0?'primary':_ref$color,testID=_ref.testID,_ref$selectionType=_ref.selectionType,selectionType=_ref$selectionType===void 0?'single':_ref$selectionType,styledProps=_objectWithoutProperties(_ref,_excluded);var _useChipGroup=useChipGroup({defaultValue:defaultValue,onChange:onChange,value:value,isDisabled:isDisabled,name:name,size:size,color:color,selectionType:selectionType}),contextValue=_useChipGroup.contextValue,ids=_useChipGroup.ids;if(__DEV__){if(selectionType==='single'&&Array.isArray(defaultValue)){throwBladeError({moduleName:'ChipGroup',message:`When "selectionType" is "single", the "defaultValue" prop must be a string value, but an array was provided.`});}if(selectionType==='single'&&Array.isArray(value)){throwBladeError({moduleName:'ChipGroup',message:`When "selectionType" is "single", the "value" prop must be a string value, but an array was provided.`});}}return jsx(ChipGroupProvider,{value:contextValue,children:jsx(BaseBox,Object.assign({},getStyledProps(styledProps),{children:jsx(SelectorGroupField,{accessibilityRole:selectionType==='single'?'radiogroup':'group',labelledBy:ids.labelId,componentName:"chip-group",testID:testID,children:jsxs(BaseBox,{children:[jsx(VisuallyHidden,{children:jsx(Text,{children:accessibilityLabel})}),jsx(BaseBox,{display:"flex",flexDirection:"row",flexWrap:"wrap",children:React__default.Children.map(children,function(child,index){return jsx(BaseBox,{marginBottom:chipGroupGapTokens[size].bottom,marginRight:chipGroupGapTokens[size].right,children:child},index);})})]})})}))});};
23
+ var _excluded=["accessibilityLabel","label","labelPosition","necessityIndicator","validationState","errorText","helpText","isRequired","children","isDisabled","name","defaultValue","onChange","value","size","color","testID","selectionType"];var ChipGroup=function ChipGroup(_ref){var accessibilityLabel=_ref.accessibilityLabel,label=_ref.label,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,_ref$necessityIndicat=_ref.necessityIndicator,necessityIndicator=_ref$necessityIndicat===void 0?'none':_ref$necessityIndicat,_ref$validationState=_ref.validationState,validationState=_ref$validationState===void 0?'none':_ref$validationState,errorText=_ref.errorText,helpText=_ref.helpText,_ref$isRequired=_ref.isRequired,isRequired=_ref$isRequired===void 0?false:_ref$isRequired,children=_ref.children,_ref$isDisabled=_ref.isDisabled,isDisabled=_ref$isDisabled===void 0?false:_ref$isDisabled,name=_ref.name,defaultValue=_ref.defaultValue,onChange=_ref.onChange,value=_ref.value,_ref$size=_ref.size,size=_ref$size===void 0?'small':_ref$size,_ref$color=_ref.color,color=_ref$color===void 0?'primary':_ref$color,testID=_ref.testID,_ref$selectionType=_ref.selectionType,selectionType=_ref$selectionType===void 0?'single':_ref$selectionType,styledProps=_objectWithoutProperties(_ref,_excluded);var _useChipGroup=useChipGroup({defaultValue:defaultValue,onChange:onChange,value:value,isDisabled:isDisabled,name:name,size:size,color:color,selectionType:selectionType,isRequired:isRequired,validationState:validationState,necessityIndicator:necessityIndicator}),contextValue=_useChipGroup.contextValue,ids=_useChipGroup.ids;var showError=validationState==='error'&&errorText;var showHelpText=!showError&&helpText;var accessibilityText=`${showError?errorText:''} ${showHelpText?helpText:''}`.trim();if(__DEV__){if(selectionType==='single'&&Array.isArray(defaultValue)){throwBladeError({moduleName:'ChipGroup',message:`When "selectionType" is "single", the "defaultValue" prop must be a string value, but an array was provided.`});}if(selectionType==='single'&&Array.isArray(value)){throwBladeError({moduleName:'ChipGroup',message:`When "selectionType" is "single", the "value" prop must be a string value, but an array was provided.`});}}return jsx(ChipGroupProvider,{value:contextValue,children:jsx(BaseBox,Object.assign({},getStyledProps(styledProps),{children:jsxs(SelectorGroupField,{position:labelPosition,accessibilityRole:selectionType==='single'?'radiogroup':'group',labelledBy:ids.labelId,componentName:"chip-group",testID:testID,children:[label?jsx(FormLabel,{as:"span",necessityIndicator:necessityIndicator,position:labelPosition,id:ids.labelId,accessibilityText:accessibilityText&&`,${accessibilityText}`,size:chipGroupLabelSizeTokens[size],children:label}):null,jsxs(BaseBox,{children:[jsx(VisuallyHidden,{children:jsx(Text,{children:accessibilityLabel})}),jsx(BaseBox,{display:"flex",flexDirection:"row",flexWrap:"wrap",children:React__default.Children.map(children,function(child,index){return jsx(BaseBox,{marginBottom:chipGroupGapTokens[size].bottom,marginRight:chipGroupGapTokens[size].right,children:child},index);})}),jsx(FormHint,{size:chipGroupLabelSizeTokens[size],type:validationState==='error'?'error':'help',errorText:errorText,helpText:helpText})]})]})}))});};
22
24
 
23
25
  export { ChipGroup };
24
26
  //# sourceMappingURL=ChipGroup.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ChipGroup.js","sources":["../../../../../src/components/Chip/ChipGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { chipGroupGapTokens } from './chipTokens';\nimport { ChipGroupProvider } from './ChipGroupContext';\nimport { useChipGroup } from './useChipGroup';\nimport type { ChipGroupProps } from './types';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorGroupField } from '~components/Form/Selector/SelectorGroupField';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport { VisuallyHidden } from '~components/VisuallyHidden';\nimport { Text } from '~components/Typography';\nimport { throwBladeError } from '~utils/logger';\n\nconst ChipGroup = ({\n accessibilityLabel,\n children,\n isDisabled = false,\n name,\n defaultValue,\n onChange,\n value,\n size = 'small',\n color = 'primary',\n testID,\n selectionType = 'single',\n ...styledProps\n}: ChipGroupProps): React.ReactElement => {\n const { contextValue, ids } = useChipGroup({\n defaultValue,\n onChange,\n value,\n isDisabled,\n name,\n size,\n color,\n selectionType,\n });\n\n if (__DEV__) {\n if (selectionType === 'single' && Array.isArray(defaultValue)) {\n throwBladeError({\n moduleName: 'ChipGroup',\n message: `When \"selectionType\" is \"single\", the \"defaultValue\" prop must be a string value, but an array was provided.`,\n });\n }\n if (selectionType === 'single' && Array.isArray(value)) {\n throwBladeError({\n moduleName: 'ChipGroup',\n message: `When \"selectionType\" is \"single\", the \"value\" prop must be a string value, but an array was provided.`,\n });\n }\n }\n\n return (\n <ChipGroupProvider value={contextValue}>\n <BaseBox {...getStyledProps(styledProps)}>\n <SelectorGroupField\n accessibilityRole={selectionType === 'single' ? 'radiogroup' : 'group'}\n labelledBy={ids.labelId}\n componentName=\"chip-group\"\n testID={testID}\n >\n <BaseBox>\n <VisuallyHidden>\n <Text>{accessibilityLabel}</Text>\n </VisuallyHidden>\n <BaseBox display=\"flex\" flexDirection=\"row\" flexWrap=\"wrap\">\n {React.Children.map(children, (child, index) => {\n return (\n <BaseBox\n key={index}\n marginBottom={chipGroupGapTokens[size].bottom}\n marginRight={chipGroupGapTokens[size].right}\n >\n {child}\n </BaseBox>\n );\n })}\n </BaseBox>\n </BaseBox>\n </SelectorGroupField>\n </BaseBox>\n </ChipGroupProvider>\n );\n};\n\nexport { ChipGroup };\nexport type { ChipGroupProps };\n"],"names":["ChipGroup","_ref","accessibilityLabel","children","_ref$isDisabled","isDisabled","name","defaultValue","onChange","value","_ref$size","size","_ref$color","color","testID","_ref$selectionType","selectionType","styledProps","_objectWithoutProperties","_excluded","_useChipGroup","useChipGroup","contextValue","ids","__DEV__","Array","isArray","throwBladeError","moduleName","message","_jsx","ChipGroupProvider","BaseBox","Object","assign","getStyledProps","SelectorGroupField","accessibilityRole","labelledBy","labelId","componentName","_jsxs","VisuallyHidden","Text","display","flexDirection","flexWrap","React","Children","map","child","index","marginBottom","chipGroupGapTokens","bottom","marginRight","right"],"mappings":"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"}
1
+ {"version":3,"file":"ChipGroup.js","sources":["../../../../../src/components/Chip/ChipGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { chipGroupGapTokens, chipGroupLabelSizeTokens } from './chipTokens';\nimport { ChipGroupProvider } from './ChipGroupContext';\nimport { useChipGroup } from './useChipGroup';\nimport type { ChipGroupProps } from './types';\nimport BaseBox from '~components/Box/BaseBox';\nimport { FormHint, FormLabel } from '~components/Form';\nimport { SelectorGroupField } from '~components/Form/Selector/SelectorGroupField';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport { VisuallyHidden } from '~components/VisuallyHidden';\nimport { Text } from '~components/Typography';\nimport { throwBladeError } from '~utils/logger';\n\nconst ChipGroup = ({\n accessibilityLabel,\n label,\n labelPosition = 'top',\n necessityIndicator = 'none',\n validationState = 'none',\n errorText,\n helpText,\n isRequired = false,\n children,\n isDisabled = false,\n name,\n defaultValue,\n onChange,\n value,\n size = 'small',\n color = 'primary',\n testID,\n selectionType = 'single',\n ...styledProps\n}: ChipGroupProps): React.ReactElement => {\n const { contextValue, ids } = useChipGroup({\n defaultValue,\n onChange,\n value,\n isDisabled,\n name,\n size,\n color,\n selectionType,\n isRequired,\n validationState,\n necessityIndicator,\n });\n const showError = validationState === 'error' && errorText;\n const showHelpText = !showError && helpText;\n const accessibilityText = `${showError ? errorText : ''} ${showHelpText ? helpText : ''}`.trim();\n\n if (__DEV__) {\n if (selectionType === 'single' && Array.isArray(defaultValue)) {\n throwBladeError({\n moduleName: 'ChipGroup',\n message: `When \"selectionType\" is \"single\", the \"defaultValue\" prop must be a string value, but an array was provided.`,\n });\n }\n if (selectionType === 'single' && Array.isArray(value)) {\n throwBladeError({\n moduleName: 'ChipGroup',\n message: `When \"selectionType\" is \"single\", the \"value\" prop must be a string value, but an array was provided.`,\n });\n }\n }\n\n return (\n <ChipGroupProvider value={contextValue}>\n <BaseBox {...getStyledProps(styledProps)}>\n <SelectorGroupField\n position={labelPosition}\n accessibilityRole={selectionType === 'single' ? 'radiogroup' : 'group'}\n labelledBy={ids.labelId}\n componentName=\"chip-group\"\n testID={testID}\n >\n {label ? (\n <FormLabel\n as=\"span\"\n necessityIndicator={necessityIndicator}\n position={labelPosition}\n id={ids.labelId}\n accessibilityText={accessibilityText && `,${accessibilityText}`}\n size={chipGroupLabelSizeTokens[size]}\n >\n {label}\n </FormLabel>\n ) : null}\n <BaseBox>\n <VisuallyHidden>\n <Text>{accessibilityLabel}</Text>\n </VisuallyHidden>\n <BaseBox display=\"flex\" flexDirection=\"row\" flexWrap=\"wrap\">\n {React.Children.map(children, (child, index) => {\n return (\n <BaseBox\n key={index}\n marginBottom={chipGroupGapTokens[size].bottom}\n marginRight={chipGroupGapTokens[size].right}\n >\n {child}\n </BaseBox>\n );\n })}\n </BaseBox>\n <FormHint\n size={chipGroupLabelSizeTokens[size]}\n type={validationState === 'error' ? 'error' : 'help'}\n errorText={errorText}\n helpText={helpText}\n />\n </BaseBox>\n </SelectorGroupField>\n </BaseBox>\n </ChipGroupProvider>\n );\n};\n\nexport { ChipGroup };\nexport type { ChipGroupProps };\n"],"names":["ChipGroup","_ref","accessibilityLabel","label","_ref$labelPosition","labelPosition","_ref$necessityIndicat","necessityIndicator","_ref$validationState","validationState","errorText","helpText","_ref$isRequired","isRequired","children","_ref$isDisabled","isDisabled","name","defaultValue","onChange","value","_ref$size","size","_ref$color","color","testID","_ref$selectionType","selectionType","styledProps","_objectWithoutProperties","_excluded","_useChipGroup","useChipGroup","contextValue","ids","showError","showHelpText","accessibilityText","trim","__DEV__","Array","isArray","throwBladeError","moduleName","message","_jsx","ChipGroupProvider","BaseBox","Object","assign","getStyledProps","_jsxs","SelectorGroupField","position","accessibilityRole","labelledBy","labelId","componentName","FormLabel","as","id","chipGroupLabelSizeTokens","VisuallyHidden","Text","display","flexDirection","flexWrap","React","Children","map","child","index","marginBottom","chipGroupGapTokens","bottom","marginRight","right","FormHint","type"],"mappings":"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"}
@@ -2,7 +2,7 @@ import '../../tokens/global/typography.js';
2
2
  import '../../tokens/global/motion.js';
3
3
  import { size } from '../../tokens/global/size.js';
4
4
 
5
- var chipGroupGapTokens={xsmall:{right:'spacing.3',bottom:'spacing.3'},small:{right:'spacing.3',bottom:'spacing.3'},medium:{right:'spacing.3',bottom:'spacing.4'},large:{right:'spacing.3',bottom:'spacing.4'}};var chipHeightTokens={xsmall:size[24],small:size[28],medium:size[36],large:size[48]};var chipHorizontalPaddingTokens={withoutIcon:{left:{xsmall:'spacing.4',small:'spacing.4',medium:'spacing.6',large:'spacing.7'},right:{xsmall:'spacing.4',small:'spacing.4',medium:'spacing.6',large:'spacing.7'}},withIcon:{left:{xsmall:'spacing.4',small:'spacing.4',medium:'spacing.5',large:'spacing.6'},right:{xsmall:'spacing.4',small:'spacing.4',medium:'spacing.6',large:'spacing.7'}}};var chipColorTokens={text:{unchecked:'interactive.text.gray.subtle',disabled:'interactive.text.gray.disabled',primary:'interactive.text.primary.normal',positive:'interactive.text.positive.normal',negative:'interactive.text.negative.normal'},icon:{unchecked:'interactive.icon.gray.subtle',disabled:'interactive.icon.gray.disabled',primary:'interactive.icon.primary.normal',positive:'interactive.icon.positive.normal',negative:'interactive.icon.negative.normal'},background:{unchecked:{default:'transparent',hover:'interactive.background.gray.faded',disabled:'transparent'},primary:{default:'interactive.background.primary.faded',hover:'interactive.background.primary.fadedHighlighted',disabled:'interactive.background.primary.disabled'},positive:{default:'interactive.background.positive.faded',hover:'interactive.background.positive.fadedHighlighted',disabled:'interactive.background.positive.disabled'},negative:{default:'interactive.background.negative.faded',hover:'interactive.background.negative.fadedHighlighted',disabled:'interactive.background.negative.disabled'}},border:{unchecked:{default:'interactive.border.gray.faded',disabled:'interactive.border.gray.disabled'},primary:{default:'interactive.border.primary.default',hover:'interactive.border.primary.default',disabled:'interactive.border.primary.disabled'},positive:{default:'interactive.border.positive.default',hover:'interactive.border.positive.default',disabled:'interactive.border.positive.disabled'},negative:{default:'interactive.border.negative.default',hover:'interactive.border.negative.default',disabled:'interactive.border.negative.disabled'}}};var getChipInputHoverTokens=function getChipInputHoverTokens(color){return {default:{background:{checked:'colors.interactive.background.staticWhite.default',unchecked:'colors.interactive.background.staticWhite.default'},border:{checked:`colors.${chipColorTokens.border[color||'default'].hover}`,unchecked:'colors.interactive.border.gray.default'}}};};var chipIconSizes={xsmall:'small',small:'small',medium:'medium',large:'large'};var chipTextSizes={xsmall:{variant:'body',size:'small'},small:{variant:'body',size:'medium'},medium:{variant:'body',size:'large'},large:{variant:'body',size:'large'}};var chipMotionTokens={duration:'duration.xquick',easing:'easing.standard.effective'};
5
+ var chipGroupGapTokens={xsmall:{right:'spacing.3',bottom:'spacing.3'},small:{right:'spacing.3',bottom:'spacing.3'},medium:{right:'spacing.3',bottom:'spacing.4'},large:{right:'spacing.3',bottom:'spacing.4'}};var chipHeightTokens={xsmall:size[24],small:size[28],medium:size[36],large:size[48]};var chipGroupLabelSizeTokens={xsmall:'small',small:'medium',medium:'large',large:'large'};var chipHorizontalPaddingTokens={withoutIcon:{left:{xsmall:'spacing.4',small:'spacing.4',medium:'spacing.6',large:'spacing.7'},right:{xsmall:'spacing.4',small:'spacing.4',medium:'spacing.6',large:'spacing.7'}},withIcon:{left:{xsmall:'spacing.4',small:'spacing.4',medium:'spacing.5',large:'spacing.6'},right:{xsmall:'spacing.4',small:'spacing.4',medium:'spacing.6',large:'spacing.7'}}};var chipColorTokens={text:{unchecked:'interactive.text.gray.subtle',disabled:'interactive.text.gray.disabled',primary:'interactive.text.primary.normal',positive:'interactive.text.positive.normal',negative:'interactive.text.negative.normal'},icon:{unchecked:'interactive.icon.gray.subtle',disabled:'interactive.icon.gray.disabled',primary:'interactive.icon.primary.normal',positive:'interactive.icon.positive.normal',negative:'interactive.icon.negative.normal'},background:{unchecked:{default:'surface.background.gray.intense',hover:'interactive.background.gray.faded',disabled:'transparent'},primary:{default:'interactive.background.primary.faded',hover:'interactive.background.primary.fadedHighlighted',disabled:'interactive.background.primary.disabled'},positive:{default:'interactive.background.positive.faded',hover:'interactive.background.positive.fadedHighlighted',disabled:'interactive.background.positive.disabled'},negative:{default:'interactive.background.negative.faded',hover:'interactive.background.negative.fadedHighlighted',disabled:'interactive.background.negative.disabled'}},border:{unchecked:{default:'interactive.border.gray.faded',hover:'interactive.border.gray.faded',disabled:'interactive.border.gray.disabled'},primary:{default:'interactive.border.primary.default',hover:'interactive.border.primary.default',disabled:'interactive.border.primary.disabled'},positive:{default:'interactive.border.positive.default',hover:'interactive.border.positive.default',disabled:'interactive.border.positive.disabled'},negative:{default:'interactive.border.negative.default',hover:'interactive.border.negative.default',disabled:'interactive.border.negative.disabled'}}};var getChipInputHoverTokens=function getChipInputHoverTokens(color){return {default:{background:{checked:'colors.transparent',unchecked:'colors.transparent'},border:{checked:`colors.${chipColorTokens.border[color||'default'].hover}`,unchecked:'colors.interactive.border.gray.faded'}}};};var chipIconSizes={xsmall:'small',small:'small',medium:'medium',large:'large'};var chipTextSizes={xsmall:{variant:'body',size:'small'},small:{variant:'body',size:'medium'},medium:{variant:'body',size:'large'},large:{variant:'body',size:'large'}};var chipMotionTokens={duration:'duration.xquick',easing:'easing.standard.effective'};
6
6
 
7
- export { chipColorTokens, chipGroupGapTokens, chipHeightTokens, chipHorizontalPaddingTokens, chipIconSizes, chipMotionTokens, chipTextSizes, getChipInputHoverTokens };
7
+ export { chipColorTokens, chipGroupGapTokens, chipGroupLabelSizeTokens, chipHeightTokens, chipHorizontalPaddingTokens, chipIconSizes, chipMotionTokens, chipTextSizes, getChipInputHoverTokens };
8
8
  //# sourceMappingURL=chipTokens.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"chipTokens.js","sources":["../../../../../src/components/Chip/chipTokens.ts"],"sourcesContent":["import type { ChipGroupProps } from './ChipGroup';\nimport type { ChipBorderColors, ChipBackgroundColors } from './types';\nimport type { DotNotationSpacingStringToken } from '~utils/types';\nimport type { SelectorInputHoverTokens } from '~components/Form/Selector/types';\nimport type { IconProps } from '~components/Icons';\nimport type { BaseTextProps } from '~components/Typography/BaseText/types';\nimport type { DurationString, EasingString } from '~tokens/global';\nimport { size } from '~tokens/global';\n\nconst chipGroupGapTokens = {\n xsmall: {\n right: 'spacing.3',\n bottom: 'spacing.3',\n },\n small: {\n right: 'spacing.3',\n bottom: 'spacing.3',\n },\n medium: {\n right: 'spacing.3',\n bottom: 'spacing.4',\n },\n large: {\n right: 'spacing.3',\n bottom: 'spacing.4',\n },\n} as const;\n\nconst chipHeightTokens: Record<NonNullable<ChipGroupProps['size']>, number> = {\n xsmall: size[24],\n small: size[28],\n medium: size[36],\n large: size[48],\n};\n\ntype ChipHorizontalPaddingTokens = {\n withoutIcon: Record<\n 'left' | 'right',\n Record<NonNullable<ChipGroupProps['size']>, DotNotationSpacingStringToken>\n >;\n withIcon: Record<\n 'left' | 'right',\n Record<NonNullable<ChipGroupProps['size']>, DotNotationSpacingStringToken>\n >;\n};\n\nconst chipHorizontalPaddingTokens: ChipHorizontalPaddingTokens = {\n withoutIcon: {\n left: {\n xsmall: 'spacing.4',\n small: 'spacing.4',\n medium: 'spacing.6',\n large: 'spacing.7',\n },\n right: {\n xsmall: 'spacing.4',\n small: 'spacing.4',\n medium: 'spacing.6',\n large: 'spacing.7',\n },\n },\n withIcon: {\n left: {\n xsmall: 'spacing.4',\n small: 'spacing.4',\n medium: 'spacing.5',\n large: 'spacing.6',\n },\n right: {\n xsmall: 'spacing.4',\n small: 'spacing.4',\n medium: 'spacing.6',\n large: 'spacing.7',\n },\n },\n};\n\ntype TextColorTokens = BaseTextProps['color'];\ntype IconColorTokens = IconProps['color'];\ntype ChipColorTokens = {\n text: Record<string, TextColorTokens>;\n icon: Record<string, IconColorTokens>;\n background: Record<string, Record<string, ChipBackgroundColors>>;\n border: Record<string, Record<string, ChipBorderColors>>;\n};\n\nconst chipColorTokens: ChipColorTokens = {\n text: {\n unchecked: 'interactive.text.gray.subtle',\n disabled: 'interactive.text.gray.disabled',\n primary: 'interactive.text.primary.normal',\n positive: 'interactive.text.positive.normal',\n negative: 'interactive.text.negative.normal',\n },\n icon: {\n unchecked: 'interactive.icon.gray.subtle',\n disabled: 'interactive.icon.gray.disabled',\n primary: 'interactive.icon.primary.normal',\n positive: 'interactive.icon.positive.normal',\n negative: 'interactive.icon.negative.normal',\n },\n background: {\n unchecked: {\n default: 'transparent',\n hover: 'interactive.background.gray.faded',\n disabled: 'transparent',\n },\n primary: {\n default: 'interactive.background.primary.faded',\n hover: 'interactive.background.primary.fadedHighlighted',\n disabled: 'interactive.background.primary.disabled',\n },\n positive: {\n default: 'interactive.background.positive.faded',\n hover: 'interactive.background.positive.fadedHighlighted',\n disabled: 'interactive.background.positive.disabled',\n },\n negative: {\n default: 'interactive.background.negative.faded',\n hover: 'interactive.background.negative.fadedHighlighted',\n disabled: 'interactive.background.negative.disabled',\n },\n },\n border: {\n unchecked: {\n default: 'interactive.border.gray.faded',\n disabled: 'interactive.border.gray.disabled',\n },\n primary: {\n default: 'interactive.border.primary.default',\n hover: 'interactive.border.primary.default',\n disabled: 'interactive.border.primary.disabled',\n },\n positive: {\n default: 'interactive.border.positive.default',\n hover: 'interactive.border.positive.default',\n disabled: 'interactive.border.positive.disabled',\n },\n negative: {\n default: 'interactive.border.negative.default',\n hover: 'interactive.border.negative.default',\n disabled: 'interactive.border.negative.disabled',\n },\n },\n};\n\nconst getChipInputHoverTokens = (color: ChipGroupProps['color']): SelectorInputHoverTokens => {\n return {\n default: {\n background: {\n checked: 'colors.interactive.background.staticWhite.default',\n unchecked: 'colors.interactive.background.staticWhite.default',\n },\n border: {\n checked: `colors.${chipColorTokens.border[color || 'default'].hover}` as never,\n unchecked: 'colors.interactive.border.gray.default',\n },\n },\n };\n};\n\nconst chipIconSizes: Record<NonNullable<ChipGroupProps['size']>, IconProps['size']> = {\n xsmall: 'small',\n small: 'small',\n medium: 'medium',\n large: 'large',\n};\n\nconst chipTextSizes = {\n xsmall: {\n variant: 'body',\n size: 'small',\n },\n small: {\n variant: 'body',\n size: 'medium',\n },\n medium: {\n variant: 'body',\n size: 'large',\n },\n large: {\n variant: 'body',\n size: 'large',\n },\n} as const;\n\nconst chipMotionTokens: Record<'duration' | 'easing', DurationString | EasingString> = {\n duration: 'duration.xquick',\n easing: 'easing.standard.effective',\n};\n\nexport {\n chipColorTokens,\n chipHeightTokens,\n chipGroupGapTokens,\n getChipInputHoverTokens,\n chipHorizontalPaddingTokens,\n chipTextSizes,\n chipIconSizes,\n chipMotionTokens,\n};\n"],"names":["chipGroupGapTokens","xsmall","right","bottom","small","medium","large","chipHeightTokens","size","chipHorizontalPaddingTokens","withoutIcon","left","withIcon","chipColorTokens","text","unchecked","disabled","primary","positive","negative","icon","background","default","hover","border","getChipInputHoverTokens","color","checked","chipIconSizes","chipTextSizes","variant","chipMotionTokens","duration","easing"],"mappings":"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"}
1
+ {"version":3,"file":"chipTokens.js","sources":["../../../../../src/components/Chip/chipTokens.ts"],"sourcesContent":["import type { ChipGroupProps } from './ChipGroup';\nimport type { ChipBorderColors, ChipBackgroundColors } from './types';\nimport type { DotNotationSpacingStringToken } from '~utils/types';\nimport type { SelectorInputHoverTokens } from '~components/Form/Selector/types';\nimport type { IconProps } from '~components/Icons';\nimport type { BaseTextProps } from '~components/Typography/BaseText/types';\nimport type { DurationString, EasingString } from '~tokens/global';\nimport { size } from '~tokens/global';\n\nconst chipGroupGapTokens = {\n xsmall: {\n right: 'spacing.3',\n bottom: 'spacing.3',\n },\n small: {\n right: 'spacing.3',\n bottom: 'spacing.3',\n },\n medium: {\n right: 'spacing.3',\n bottom: 'spacing.4',\n },\n large: {\n right: 'spacing.3',\n bottom: 'spacing.4',\n },\n} as const;\n\nconst chipHeightTokens: Record<NonNullable<ChipGroupProps['size']>, number> = {\n xsmall: size[24],\n small: size[28],\n medium: size[36],\n large: size[48],\n};\n\nconst chipGroupLabelSizeTokens = {\n xsmall: 'small',\n small: 'medium',\n medium: 'large',\n large: 'large',\n} as const;\n\ntype ChipHorizontalPaddingTokens = {\n withoutIcon: Record<\n 'left' | 'right',\n Record<NonNullable<ChipGroupProps['size']>, DotNotationSpacingStringToken>\n >;\n withIcon: Record<\n 'left' | 'right',\n Record<NonNullable<ChipGroupProps['size']>, DotNotationSpacingStringToken>\n >;\n};\n\nconst chipHorizontalPaddingTokens: ChipHorizontalPaddingTokens = {\n withoutIcon: {\n left: {\n xsmall: 'spacing.4',\n small: 'spacing.4',\n medium: 'spacing.6',\n large: 'spacing.7',\n },\n right: {\n xsmall: 'spacing.4',\n small: 'spacing.4',\n medium: 'spacing.6',\n large: 'spacing.7',\n },\n },\n withIcon: {\n left: {\n xsmall: 'spacing.4',\n small: 'spacing.4',\n medium: 'spacing.5',\n large: 'spacing.6',\n },\n right: {\n xsmall: 'spacing.4',\n small: 'spacing.4',\n medium: 'spacing.6',\n large: 'spacing.7',\n },\n },\n};\n\ntype TextColorTokens = BaseTextProps['color'];\ntype IconColorTokens = IconProps['color'];\ntype ChipColorTokens = {\n text: Record<string, TextColorTokens>;\n icon: Record<string, IconColorTokens>;\n background: Record<string, Record<string, ChipBackgroundColors>>;\n border: Record<string, Record<string, ChipBorderColors>>;\n};\n\nconst chipColorTokens: ChipColorTokens = {\n text: {\n unchecked: 'interactive.text.gray.subtle',\n disabled: 'interactive.text.gray.disabled',\n primary: 'interactive.text.primary.normal',\n positive: 'interactive.text.positive.normal',\n negative: 'interactive.text.negative.normal',\n },\n icon: {\n unchecked: 'interactive.icon.gray.subtle',\n disabled: 'interactive.icon.gray.disabled',\n primary: 'interactive.icon.primary.normal',\n positive: 'interactive.icon.positive.normal',\n negative: 'interactive.icon.negative.normal',\n },\n background: {\n unchecked: {\n default: 'surface.background.gray.intense',\n hover: 'interactive.background.gray.faded',\n disabled: 'transparent',\n },\n primary: {\n default: 'interactive.background.primary.faded',\n hover: 'interactive.background.primary.fadedHighlighted',\n disabled: 'interactive.background.primary.disabled',\n },\n positive: {\n default: 'interactive.background.positive.faded',\n hover: 'interactive.background.positive.fadedHighlighted',\n disabled: 'interactive.background.positive.disabled',\n },\n negative: {\n default: 'interactive.background.negative.faded',\n hover: 'interactive.background.negative.fadedHighlighted',\n disabled: 'interactive.background.negative.disabled',\n },\n },\n border: {\n unchecked: {\n default: 'interactive.border.gray.faded',\n hover: 'interactive.border.gray.faded',\n disabled: 'interactive.border.gray.disabled',\n },\n primary: {\n default: 'interactive.border.primary.default',\n hover: 'interactive.border.primary.default',\n disabled: 'interactive.border.primary.disabled',\n },\n positive: {\n default: 'interactive.border.positive.default',\n hover: 'interactive.border.positive.default',\n disabled: 'interactive.border.positive.disabled',\n },\n negative: {\n default: 'interactive.border.negative.default',\n hover: 'interactive.border.negative.default',\n disabled: 'interactive.border.negative.disabled',\n },\n },\n};\n\nconst getChipInputHoverTokens = (color: ChipGroupProps['color']): SelectorInputHoverTokens => {\n return {\n default: {\n background: {\n checked: 'colors.transparent',\n unchecked: 'colors.transparent',\n },\n border: {\n checked: `colors.${chipColorTokens.border[color || 'default'].hover}` as never,\n unchecked: 'colors.interactive.border.gray.faded',\n },\n },\n };\n};\n\nconst chipIconSizes: Record<NonNullable<ChipGroupProps['size']>, IconProps['size']> = {\n xsmall: 'small',\n small: 'small',\n medium: 'medium',\n large: 'large',\n};\n\nconst chipTextSizes = {\n xsmall: {\n variant: 'body',\n size: 'small',\n },\n small: {\n variant: 'body',\n size: 'medium',\n },\n medium: {\n variant: 'body',\n size: 'large',\n },\n large: {\n variant: 'body',\n size: 'large',\n },\n} as const;\n\nconst chipMotionTokens: Record<'duration' | 'easing', DurationString | EasingString> = {\n duration: 'duration.xquick',\n easing: 'easing.standard.effective',\n};\n\nexport {\n chipColorTokens,\n chipHeightTokens,\n chipGroupGapTokens,\n getChipInputHoverTokens,\n chipHorizontalPaddingTokens,\n chipTextSizes,\n chipIconSizes,\n chipMotionTokens,\n chipGroupLabelSizeTokens,\n};\n"],"names":["chipGroupGapTokens","xsmall","right","bottom","small","medium","large","chipHeightTokens","size","chipGroupLabelSizeTokens","chipHorizontalPaddingTokens","withoutIcon","left","withIcon","chipColorTokens","text","unchecked","disabled","primary","positive","negative","icon","background","default","hover","border","getChipInputHoverTokens","color","checked","chipIconSizes","chipTextSizes","variant","chipMotionTokens","duration","easing"],"mappings":";;;;AASM,IAAAA,kBAAkB,CAAG,CACzBC,MAAM,CAAE,CACNC,KAAK,CAAE,WAAW,CAClBC,MAAM,CAAE,WACV,CAAC,CACDC,KAAK,CAAE,CACLF,KAAK,CAAE,WAAW,CAClBC,MAAM,CAAE,WACV,CAAC,CACDE,MAAM,CAAE,CACNH,KAAK,CAAE,WAAW,CAClBC,MAAM,CAAE,WACV,CAAC,CACDG,KAAK,CAAE,CACLJ,KAAK,CAAE,WAAW,CAClBC,MAAM,CAAE,WACV,CACF,EAEM,IAAAI,gBAAqE,CAAG,CAC5EN,MAAM,CAAEO,IAAI,CAAC,EAAE,CAAC,CAChBJ,KAAK,CAAEI,IAAI,CAAC,EAAE,CAAC,CACfH,MAAM,CAAEG,IAAI,CAAC,EAAE,CAAC,CAChBF,KAAK,CAAEE,IAAI,CAAC,EAAE,CAChB,EAEM,IAAAC,wBAAwB,CAAG,CAC/BR,MAAM,CAAE,OAAO,CACfG,KAAK,CAAE,QAAQ,CACfC,MAAM,CAAE,OAAO,CACfC,KAAK,CAAE,OACT,EAaM,IAAAI,2BAAwD,CAAG,CAC/DC,WAAW,CAAE,CACXC,IAAI,CAAE,CACJX,MAAM,CAAE,WAAW,CACnBG,KAAK,CAAE,WAAW,CAClBC,MAAM,CAAE,WAAW,CACnBC,KAAK,CAAE,WACT,CAAC,CACDJ,KAAK,CAAE,CACLD,MAAM,CAAE,WAAW,CACnBG,KAAK,CAAE,WAAW,CAClBC,MAAM,CAAE,WAAW,CACnBC,KAAK,CAAE,WACT,CACF,CAAC,CACDO,QAAQ,CAAE,CACRD,IAAI,CAAE,CACJX,MAAM,CAAE,WAAW,CACnBG,KAAK,CAAE,WAAW,CAClBC,MAAM,CAAE,WAAW,CACnBC,KAAK,CAAE,WACT,CAAC,CACDJ,KAAK,CAAE,CACLD,MAAM,CAAE,WAAW,CACnBG,KAAK,CAAE,WAAW,CAClBC,MAAM,CAAE,WAAW,CACnBC,KAAK,CAAE,WACT,CACF,CACF,EAWM,IAAAQ,eAAgC,CAAG,CACvCC,IAAI,CAAE,CACJC,SAAS,CAAE,8BAA8B,CACzCC,QAAQ,CAAE,gCAAgC,CAC1CC,OAAO,CAAE,iCAAiC,CAC1CC,QAAQ,CAAE,kCAAkC,CAC5CC,QAAQ,CAAE,kCACZ,CAAC,CACDC,IAAI,CAAE,CACJL,SAAS,CAAE,8BAA8B,CACzCC,QAAQ,CAAE,gCAAgC,CAC1CC,OAAO,CAAE,iCAAiC,CAC1CC,QAAQ,CAAE,kCAAkC,CAC5CC,QAAQ,CAAE,kCACZ,CAAC,CACDE,UAAU,CAAE,CACVN,SAAS,CAAE,CACTO,OAAO,CAAE,iCAAiC,CAC1CC,KAAK,CAAE,mCAAmC,CAC1CP,QAAQ,CAAE,aACZ,CAAC,CACDC,OAAO,CAAE,CACPK,OAAO,CAAE,sCAAsC,CAC/CC,KAAK,CAAE,iDAAiD,CACxDP,QAAQ,CAAE,yCACZ,CAAC,CACDE,QAAQ,CAAE,CACRI,OAAO,CAAE,uCAAuC,CAChDC,KAAK,CAAE,kDAAkD,CACzDP,QAAQ,CAAE,0CACZ,CAAC,CACDG,QAAQ,CAAE,CACRG,OAAO,CAAE,uCAAuC,CAChDC,KAAK,CAAE,kDAAkD,CACzDP,QAAQ,CAAE,0CACZ,CACF,CAAC,CACDQ,MAAM,CAAE,CACNT,SAAS,CAAE,CACTO,OAAO,CAAE,+BAA+B,CACxCC,KAAK,CAAE,+BAA+B,CACtCP,QAAQ,CAAE,kCACZ,CAAC,CACDC,OAAO,CAAE,CACPK,OAAO,CAAE,oCAAoC,CAC7CC,KAAK,CAAE,oCAAoC,CAC3CP,QAAQ,CAAE,qCACZ,CAAC,CACDE,QAAQ,CAAE,CACRI,OAAO,CAAE,qCAAqC,CAC9CC,KAAK,CAAE,qCAAqC,CAC5CP,QAAQ,CAAE,sCACZ,CAAC,CACDG,QAAQ,CAAE,CACRG,OAAO,CAAE,qCAAqC,CAC9CC,KAAK,CAAE,qCAAqC,CAC5CP,QAAQ,CAAE,sCACZ,CACF,CACF,EAEM,IAAAS,uBAAuB,CAAG,SAA1BA,uBAAuBA,CAAIC,KAA8B,CAA+B,CAC5F,OAAO,CACLJ,OAAO,CAAE,CACPD,UAAU,CAAE,CACVM,OAAO,CAAE,oBAAoB,CAC7BZ,SAAS,CAAE,oBACb,CAAC,CACDS,MAAM,CAAE,CACNG,OAAO,CAAG,CAASd,OAAAA,EAAAA,eAAe,CAACW,MAAM,CAACE,KAAK,EAAI,SAAS,CAAC,CAACH,KAAM,CAAU,CAAA,CAC9ER,SAAS,CAAE,sCACb,CACF,CACF,CAAC,CACH,EAEM,IAAAa,aAA6E,CAAG,CACpF5B,MAAM,CAAE,OAAO,CACfG,KAAK,CAAE,OAAO,CACdC,MAAM,CAAE,QAAQ,CAChBC,KAAK,CAAE,OACT,EAEM,IAAAwB,aAAa,CAAG,CACpB7B,MAAM,CAAE,CACN8B,OAAO,CAAE,MAAM,CACfvB,IAAI,CAAE,OACR,CAAC,CACDJ,KAAK,CAAE,CACL2B,OAAO,CAAE,MAAM,CACfvB,IAAI,CAAE,QACR,CAAC,CACDH,MAAM,CAAE,CACN0B,OAAO,CAAE,MAAM,CACfvB,IAAI,CAAE,OACR,CAAC,CACDF,KAAK,CAAE,CACLyB,OAAO,CAAE,MAAM,CACfvB,IAAI,CAAE,OACR,CACF,EAEM,IAAAwB,gBAA8E,CAAG,CACrFC,QAAQ,CAAE,iBAAiB,CAC3BC,MAAM,CAAE,2BACV;;;;"}
@@ -1,7 +1,7 @@
1
1
  import getIn from '../../utils/lodashButBetter/get.js';
2
2
  import { makeBorderSize } from '../../utils/makeBorderSize/makeBorderSize.js';
3
3
 
4
- var getAnimatedChipStyles=function getAnimatedChipStyles(_ref){var theme=_ref.theme,isDesktop=_ref.isDesktop,isDisabled=_ref.isDisabled,borderColor=_ref.borderColor;return {backgroundColor:isDisabled?'transparent':getIn(theme.colors,'interactive.background.staticWhite.default'),borderRadius:makeBorderSize(theme.border.radius.max),borderColor:getIn(theme.colors,borderColor),borderWidth:getIn(theme,'border.width.thin'),display:'flex',flexWrap:'nowrap',flexDirection:'row',alignItems:'center',justifyContent:'center',textAlign:'left',textOverflow:'ellipsis',maxWidth:isDesktop?'420px':'280px'};};
4
+ var getAnimatedChipStyles=function getAnimatedChipStyles(_ref){var theme=_ref.theme,isDesktop=_ref.isDesktop,borderColor=_ref.borderColor;return {backgroundColor:'transparent',borderRadius:makeBorderSize(theme.border.radius.max),borderColor:getIn(theme.colors,borderColor),borderWidth:getIn(theme,'border.width.thin'),display:'flex',flexWrap:'nowrap',flexDirection:'row',alignItems:'center',justifyContent:'center',textAlign:'left',textOverflow:'ellipsis',maxWidth:isDesktop?'420px':'280px'};};
5
5
 
6
6
  export { getAnimatedChipStyles };
7
7
  //# sourceMappingURL=getAnimatedChipStyles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"getAnimatedChipStyles.js","sources":["../../../../../src/components/Chip/getAnimatedChipStyles.ts"],"sourcesContent":["import type { CSSObject } from 'styled-components';\nimport type { AnimatedChipProps } from './types';\nimport getIn from '~utils/lodashButBetter/get';\nimport { makeBorderSize } from '~utils/makeBorderSize';\n\nconst getAnimatedChipStyles = ({\n theme,\n isDesktop,\n isDisabled,\n borderColor,\n}: AnimatedChipProps): CSSObject => {\n return {\n backgroundColor: isDisabled\n ? 'transparent'\n : getIn(theme.colors, 'interactive.background.staticWhite.default'),\n borderRadius: makeBorderSize(theme.border.radius.max),\n borderColor: getIn(theme.colors, borderColor),\n borderWidth: getIn(theme, 'border.width.thin'),\n display: 'flex',\n flexWrap: 'nowrap',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n textAlign: 'left',\n textOverflow: 'ellipsis',\n maxWidth: isDesktop ? '420px' : '280px',\n };\n};\n\nexport { getAnimatedChipStyles };\n"],"names":["getAnimatedChipStyles","_ref","theme","isDesktop","isDisabled","borderColor","backgroundColor","getIn","colors","borderRadius","makeBorderSize","border","radius","max","borderWidth","display","flexWrap","flexDirection","alignItems","justifyContent","textAlign","textOverflow","maxWidth"],"mappings":";;;AAKM,IAAAA,qBAAqB,CAAG,SAAxBA,qBAAqBA,CAAAC,IAAA,CAKS,CAAA,IAJlCC,KAAK,CAAAD,IAAA,CAALC,KAAK,CACLC,SAAS,CAAAF,IAAA,CAATE,SAAS,CACTC,UAAU,CAAAH,IAAA,CAAVG,UAAU,CACVC,WAAW,CAAAJ,IAAA,CAAXI,WAAW,CAEX,OAAO,CACLC,eAAe,CAAEF,UAAU,CACvB,aAAa,CACbG,KAAK,CAACL,KAAK,CAACM,MAAM,CAAE,4CAA4C,CAAC,CACrEC,YAAY,CAAEC,cAAc,CAACR,KAAK,CAACS,MAAM,CAACC,MAAM,CAACC,GAAG,CAAC,CACrDR,WAAW,CAAEE,KAAK,CAACL,KAAK,CAACM,MAAM,CAAEH,WAAW,CAAC,CAC7CS,WAAW,CAAEP,KAAK,CAACL,KAAK,CAAE,mBAAmB,CAAC,CAC9Ca,OAAO,CAAE,MAAM,CACfC,QAAQ,CAAE,QAAQ,CAClBC,aAAa,CAAE,KAAK,CACpBC,UAAU,CAAE,QAAQ,CACpBC,cAAc,CAAE,QAAQ,CACxBC,SAAS,CAAE,MAAM,CACjBC,YAAY,CAAE,UAAU,CACxBC,QAAQ,CAAEnB,SAAS,CAAG,OAAO,CAAG,OAClC,CAAC,CACH;;;;"}
1
+ {"version":3,"file":"getAnimatedChipStyles.js","sources":["../../../../../src/components/Chip/getAnimatedChipStyles.ts"],"sourcesContent":["import type { CSSObject } from 'styled-components';\nimport type { AnimatedChipProps } from './types';\nimport getIn from '~utils/lodashButBetter/get';\nimport { makeBorderSize } from '~utils/makeBorderSize';\n\nconst getAnimatedChipStyles = ({ theme, isDesktop, borderColor }: AnimatedChipProps): CSSObject => {\n return {\n backgroundColor: 'transparent',\n borderRadius: makeBorderSize(theme.border.radius.max),\n borderColor: getIn(theme.colors, borderColor),\n borderWidth: getIn(theme, 'border.width.thin'),\n display: 'flex',\n flexWrap: 'nowrap',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n textAlign: 'left',\n textOverflow: 'ellipsis',\n maxWidth: isDesktop ? '420px' : '280px',\n };\n};\n\nexport { getAnimatedChipStyles };\n"],"names":["getAnimatedChipStyles","_ref","theme","isDesktop","borderColor","backgroundColor","borderRadius","makeBorderSize","border","radius","max","getIn","colors","borderWidth","display","flexWrap","flexDirection","alignItems","justifyContent","textAlign","textOverflow","maxWidth"],"mappings":";;;AAKM,IAAAA,qBAAqB,CAAG,SAAxBA,qBAAqBA,CAAAC,IAAA,CAAwE,CAAA,IAAlEC,KAAK,CAAAD,IAAA,CAALC,KAAK,CAAEC,SAAS,CAAAF,IAAA,CAATE,SAAS,CAAEC,WAAW,CAAAH,IAAA,CAAXG,WAAW,CAC5D,OAAO,CACLC,eAAe,CAAE,aAAa,CAC9BC,YAAY,CAAEC,cAAc,CAACL,KAAK,CAACM,MAAM,CAACC,MAAM,CAACC,GAAG,CAAC,CACrDN,WAAW,CAAEO,KAAK,CAACT,KAAK,CAACU,MAAM,CAAER,WAAW,CAAC,CAC7CS,WAAW,CAAEF,KAAK,CAACT,KAAK,CAAE,mBAAmB,CAAC,CAC9CY,OAAO,CAAE,MAAM,CACfC,QAAQ,CAAE,QAAQ,CAClBC,aAAa,CAAE,KAAK,CACpBC,UAAU,CAAE,QAAQ,CACpBC,cAAc,CAAE,QAAQ,CACxBC,SAAS,CAAE,MAAM,CACjBC,YAAY,CAAE,UAAU,CACxBC,QAAQ,CAAElB,SAAS,CAAG,OAAO,CAAG,OAClC,CAAC,CACH;;;;"}
@@ -4,7 +4,7 @@ import isUndefined from '../../utils/lodashButBetter/isUndefined.js';
4
4
  import { useControllableState } from '../../utils/useControllable.js';
5
5
  import { useId } from '../../utils/useId.js';
6
6
 
7
- var useChipGroup=function useChipGroup(_ref){var value=_ref.value,defaultValue=_ref.defaultValue,isDisabled=_ref.isDisabled,_onChange=_ref.onChange,name=_ref.name,size=_ref.size,color=_ref.color,selectionType=_ref.selectionType;var idBase=useId('chip-group');var labelId=`${idBase}-label`;var fallbackName=name!=null?name:idBase;var _useControllableState=useControllableState({value:value&&selectionType==='single'?[value]:value,defaultValue:defaultValue&&selectionType==='single'?[defaultValue]:defaultValue||[],onChange:function onChange(values){return _onChange==null?void 0:_onChange({values:values,name:fallbackName});}}),_useControllableState2=_slicedToArray(_useControllableState,2),checkedValues=_useControllableState2[0],setValues=_useControllableState2[1];var state=React__default.useMemo(function(){return {value:checkedValues,isChecked:function isChecked(value){if(selectionType==='single'){if(isUndefined(value)||isUndefined(checkedValues))return false;return checkedValues[0]===value;}return checkedValues.includes(value);},addValue:function addValue(value){if(isDisabled){return;}if(selectionType==='single'){setValues(function(){return [value];});}if(selectionType==='multiple'&&!checkedValues.includes(value)){setValues(function(){return checkedValues.concat(value);});}},removeValue:function removeValue(value){if(isDisabled){return;}if(selectionType==='single'){setValues(undefined);}if(selectionType==='multiple'&&Array.isArray(checkedValues)&&checkedValues.includes(value)){setValues(function(){return checkedValues.filter(function(existingValue){return existingValue!==value;});});}}};},[checkedValues,isDisabled,setValues,selectionType]);var contextValue=React__default.useMemo(function(){return {isDisabled:isDisabled,name:name,state:state,size:size,color:color,selectionType:selectionType};},[isDisabled,name,state,size,color,selectionType]);return {state:state,contextValue:contextValue,ids:{labelId:labelId}};};
7
+ var useChipGroup=function useChipGroup(_ref){var value=_ref.value,defaultValue=_ref.defaultValue,isDisabled=_ref.isDisabled,isRequired=_ref.isRequired,_onChange=_ref.onChange,name=_ref.name,size=_ref.size,color=_ref.color,selectionType=_ref.selectionType,necessityIndicator=_ref.necessityIndicator,validationState=_ref.validationState;var idBase=useId('chip-group');var labelId=`${idBase}-label`;var fallbackName=name!=null?name:idBase;var _useControllableState=useControllableState({value:value&&selectionType==='single'?[value]:value,defaultValue:defaultValue&&selectionType==='single'?[defaultValue]:defaultValue||[],onChange:function onChange(values){return _onChange==null?void 0:_onChange({values:values,name:fallbackName});}}),_useControllableState2=_slicedToArray(_useControllableState,2),checkedValues=_useControllableState2[0],setValues=_useControllableState2[1];var state=React__default.useMemo(function(){return {value:checkedValues,isChecked:function isChecked(value){if(selectionType==='single'){if(isUndefined(value)||isUndefined(checkedValues))return false;return checkedValues[0]===value;}return checkedValues.includes(value);},addValue:function addValue(value){if(isDisabled){return;}if(selectionType==='single'){setValues(function(){return [value];});}if(selectionType==='multiple'&&!checkedValues.includes(value)){setValues(function(){return checkedValues.concat(value);});}},removeValue:function removeValue(value){if(isDisabled){return;}if(selectionType==='single'){setValues(undefined);}if(selectionType==='multiple'&&Array.isArray(checkedValues)&&checkedValues.includes(value)){setValues(function(){return checkedValues.filter(function(existingValue){return existingValue!==value;});});}}};},[checkedValues,isDisabled,setValues,selectionType]);var contextValue=React__default.useMemo(function(){return {isDisabled:isDisabled,isRequired:isRequired,necessityIndicator:necessityIndicator,validationState:validationState,name:name,state:state,size:size,color:color,selectionType:selectionType};},[isDisabled,isRequired,necessityIndicator,validationState,name,state,size,color,selectionType]);return {state:state,contextValue:contextValue,ids:{labelId:labelId}};};
8
8
 
9
9
  export { useChipGroup };
10
10
  //# sourceMappingURL=useChipGroup.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useChipGroup.js","sources":["../../../../../src/components/Chip/useChipGroup.ts"],"sourcesContent":["import React from 'react';\nimport type { ChipGroupProps, ChipGroupContextType, State } from './types';\nimport isUndefined from '~utils/lodashButBetter/isUndefined';\nimport { useControllableState } from '~utils/useControllable';\nimport { useId } from '~utils/useId';\n\ntype UseChipGroupProps = Pick<\n ChipGroupProps,\n 'isDisabled' | 'name' | 'value' | 'defaultValue' | 'onChange' | 'size' | 'color' | 'selectionType'\n>;\ntype UseChipGroupReturn = {\n state: State;\n contextValue: ChipGroupContextType;\n ids: { labelId: string };\n};\n\nconst useChipGroup = ({\n value,\n defaultValue,\n isDisabled,\n onChange,\n name,\n size,\n color,\n selectionType,\n}: UseChipGroupProps): UseChipGroupReturn => {\n const idBase = useId('chip-group');\n const labelId = `${idBase}-label`;\n\n const fallbackName = name ?? idBase;\n const [checkedValues, setValues] = useControllableState({\n value: (value && selectionType === 'single' ? [value] : value) as string[] | undefined,\n // If selectionType is single, we need to convert the value to an array\n defaultValue: (defaultValue && selectionType === 'single'\n ? [defaultValue]\n : defaultValue || []) as string[] | undefined,\n onChange: (values: string[]) => onChange?.({ values, name: fallbackName }),\n });\n\n const state = React.useMemo<State>(() => {\n return {\n value: checkedValues,\n isChecked(value: string): boolean {\n if (selectionType === 'single') {\n if (isUndefined(value) || isUndefined(checkedValues)) return false;\n return checkedValues[0] === value;\n }\n return checkedValues.includes(value);\n },\n addValue(value: string) {\n if (isDisabled) {\n return;\n }\n if (selectionType === 'single') {\n setValues(() => [value]);\n }\n if (selectionType === 'multiple' && !checkedValues.includes(value)) {\n setValues(() => checkedValues.concat(value));\n }\n },\n removeValue(value: string) {\n if (isDisabled) {\n return;\n }\n if (selectionType === 'single') {\n setValues(undefined!);\n }\n if (\n selectionType === 'multiple' &&\n Array.isArray(checkedValues) &&\n checkedValues.includes(value)\n ) {\n setValues(() => checkedValues.filter((existingValue) => existingValue !== value));\n }\n },\n };\n }, [checkedValues, isDisabled, setValues, selectionType]);\n\n const contextValue = React.useMemo<ChipGroupContextType>(() => {\n return {\n isDisabled,\n name,\n state,\n size,\n color,\n selectionType,\n };\n }, [isDisabled, name, state, size, color, selectionType]);\n\n return { state, contextValue, ids: { labelId } };\n};\n\nexport { useChipGroup };\n"],"names":["useChipGroup","_ref","value","defaultValue","isDisabled","onChange","name","size","color","selectionType","idBase","useId","labelId","fallbackName","_useControllableState","useControllableState","values","_useControllableState2","_slicedToArray","checkedValues","setValues","state","React","useMemo","isChecked","isUndefined","includes","addValue","concat","removeValue","undefined","Array","isArray","filter","existingValue","contextValue","ids"],"mappings":"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"}
1
+ {"version":3,"file":"useChipGroup.js","sources":["../../../../../src/components/Chip/useChipGroup.ts"],"sourcesContent":["import React from 'react';\nimport type { ChipGroupProps, ChipGroupContextType, State } from './types';\nimport isUndefined from '~utils/lodashButBetter/isUndefined';\nimport { useControllableState } from '~utils/useControllable';\nimport { useId } from '~utils/useId';\n\ntype UseChipGroupProps = Pick<\n ChipGroupProps,\n | 'isDisabled'\n | 'isRequired'\n | 'necessityIndicator'\n | 'validationState'\n | 'name'\n | 'value'\n | 'defaultValue'\n | 'onChange'\n | 'size'\n | 'color'\n | 'selectionType'\n>;\ntype UseChipGroupReturn = {\n state: State;\n contextValue: ChipGroupContextType;\n ids: { labelId: string };\n};\n\nconst useChipGroup = ({\n value,\n defaultValue,\n isDisabled,\n isRequired,\n onChange,\n name,\n size,\n color,\n selectionType,\n necessityIndicator,\n validationState,\n}: UseChipGroupProps): UseChipGroupReturn => {\n const idBase = useId('chip-group');\n const labelId = `${idBase}-label`;\n const fallbackName = name ?? idBase;\n const [checkedValues, setValues] = useControllableState({\n value: (value && selectionType === 'single' ? [value] : value) as string[] | undefined,\n // If selectionType is single, we need to convert the value to an array\n defaultValue: (defaultValue && selectionType === 'single'\n ? [defaultValue]\n : defaultValue || []) as string[] | undefined,\n onChange: (values: string[]) => onChange?.({ values, name: fallbackName }),\n });\n\n const state = React.useMemo<State>(() => {\n return {\n value: checkedValues,\n isChecked(value: string): boolean {\n if (selectionType === 'single') {\n if (isUndefined(value) || isUndefined(checkedValues)) return false;\n return checkedValues[0] === value;\n }\n return checkedValues.includes(value);\n },\n addValue(value: string) {\n if (isDisabled) {\n return;\n }\n if (selectionType === 'single') {\n setValues(() => [value]);\n }\n if (selectionType === 'multiple' && !checkedValues.includes(value)) {\n setValues(() => checkedValues.concat(value));\n }\n },\n removeValue(value: string) {\n if (isDisabled) {\n return;\n }\n if (selectionType === 'single') {\n setValues(undefined!);\n }\n if (\n selectionType === 'multiple' &&\n Array.isArray(checkedValues) &&\n checkedValues.includes(value)\n ) {\n setValues(() => checkedValues.filter((existingValue) => existingValue !== value));\n }\n },\n };\n }, [checkedValues, isDisabled, setValues, selectionType]);\n\n const contextValue = React.useMemo<ChipGroupContextType>(() => {\n return {\n isDisabled,\n isRequired,\n necessityIndicator,\n validationState,\n name,\n state,\n size,\n color,\n selectionType,\n };\n }, [\n isDisabled,\n isRequired,\n necessityIndicator,\n validationState,\n name,\n state,\n size,\n color,\n selectionType,\n ]);\n\n return { state, contextValue, ids: { labelId } };\n};\n\nexport { useChipGroup };\n"],"names":["useChipGroup","_ref","value","defaultValue","isDisabled","isRequired","onChange","name","size","color","selectionType","necessityIndicator","validationState","idBase","useId","labelId","fallbackName","_useControllableState","useControllableState","values","_useControllableState2","_slicedToArray","checkedValues","setValues","state","React","useMemo","isChecked","isUndefined","includes","addValue","concat","removeValue","undefined","Array","isArray","filter","existingValue","contextValue","ids"],"mappings":"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"}
@@ -1,14 +1,15 @@
1
1
  import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
2
- import { useCallback } from 'react';
2
+ import { indicatorDotSizes, textSizeMapping } from './indicatorTokens.js';
3
3
  import 'styled-components/native';
4
4
  import '@gorhom/portal';
5
5
  import 'react-native-gesture-handler';
6
6
  import useTheme from '../BladeProvider/useTheme.js';
7
7
  import 'react-native';
8
8
  import '@babel/runtime/helpers/slicedToArray';
9
+ import 'react';
9
10
  import { isReactNative } from '../../utils/platform/isReactNative.js';
10
11
  import '../BottomSheet/BottomSheetStack.js';
11
- import { jsx, jsxs } from 'react/jsx-runtime';
12
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
12
13
  import { BaseBox } from '../Box/BaseBox/BaseBox.native.js';
13
14
  import 'react-native-svg';
14
15
  import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.native.js';
@@ -19,13 +20,12 @@ import '../Typography/BaseText/BaseText.native.js';
19
20
  import { getStyledProps } from '../Box/styledProps/getStyledProps.js';
20
21
  import '../../tokens/global/typography.js';
21
22
  import '../../tokens/global/motion.js';
22
- import { size } from '../../tokens/global/size.js';
23
23
  import { Text } from '../Typography/Text/Text.js';
24
24
  import '../Typography/Code/Code.js';
25
25
  import { getStringFromReactText } from '../../utils/getStringChildren/getStringChildren.js';
26
26
  import { makeAccessible } from '../../utils/makeAccessible/makeAccessible.native.js';
27
27
 
28
- var _excluded=["accessibilityLabel","children","size","color","testID"];var Indicator=function Indicator(_ref){var accessibilityLabel=_ref.accessibilityLabel,children=_ref.children,_ref$size=_ref.size,size$1=_ref$size===void 0?'medium':_ref$size,_ref$color=_ref.color,color=_ref$color===void 0?'neutral':_ref$color,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var childrenString=getStringFromReactText(children);var fillColor=color==='primary'?theme.colors.surface.background.primary.intense:theme.colors.feedback.background[color].intense;var getDimension=useCallback(function(){switch(size$1){case'small':return {svgSize:size[6],textSize:'small'};case'large':return {svgSize:size[10],textSize:'medium'};default:return {svgSize:size[8],textSize:'medium'};}},[size$1]);var dimensions=getDimension();var isWeb=!isReactNative();var a11yProps=makeAccessible(Object.assign({label:accessibilityLabel!=null?accessibilityLabel:childrenString},isWeb&&{role:'status'}));return jsx(BaseBox,Object.assign({display:isWeb?'inline-flex':'flex'},a11yProps,metaAttribute({name:MetaConstants.Indicator,testID:testID}),getStyledProps(styledProps),{children:jsxs(BaseBox,{display:"flex",flexDirection:"row",alignItems:"center",children:[jsx(Svg,{width:String(dimensions.svgSize),height:String(dimensions.svgSize),viewBox:"0 0 10 10",fill:"none",children:jsx(Circle,{cx:"5",cy:"5",r:"5",fill:fillColor})}),jsx(BaseBox,{marginLeft:"spacing.2",children:jsx(Text,{weight:"medium",color:"surface.text.gray.subtle",textAlign:"left",size:dimensions.textSize,children:children})})]})}));};
28
+ var _excluded=["accessibilityLabel","children","size","color","emphasis","testID"];var Indicator=function Indicator(_ref){var accessibilityLabel=_ref.accessibilityLabel,children=_ref.children,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,_ref$color=_ref.color,color=_ref$color===void 0?'neutral':_ref$color,_ref$emphasis=_ref.emphasis,emphasis=_ref$emphasis===void 0?'subtle':_ref$emphasis,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var childrenString=getStringFromReactText(children);var isIntense=emphasis==='intense';var isPrimary=color==='primary';var fillColorOuter=isPrimary?theme.colors.surface.background.primary.subtle:theme.colors.feedback.background[color].subtle;var fillColorInner=isPrimary?theme.colors.surface.icon.primary.normal:theme.colors.feedback.icon[color].intense;var isWeb=!isReactNative();var a11yProps=makeAccessible(Object.assign({label:accessibilityLabel!=null?accessibilityLabel:childrenString},isWeb&&{role:'status'}));var svgSize=isIntense?indicatorDotSizes[emphasis][size].outer:indicatorDotSizes[emphasis][size].inner;return jsx(BaseBox,Object.assign({display:isWeb?'inline-flex':'flex'},a11yProps,metaAttribute({name:MetaConstants.Indicator,testID:testID}),getStyledProps(styledProps),{children:jsxs(BaseBox,{display:"flex",flexDirection:"row",alignItems:"center",children:[jsx(Svg,{width:String(svgSize),height:String(svgSize),viewBox:"0 0 10 10",fill:"none",children:isIntense?jsxs(Fragment,{children:[jsx(Circle,{cx:"5",cy:"5",r:"5",fill:fillColorOuter}),jsx(Circle,{cx:"5",cy:"5",r:"2.5",fill:fillColorInner})]}):jsx(Circle,{cx:"5",cy:"5",r:"5",fill:fillColorInner})}),jsx(BaseBox,{marginLeft:"spacing.2",children:jsx(Text,{weight:"medium",color:"surface.text.gray.subtle",textAlign:"left",size:textSizeMapping[size],children:children})})]})}));};
29
29
 
30
30
  export { Indicator };
31
31
  //# sourceMappingURL=Indicator.js.map