@razorpay/blade 10.23.5 → 11.0.0

package/build/lib/native/components/Radio/Radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.js","sources":["../../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-shadow */\nimport React from 'react';\nimport type { OnChange } from './useRadio';\nimport { useRadio } from './useRadio';\nimport { RadioIcon } from './RadioIcon/RadioIcon';\nimport { useRadioGroupContext } from './RadioGroup/RadioContext';\nimport { radioHoverTokens } from './radioTokens';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorTitle } from '~components/Form/Selector/SelectorTitle';\nimport { SelectorSupportText } from '~components/Form/Selector/SelectorSupportText';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { BladeElementRef, StringChildrenType, TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getPlatformType } from '~utils';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { throwBladeError } from '~utils/logger';\n\ntype RadioProps = {\n  /**\n   * Sets the label text of the Radio\n   */\n  children?: StringChildrenType;\n  /**\n   * Help text for the Radio\n   */\n  helpText?: string;\n  /**\n   * The value to be used in the Radio input.\n   * This is the value that will be returned on form submission.\n   */\n  value: string;\n  /**\n   * If `true`, the Radio will be disabled\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Size of the radios\n   *\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium';\n} & TestID &\n  StyledPropsBlade;\n\nconst _Radio: React.ForwardRefRenderFunction<BladeElementRef, RadioProps> = (\n  { value, children, helpText, isDisabled, size = 'medium', testID, ...styledProps },\n  ref,\n) => {\n  const groupProps = useRadioGroupContext();\n  const isInsideGroup = !isEmpty(groupProps);\n\n  if (__DEV__) {\n    if (!isInsideGroup) {\n      throwBladeError({\n        moduleName: 'Radio',\n        message: 'Cannot use <Radio /> outside of <RadioGroup />',\n      });\n    }\n  }\n\n  const isChecked = groupProps?.state?.isChecked(value);\n  const defaultChecked =\n    groupProps?.defaultValue === undefined ? undefined : groupProps?.defaultValue === value;\n  const validationState = groupProps?.validationState;\n  const hasError = validationState === 'error';\n  const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n  const _isRequired = groupProps?.isRequired || groupProps?.necessityIndicator === 'required';\n  const name = groupProps?.name;\n  const showHelpText = !hasError && helpText;\n  const isReactNative = getPlatformType() === 'react-native';\n  const _size = groupProps.size ?? size;\n  const isSmall = _size === 'small';\n\n  const handleChange: OnChange = ({ isChecked, value }) => {\n    if (isChecked) {\n      groupProps?.state?.setValue(value!);\n    } else {\n      groupProps?.state?.removeValue();\n    }\n  };\n\n  const { state, ids, inputProps } = useRadio({\n    defaultChecked,\n    isChecked,\n    hasError,\n    isDisabled: _isDisabled,\n    isRequired: _isRequired,\n    name,\n    value,\n    onChange: handleChange,\n  });\n\n  return (\n    <BaseBox {...getStyledProps(styledProps)}>\n      <SelectorLabel\n        componentName={MetaConstants.RadioLabel}\n        inputProps={isReactNative ? inputProps : {}}\n        testID={testID}\n      >\n        <BaseBox display=\"flex\" flexDirection=\"column\">\n          <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n            <SelectorInput\n              hoverTokens={radioHoverTokens}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              hasError={hasError}\n              inputProps={inputProps}\n              ref={ref}\n            />\n            <RadioIcon\n              size={_size}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              isNegative={hasError}\n            />\n            {children ? (\n              <SelectorTitle size={_size} isDisabled={_isDisabled}>\n                {children}\n              </SelectorTitle>\n            ) : null}\n          </BaseBox>\n          {showHelpText && (\n            <BaseBox marginLeft={isSmall ? 'spacing.6' : 'spacing.7'}>\n              <SelectorSupportText id={ids?.helpTextId}>{helpText}</SelectorSupportText>\n            </BaseBox>\n          )}\n        </BaseBox>\n      </SelectorLabel>\n    </BaseBox>\n  );\n};\n\nconst Radio = assignWithoutSideEffects(React.forwardRef(_Radio), { displayName: 'Radio' });\n\nexport type { RadioProps };\nexport { Radio };\n"],"names":["_Radio","_ref","ref","_groupProps$state","_groupProps$size","value","children","helpText","isDisabled","_ref$size","size","testID","styledProps","_objectWithoutProperties","_excluded","groupProps","useRadioGroupContext","isInsideGroup","isEmpty","__DEV__","throwBladeError","moduleName","message","isChecked","state","defaultChecked","defaultValue","undefined","validationState","hasError","_isDisabled","_isRequired","isRequired","necessityIndicator","name","showHelpText","isReactNative","getPlatformType","_size","isSmall","handleChange","_ref2","_groupProps$state2","setValue","_groupProps$state3","removeValue","_useRadio","useRadio","onChange","ids","inputProps","_jsx","BaseBox","Object","assign","getStyledProps","SelectorLabel","componentName","MetaConstants","RadioLabel","_jsxs","display","flexDirection","alignItems","SelectorInput","hoverTokens","radioHoverTokens","RadioIcon","isNegative","SelectorTitle","marginLeft","SelectorSupportText","id","helpTextId","Radio","assignWithoutSideEffects","React","forwardRef","displayName"],"mappings":"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"}
+{"version":3,"file":"Radio.js","sources":["../../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-shadow */\nimport React from 'react';\nimport type { OnChange } from './useRadio';\nimport { useRadio } from './useRadio';\nimport { RadioIcon } from './RadioIcon/RadioIcon';\nimport { useRadioGroupContext } from './RadioGroup/RadioContext';\nimport { radioHoverTokens } from './radioTokens';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorTitle } from '~components/Form/Selector/SelectorTitle';\nimport { SelectorSupportText } from '~components/Form/Selector/SelectorSupportText';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { BladeElementRef, StringChildrenType, TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getPlatformType } from '~utils';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { throwBladeError } from '~utils/logger';\n\ntype RadioProps = {\n  /**\n   * Sets the label text of the Radio\n   */\n  children?: StringChildrenType;\n  /**\n   * Help text for the Radio\n   */\n  helpText?: string;\n  /**\n   * The value to be used in the Radio input.\n   * This is the value that will be returned on form submission.\n   */\n  value: string;\n  /**\n   * If `true`, the Radio will be disabled\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Size of the radios\n   *\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium';\n} & TestID &\n  StyledPropsBlade;\n\nconst _Radio: React.ForwardRefRenderFunction<BladeElementRef, RadioProps> = (\n  { value, children, helpText, isDisabled, size = 'medium', testID, ...styledProps },\n  ref,\n) => {\n  const groupProps = useRadioGroupContext();\n  const isInsideGroup = !isEmpty(groupProps);\n\n  if (__DEV__) {\n    if (!isInsideGroup) {\n      throwBladeError({\n        moduleName: 'Radio',\n        message: 'Cannot use <Radio /> outside of <RadioGroup />',\n      });\n    }\n  }\n\n  const isChecked = groupProps?.state?.isChecked(value);\n  const defaultChecked =\n    groupProps?.defaultValue === undefined ? undefined : groupProps?.defaultValue === value;\n  const validationState = groupProps?.validationState;\n  const hasError = validationState === 'error';\n  const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n  const _isRequired = groupProps?.isRequired || groupProps?.necessityIndicator === 'required';\n  const name = groupProps?.name;\n  const showHelpText = !hasError && helpText;\n  const isReactNative = getPlatformType() === 'react-native';\n  const _size = groupProps.size ?? size;\n  const isSmall = _size === 'small';\n\n  const handleChange: OnChange = ({ isChecked, value }) => {\n    if (isChecked) {\n      groupProps?.state?.setValue(value!);\n    } else {\n      groupProps?.state?.removeValue();\n    }\n  };\n\n  const { state, ids, inputProps } = useRadio({\n    defaultChecked,\n    isChecked,\n    hasError,\n    isDisabled: _isDisabled,\n    isRequired: _isRequired,\n    name,\n    value,\n    onChange: handleChange,\n  });\n\n  return (\n    <BaseBox {...getStyledProps(styledProps)}>\n      <SelectorLabel\n        componentName={MetaConstants.RadioLabel}\n        inputProps={isReactNative ? inputProps : {}}\n        testID={testID}\n      >\n        <BaseBox display=\"flex\" flexDirection=\"column\">\n          <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n            <SelectorInput\n              hoverTokens={radioHoverTokens}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              hasError={hasError}\n              inputProps={inputProps}\n              ref={ref}\n            />\n            <RadioIcon\n              size={_size}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              isNegative={hasError}\n            />\n            {children ? (\n              <SelectorTitle size={_size} isDisabled={_isDisabled}>\n                {children}\n              </SelectorTitle>\n            ) : null}\n          </BaseBox>\n          {showHelpText && (\n            <BaseBox marginLeft={isSmall ? 'spacing.6' : 'spacing.7'}>\n              <SelectorSupportText isNegative={true} id={ids?.helpTextId}>\n                {helpText}\n              </SelectorSupportText>\n            </BaseBox>\n          )}\n        </BaseBox>\n      </SelectorLabel>\n    </BaseBox>\n  );\n};\n\nconst Radio = assignWithoutSideEffects(React.forwardRef(_Radio), { displayName: 'Radio' });\n\nexport type { RadioProps };\nexport { Radio };\n"],"names":["_Radio","_ref","ref","_groupProps$state","_groupProps$size","value","children","helpText","isDisabled","_ref$size","size","testID","styledProps","_objectWithoutProperties","_excluded","groupProps","useRadioGroupContext","isInsideGroup","isEmpty","__DEV__","throwBladeError","moduleName","message","isChecked","state","defaultChecked","defaultValue","undefined","validationState","hasError","_isDisabled","_isRequired","isRequired","necessityIndicator","name","showHelpText","isReactNative","getPlatformType","_size","isSmall","handleChange","_ref2","_groupProps$state2","setValue","_groupProps$state3","removeValue","_useRadio","useRadio","onChange","ids","inputProps","_jsx","BaseBox","Object","assign","getStyledProps","SelectorLabel","componentName","MetaConstants","RadioLabel","_jsxs","display","flexDirection","alignItems","SelectorInput","hoverTokens","radioHoverTokens","RadioIcon","isNegative","SelectorTitle","marginLeft","SelectorSupportText","id","helpTextId","Radio","assignWithoutSideEffects","React","forwardRef","displayName"],"mappings":"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"}

package/build/lib/native/components/Radio/RadioIcon/RadioIcon.js

@@ -17,7 +17,7 @@ import { metaAttribute } from '../../../utils/metaAttribute/metaAttribute.native
 import Circle from '../../Icons/_Svg/Circle/Circle.native.js';
 import Svg from '../../Icons/_Svg/Svg/Svg.native.js';
 
-var CheckedIcon=function CheckedIcon(_ref){var color=_ref.color,size=_ref.size;var width=radioSizes.icon[size].width;var height=radioSizes.icon[size].height;var radius=radioSizes.icon[size].dotRadius;var viewBox=`0 0 ${width} ${height}`;var cx=`${width/2}`;var cy=`${height/2}`;return jsx(Svg,{width:makeSpace(width),height:makeSpace(height),viewBox:viewBox,fill:"none",children:jsx(Circle,{cx:cx,cy:cy,r:`${radius}`,fill:color})});};var RadioIcon=function RadioIcon(_ref2){var isChecked=_ref2.isChecked,isDisabled=_ref2.isDisabled,isNegative=_ref2.isNegative,size=_ref2.size;var _useTheme=useTheme(),theme=_useTheme.theme;var checked=Boolean(isChecked);var state=checked?'checked':'unchecked';var variant='default';if(isDisabled)variant='disabled';if(isNegative)variant='negative';var dotColor=getIn(theme,radioIconColors.variants[variant].dot[state]);return jsx(RadioIconWrapper,Object.assign({size:size,isDisabled:isDisabled,isNegative:isNegative,isChecked:checked},metaAttribute({name:'radio-icon-wrapper'}),{children:jsx(Fade,{show:checked,styles:{position:'absolute',display:'flex'},children:jsx(CheckedIcon,{size:size,color:dotColor})})}));};
+var CheckedIcon=function CheckedIcon(_ref){var color=_ref.color,size=_ref.size;var width=radioSizes.icon[size].width;var height=radioSizes.icon[size].height;var radius=radioSizes.icon[size].dotRadius;var viewBox=`0 0 ${width} ${height}`;var cx=`${width/2}`;var cy=`${height/2}`;return jsx(Svg,{width:makeSpace(width),height:makeSpace(height),viewBox:viewBox,fill:"none",children:jsx(Circle,{cx:cx,cy:cy,r:`${radius}`,fill:color})});};var RadioIcon=function RadioIcon(_ref2){var isChecked=_ref2.isChecked,isDisabled=_ref2.isDisabled,isNegative=_ref2.isNegative,size=_ref2.size;var _useTheme=useTheme(),theme=_useTheme.theme;var checked=Boolean(isChecked);var state=checked?'checked':'unchecked';var variant='default';if(isDisabled)variant='disabled';if(isNegative)variant='negative';var dotColorToken=radioIconColors.variants[variant].dot[state];var dotColor=getIn(theme,dotColorToken);return jsx(RadioIconWrapper,Object.assign({size:size,isDisabled:isDisabled,isNegative:isNegative,isChecked:checked},metaAttribute({name:'radio-icon-wrapper'}),{children:jsx(Fade,{show:checked,styles:{position:'absolute',display:'flex'},children:jsx(CheckedIcon,{size:size,color:dotColor})})}));};
 
 export { RadioIcon };
 //# sourceMappingURL=RadioIcon.js.map

package/build/lib/native/components/Radio/RadioIcon/RadioIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioIcon.js","sources":["../../../../../../src/components/Radio/RadioIcon/RadioIcon.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable @typescript-eslint/explicit-module-boundary-types */\nimport React from 'react';\nimport { radioIconColors, radioSizes } from '../radioTokens';\nimport type { RadioProps } from '../Radio';\nimport { RadioIconWrapper } from './RadioIconWrapper';\nimport { Fade } from './Fade';\nimport getIn from '~utils/lodashButBetter/get';\nimport { useTheme } from '~components/BladeProvider';\nimport Svg from '~components/Icons/_Svg';\nimport Circle from '~components/Icons/_Svg/Circle';\nimport { makeSpace } from '~utils/makeSpace';\nimport { metaAttribute } from '~utils/metaAttribute';\n\nexport type RadioIconProps = {\n  isDisabled?: boolean;\n  isNegative?: boolean;\n  isChecked?: boolean;\n} & Required<Pick<RadioProps, 'size'>>;\n\nconst CheckedIcon = ({ color, size }: { color: string; size: RadioIconProps['size'] }) => {\n  const width = radioSizes.icon[size].width;\n  const height = radioSizes.icon[size].height;\n  const radius = radioSizes.icon[size].dotRadius;\n  const viewBox = `0 0 ${width} ${height}`;\n  const cx = `${width / 2}`;\n  const cy = `${height / 2}`;\n\n  return (\n    <Svg width={makeSpace(width)} height={makeSpace(height)} viewBox={viewBox} fill=\"none\">\n      <Circle cx={cx} cy={cy} r={`${radius}`} fill={color} />\n    </Svg>\n  );\n};\n\nconst RadioIcon = ({ isChecked, isDisabled, isNegative, size }: RadioIconProps) => {\n  const { theme } = useTheme();\n\n  const checked = Boolean(isChecked);\n  const state = checked ? 'checked' : 'unchecked';\n  let variant: 'default' | 'disabled' | 'negative' = 'default';\n  if (isDisabled) variant = 'disabled';\n  if (isNegative) variant = 'negative';\n  const dotColor = getIn(theme, radioIconColors.variants[variant].dot[state]);\n\n  return (\n    <RadioIconWrapper\n      size={size}\n      isDisabled={isDisabled}\n      isNegative={isNegative}\n      isChecked={checked}\n      {...metaAttribute({ name: 'radio-icon-wrapper' })}\n    >\n      <Fade show={checked} styles={{ position: 'absolute', display: 'flex' }}>\n        <CheckedIcon size={size} color={dotColor} />\n      </Fade>\n    </RadioIconWrapper>\n  );\n};\n\nexport { RadioIcon };\n"],"names":["CheckedIcon","_ref","color","size","width","radioSizes","icon","height","radius","dotRadius","viewBox","cx","cy","_jsx","Svg","makeSpace","fill","children","Circle","r","RadioIcon","_ref2","isChecked","isDisabled","isNegative","_useTheme","useTheme","theme","checked","Boolean","state","variant","dotColor","getIn","radioIconColors","variants","dot","RadioIconWrapper","Object","assign","metaAttribute","name","Fade","show","styles","position","display"],"mappings":";;;;;;;;;;;;;;;;;;;AAoBA,IAAMA,WAAW,CAAG,SAAdA,WAAWA,CAAAC,IAAA,CAAyE,KAAnEC,KAAK,CAAAD,IAAA,CAALC,KAAK,CAAEC,IAAI,CAAAF,IAAA,CAAJE,IAAI,CAChC,IAAMC,KAAK,CAAGC,UAAU,CAACC,IAAI,CAACH,IAAI,CAAC,CAACC,KAAK,CACzC,IAAMG,MAAM,CAAGF,UAAU,CAACC,IAAI,CAACH,IAAI,CAAC,CAACI,MAAM,CAC3C,IAAMC,MAAM,CAAGH,UAAU,CAACC,IAAI,CAACH,IAAI,CAAC,CAACM,SAAS,CAC9C,IAAMC,OAAO,CAAI,OAAMN,KAAM,CAAA,CAAA,EAAGG,MAAO,CAAC,CAAA,CACxC,IAAMI,EAAE,CAAI,CAAEP,EAAAA,KAAK,CAAG,CAAE,CAAA,CAAC,CACzB,IAAMQ,EAAE,CAAI,CAAA,EAAEL,MAAM,CAAG,CAAE,EAAC,CAE1B,OACEM,GAAA,CAACC,GAAG,CAACV,CAAAA,KAAK,CAAEW,SAAS,CAACX,KAAK,CAAE,CAACG,MAAM,CAAEQ,SAAS,CAACR,MAAM,CAAE,CAACG,OAAO,CAAEA,OAAQ,CAACM,IAAI,CAAC,MAAM,CAAAC,QAAA,CACpFJ,GAAA,CAACK,MAAM,CAAA,CAACP,EAAE,CAAEA,EAAG,CAACC,EAAE,CAAEA,EAAG,CAACO,CAAC,CAAG,CAAEX,EAAAA,MAAO,EAAE,CAACQ,IAAI,CAAEd,KAAM,CAAE,CAAC,CACpD,CAAC,CAEV,CAAC,CAEK,IAAAkB,SAAS,CAAG,SAAZA,SAASA,CAAAC,KAAA,CAAoE,KAA9DC,SAAS,CAAAD,KAAA,CAATC,SAAS,CAAEC,UAAU,CAAAF,KAAA,CAAVE,UAAU,CAAEC,UAAU,CAAAH,KAAA,CAAVG,UAAU,CAAErB,IAAI,CAAAkB,KAAA,CAAJlB,IAAI,CAC1D,IAAAsB,SAAA,CAAkBC,QAAQ,EAAE,CAApBC,KAAK,CAAAF,SAAA,CAALE,KAAK,CAEb,IAAMC,OAAO,CAAGC,OAAO,CAACP,SAAS,CAAC,CAClC,IAAMQ,KAAK,CAAGF,OAAO,CAAG,SAAS,CAAG,WAAW,CAC/C,IAAIG,OAA4C,CAAG,SAAS,CAC5D,GAAIR,UAAU,CAAEQ,OAAO,CAAG,UAAU,CACpC,GAAIP,UAAU,CAAEO,OAAO,CAAG,UAAU,CACpC,IAAMC,QAAQ,CAAGC,KAAK,CAACN,KAAK,CAAEO,eAAe,CAACC,QAAQ,CAACJ,OAAO,CAAC,CAACK,GAAG,CAACN,KAAK,CAAC,CAAC,CAE3E,OACEjB,GAAA,CAACwB,gBAAgB,CAAAC,MAAA,CAAAC,MAAA,EACfpC,IAAI,CAAEA,IAAK,CACXoB,UAAU,CAAEA,UAAW,CACvBC,UAAU,CAAEA,UAAW,CACvBF,SAAS,CAAEM,OAAQ,CACfY,CAAAA,aAAa,CAAC,CAAEC,IAAI,CAAE,oBAAqB,CAAC,CAAC,CAAAxB,CAAAA,QAAA,CAEjDJ,GAAA,CAAC6B,IAAI,CAACC,CAAAA,IAAI,CAAEf,OAAQ,CAACgB,MAAM,CAAE,CAAEC,QAAQ,CAAE,UAAU,CAAEC,OAAO,CAAE,MAAO,CAAE,CAAA7B,QAAA,CACrEJ,GAAA,CAACb,WAAW,CAAA,CAACG,IAAI,CAAEA,IAAK,CAACD,KAAK,CAAE8B,QAAS,CAAE,CAAC,CACxC,CAAC,CAAA,CACS,CAAC,CAEvB;;;;"}
+{"version":3,"file":"RadioIcon.js","sources":["../../../../../../src/components/Radio/RadioIcon/RadioIcon.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable @typescript-eslint/explicit-module-boundary-types */\nimport React from 'react';\nimport { radioIconColors, radioSizes } from '../radioTokens';\nimport type { RadioProps } from '../Radio';\nimport { RadioIconWrapper } from './RadioIconWrapper';\nimport { Fade } from './Fade';\nimport getIn from '~utils/lodashButBetter/get';\nimport { useTheme } from '~components/BladeProvider';\nimport Svg from '~components/Icons/_Svg';\nimport Circle from '~components/Icons/_Svg/Circle';\nimport { makeSpace } from '~utils/makeSpace';\nimport { metaAttribute } from '~utils/metaAttribute';\n\nexport type RadioIconProps = {\n  isDisabled?: boolean;\n  isNegative?: boolean;\n  isChecked?: boolean;\n} & Required<Pick<RadioProps, 'size'>>;\n\nconst CheckedIcon = ({ color, size }: { color: string; size: RadioIconProps['size'] }) => {\n  const width = radioSizes.icon[size].width;\n  const height = radioSizes.icon[size].height;\n  const radius = radioSizes.icon[size].dotRadius;\n  const viewBox = `0 0 ${width} ${height}`;\n  const cx = `${width / 2}`;\n  const cy = `${height / 2}`;\n\n  return (\n    <Svg width={makeSpace(width)} height={makeSpace(height)} viewBox={viewBox} fill=\"none\">\n      <Circle cx={cx} cy={cy} r={`${radius}`} fill={color} />\n    </Svg>\n  );\n};\n\nconst RadioIcon = ({ isChecked, isDisabled, isNegative, size }: RadioIconProps) => {\n  const { theme } = useTheme();\n\n  const checked = Boolean(isChecked);\n  const state = checked ? 'checked' : 'unchecked';\n  let variant: 'default' | 'disabled' | 'negative' = 'default';\n  if (isDisabled) variant = 'disabled';\n  if (isNegative) variant = 'negative';\n  const dotColorToken = radioIconColors.variants[variant].dot[state];\n  const dotColor = getIn(theme, dotColorToken);\n\n  return (\n    <RadioIconWrapper\n      size={size}\n      isDisabled={isDisabled}\n      isNegative={isNegative}\n      isChecked={checked}\n      {...metaAttribute({ name: 'radio-icon-wrapper' })}\n    >\n      <Fade show={checked} styles={{ position: 'absolute', display: 'flex' }}>\n        <CheckedIcon size={size} color={dotColor} />\n      </Fade>\n    </RadioIconWrapper>\n  );\n};\n\nexport { RadioIcon };\n"],"names":["CheckedIcon","_ref","color","size","width","radioSizes","icon","height","radius","dotRadius","viewBox","cx","cy","_jsx","Svg","makeSpace","fill","children","Circle","r","RadioIcon","_ref2","isChecked","isDisabled","isNegative","_useTheme","useTheme","theme","checked","Boolean","state","variant","dotColorToken","radioIconColors","variants","dot","dotColor","getIn","RadioIconWrapper","Object","assign","metaAttribute","name","Fade","show","styles","position","display"],"mappings":";;;;;;;;;;;;;;;;;;;AAoBA,IAAMA,WAAW,CAAG,SAAdA,WAAWA,CAAAC,IAAA,CAAyE,CAAA,IAAnEC,KAAK,CAAAD,IAAA,CAALC,KAAK,CAAEC,IAAI,CAAAF,IAAA,CAAJE,IAAI,CAChC,IAAMC,KAAK,CAAGC,UAAU,CAACC,IAAI,CAACH,IAAI,CAAC,CAACC,KAAK,CACzC,IAAMG,MAAM,CAAGF,UAAU,CAACC,IAAI,CAACH,IAAI,CAAC,CAACI,MAAM,CAC3C,IAAMC,MAAM,CAAGH,UAAU,CAACC,IAAI,CAACH,IAAI,CAAC,CAACM,SAAS,CAC9C,IAAMC,OAAO,CAAI,CAAMN,IAAAA,EAAAA,KAAM,IAAGG,MAAO,CAAA,CAAC,CACxC,IAAMI,EAAE,CAAI,CAAA,EAAEP,KAAK,CAAG,CAAE,EAAC,CACzB,IAAMQ,EAAE,CAAI,GAAEL,MAAM,CAAG,CAAE,CAAC,CAAA,CAE1B,OACEM,GAAA,CAACC,GAAG,CAAA,CAACV,KAAK,CAAEW,SAAS,CAACX,KAAK,CAAE,CAACG,MAAM,CAAEQ,SAAS,CAACR,MAAM,CAAE,CAACG,OAAO,CAAEA,OAAQ,CAACM,IAAI,CAAC,MAAM,CAAAC,QAAA,CACpFJ,GAAA,CAACK,MAAM,CAAA,CAACP,EAAE,CAAEA,EAAG,CAACC,EAAE,CAAEA,EAAG,CAACO,CAAC,CAAG,CAAEX,EAAAA,MAAO,EAAE,CAACQ,IAAI,CAAEd,KAAM,CAAE,CAAC,CACpD,CAAC,CAEV,CAAC,CAEK,IAAAkB,SAAS,CAAG,SAAZA,SAASA,CAAAC,KAAA,CAAoE,KAA9DC,SAAS,CAAAD,KAAA,CAATC,SAAS,CAAEC,UAAU,CAAAF,KAAA,CAAVE,UAAU,CAAEC,UAAU,CAAAH,KAAA,CAAVG,UAAU,CAAErB,IAAI,CAAAkB,KAAA,CAAJlB,IAAI,CAC1D,IAAAsB,SAAA,CAAkBC,QAAQ,EAAE,CAApBC,KAAK,CAAAF,SAAA,CAALE,KAAK,CAEb,IAAMC,OAAO,CAAGC,OAAO,CAACP,SAAS,CAAC,CAClC,IAAMQ,KAAK,CAAGF,OAAO,CAAG,SAAS,CAAG,WAAW,CAC/C,IAAIG,OAA4C,CAAG,SAAS,CAC5D,GAAIR,UAAU,CAAEQ,OAAO,CAAG,UAAU,CACpC,GAAIP,UAAU,CAAEO,OAAO,CAAG,UAAU,CACpC,IAAMC,aAAa,CAAGC,eAAe,CAACC,QAAQ,CAACH,OAAO,CAAC,CAACI,GAAG,CAACL,KAAK,CAAC,CAClE,IAAMM,QAAQ,CAAGC,KAAK,CAACV,KAAK,CAAEK,aAAa,CAAC,CAE5C,OACEnB,GAAA,CAACyB,gBAAgB,CAAAC,MAAA,CAAAC,MAAA,CACfrC,CAAAA,IAAI,CAAEA,IAAK,CACXoB,UAAU,CAAEA,UAAW,CACvBC,UAAU,CAAEA,UAAW,CACvBF,SAAS,CAAEM,OAAQ,CAAA,CACfa,aAAa,CAAC,CAAEC,IAAI,CAAE,oBAAqB,CAAC,CAAC,CAAAzB,CAAAA,QAAA,CAEjDJ,GAAA,CAAC8B,IAAI,CAACC,CAAAA,IAAI,CAAEhB,OAAQ,CAACiB,MAAM,CAAE,CAAEC,QAAQ,CAAE,UAAU,CAAEC,OAAO,CAAE,MAAO,CAAE,CAAA9B,QAAA,CACrEJ,GAAA,CAACb,WAAW,CAAA,CAACG,IAAI,CAAEA,IAAK,CAACD,KAAK,CAAEkC,QAAS,CAAE,CAAC,CACxC,CAAC,CAAA,CACS,CAAC,CAEvB;;;;"}

package/build/lib/native/components/Radio/RadioIcon/RadioIconWrapperStyles.js

@@ -11,7 +11,7 @@ import { makeSpace } from '../../../utils/makeSpace/makeSpace.js';
 import { makeSize } from '../../../utils/makeSize/makeSize.js';
 import '../../BladeProvider/useTheme.js';
 
-var getRadioIconWrapperStyles=function getRadioIconWrapperStyles(_ref){var theme=_ref.theme,isChecked=_ref.isChecked,isDisabled=_ref.isDisabled,isNegative=_ref.isNegative,size=_ref.size;var isReactNative=getPlatformType()==='react-native';var variant='default';if(isDisabled)variant='disabled';if(isNegative)variant='negative';var checked=isChecked?'checked':'unchecked';var background=radioIconColors.variants[variant].background[checked];var border=radioIconColors.variants[variant].border[checked];var backgroundColor=background==='transparent'?background:getIn(theme,background);var borderColor=border==='transparent'?border:getIn(theme,border);return Object.assign({position:'relative',display:'flex',alignItems:'center',justifyContent:'center',width:makeSpace(radioSizes.icon[size].width),height:makeSpace(radioSizes.icon[size].height),borderWidth:makeBorderSize(theme.border.width.thick),borderStyle:'solid',margin:makeSpace(theme.spacing[1]),borderRadius:makeSize(theme.border.radius.max),backgroundColor:backgroundColor,borderColor:borderColor},!isReactNative&&{transitionDuration:castWebType(makeMotionTime(theme.motion.duration.xquick)),transitionTimingFunction:castWebType(theme.motion.easing.exit.attentive)});};
+var getRadioIconWrapperStyles=function getRadioIconWrapperStyles(_ref){var theme=_ref.theme,isChecked=_ref.isChecked,isDisabled=_ref.isDisabled,isNegative=_ref.isNegative,size=_ref.size;var isReactNative=getPlatformType()==='react-native';var variant='default';if(isDisabled)variant='disabled';if(isNegative)variant='negative';var checked=isChecked?'checked':'unchecked';var background=radioIconColors.variants[variant].background[checked];var border=radioIconColors.variants[variant].border[checked];var backgroundColor=getIn(theme,background);var borderColor=getIn(theme,border);return Object.assign({position:'relative',display:'flex',alignItems:'center',justifyContent:'center',width:makeSpace(radioSizes.icon[size].width),height:makeSpace(radioSizes.icon[size].height),borderWidth:makeBorderSize(theme.border.width.thick),borderStyle:'solid',margin:makeSpace(theme.spacing[1]),borderRadius:makeSize(theme.border.radius.max),backgroundColor:backgroundColor,borderColor:borderColor},!isReactNative&&{transitionDuration:castWebType(makeMotionTime(theme.motion.duration.xquick)),transitionTimingFunction:castWebType(theme.motion.easing.exit.attentive)});};
 
 export { getRadioIconWrapperStyles };
 //# sourceMappingURL=RadioIconWrapperStyles.js.map

package/build/lib/native/components/Radio/RadioIcon/RadioIconWrapperStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioIconWrapperStyles.js","sources":["../../../../../../src/components/Radio/RadioIcon/RadioIconWrapperStyles.ts"],"sourcesContent":["import type { CSSObject } from 'styled-components';\nimport { radioIconColors, radioSizes } from '../radioTokens';\nimport type { RadioIconProps } from './RadioIcon';\nimport getIn from '~utils/lodashButBetter/get';\nimport type { Theme } from '~components/BladeProvider';\nimport { castWebType, getPlatformType } from '~utils';\nimport { makeSpace } from '~utils/makeSpace';\nimport { makeSize } from '~utils/makeSize';\nimport { makeBorderSize } from '~utils/makeBorderSize';\nimport { makeMotionTime } from '~utils/makeMotionTime';\n\nexport type RadioRectProps = RadioIconProps;\n\nconst getRadioIconWrapperStyles = ({\n  theme,\n  isChecked,\n  isDisabled,\n  isNegative,\n  size,\n}: RadioRectProps & { theme: Theme }): CSSObject => {\n  const isReactNative = getPlatformType() === 'react-native';\n  let variant: 'default' | 'disabled' | 'negative' = 'default';\n  if (isDisabled) variant = 'disabled';\n  if (isNegative) variant = 'negative';\n  const checked = isChecked ? 'checked' : 'unchecked';\n  const background = radioIconColors.variants[variant].background[checked];\n  const border = radioIconColors.variants[variant].border[checked];\n  const backgroundColor = background === 'transparent' ? background : getIn(theme, background);\n  const borderColor = border === 'transparent' ? border : getIn(theme, border);\n\n  return {\n    position: 'relative',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: makeSpace(radioSizes.icon[size].width),\n    height: makeSpace(radioSizes.icon[size].height),\n    borderWidth: makeBorderSize(theme.border.width.thick),\n    borderStyle: 'solid',\n    margin: makeSpace(theme.spacing[1]),\n    borderRadius: makeSize(theme.border.radius.max),\n    backgroundColor,\n    borderColor,\n    ...(!isReactNative && {\n      transitionDuration: castWebType(makeMotionTime(theme.motion.duration.xquick)),\n      transitionTimingFunction: castWebType(theme.motion.easing.exit.attentive),\n    }),\n  };\n};\n\nexport { getRadioIconWrapperStyles };\n"],"names":["getRadioIconWrapperStyles","_ref","theme","isChecked","isDisabled","isNegative","size","isReactNative","getPlatformType","variant","checked","background","radioIconColors","variants","border","backgroundColor","getIn","borderColor","Object","assign","position","display","alignItems","justifyContent","width","makeSpace","radioSizes","icon","height","borderWidth","makeBorderSize","thick","borderStyle","margin","spacing","borderRadius","makeSize","radius","max","transitionDuration","castWebType","makeMotionTime","motion","duration","xquick","transitionTimingFunction","easing","exit","attentive"],"mappings":";;;;;;;;;;;;;AAaM,IAAAA,yBAAyB,CAAG,SAA5BA,yBAAyBA,CAAAC,IAAA,CAMqB,CALlD,IAAAC,KAAK,CAAAD,IAAA,CAALC,KAAK,CACLC,SAAS,CAAAF,IAAA,CAATE,SAAS,CACTC,UAAU,CAAAH,IAAA,CAAVG,UAAU,CACVC,UAAU,CAAAJ,IAAA,CAAVI,UAAU,CACVC,IAAI,CAAAL,IAAA,CAAJK,IAAI,CAEJ,IAAMC,aAAa,CAAGC,eAAe,EAAE,GAAK,cAAc,CAC1D,IAAIC,OAA4C,CAAG,SAAS,CAC5D,GAAIL,UAAU,CAAEK,OAAO,CAAG,UAAU,CACpC,GAAIJ,UAAU,CAAEI,OAAO,CAAG,UAAU,CACpC,IAAMC,OAAO,CAAGP,SAAS,CAAG,SAAS,CAAG,WAAW,CACnD,IAAMQ,UAAU,CAAGC,eAAe,CAACC,QAAQ,CAACJ,OAAO,CAAC,CAACE,UAAU,CAACD,OAAO,CAAC,CACxE,IAAMI,MAAM,CAAGF,eAAe,CAACC,QAAQ,CAACJ,OAAO,CAAC,CAACK,MAAM,CAACJ,OAAO,CAAC,CAChE,IAAMK,eAAe,CAAGJ,UAAU,GAAK,aAAa,CAAGA,UAAU,CAAGK,KAAK,CAACd,KAAK,CAAES,UAAU,CAAC,CAC5F,IAAMM,WAAW,CAAGH,MAAM,GAAK,aAAa,CAAGA,MAAM,CAAGE,KAAK,CAACd,KAAK,CAAEY,MAAM,CAAC,CAE5E,OAAAI,MAAA,CAAAC,MAAA,CACEC,CAAAA,QAAQ,CAAE,UAAU,CACpBC,OAAO,CAAE,MAAM,CACfC,UAAU,CAAE,QAAQ,CACpBC,cAAc,CAAE,QAAQ,CACxBC,KAAK,CAAEC,SAAS,CAACC,UAAU,CAACC,IAAI,CAACrB,IAAI,CAAC,CAACkB,KAAK,CAAC,CAC7CI,MAAM,CAAEH,SAAS,CAACC,UAAU,CAACC,IAAI,CAACrB,IAAI,CAAC,CAACsB,MAAM,CAAC,CAC/CC,WAAW,CAAEC,cAAc,CAAC5B,KAAK,CAACY,MAAM,CAACU,KAAK,CAACO,KAAK,CAAC,CACrDC,WAAW,CAAE,OAAO,CACpBC,MAAM,CAAER,SAAS,CAACvB,KAAK,CAACgC,OAAO,CAAC,CAAC,CAAC,CAAC,CACnCC,YAAY,CAAEC,QAAQ,CAAClC,KAAK,CAACY,MAAM,CAACuB,MAAM,CAACC,GAAG,CAAC,CAC/CvB,eAAe,CAAfA,eAAe,CACfE,WAAW,CAAXA,WAAW,CACP,CAAA,CAACV,aAAa,EAAI,CACpBgC,kBAAkB,CAAEC,WAAW,CAACC,cAAc,CAACvC,KAAK,CAACwC,MAAM,CAACC,QAAQ,CAACC,MAAM,CAAC,CAAC,CAC7EC,wBAAwB,CAAEL,WAAW,CAACtC,KAAK,CAACwC,MAAM,CAACI,MAAM,CAACC,IAAI,CAACC,SAAS,CAC1E,CAAC,CAAA,CAEL;;;;"}
+{"version":3,"file":"RadioIconWrapperStyles.js","sources":["../../../../../../src/components/Radio/RadioIcon/RadioIconWrapperStyles.ts"],"sourcesContent":["import type { CSSObject } from 'styled-components';\nimport { radioIconColors, radioSizes } from '../radioTokens';\nimport type { RadioIconProps } from './RadioIcon';\nimport getIn from '~utils/lodashButBetter/get';\nimport type { Theme } from '~components/BladeProvider';\nimport { castWebType, getPlatformType } from '~utils';\nimport { makeSpace } from '~utils/makeSpace';\nimport { makeSize } from '~utils/makeSize';\nimport { makeBorderSize } from '~utils/makeBorderSize';\nimport { makeMotionTime } from '~utils/makeMotionTime';\n\nexport type RadioRectProps = RadioIconProps;\n\nconst getRadioIconWrapperStyles = ({\n  theme,\n  isChecked,\n  isDisabled,\n  isNegative,\n  size,\n}: RadioRectProps & { theme: Theme }): CSSObject => {\n  const isReactNative = getPlatformType() === 'react-native';\n  let variant: 'default' | 'disabled' | 'negative' = 'default';\n  if (isDisabled) variant = 'disabled';\n  if (isNegative) variant = 'negative';\n  const checked = isChecked ? 'checked' : 'unchecked';\n  const background = radioIconColors.variants[variant].background[checked];\n  const border = radioIconColors.variants[variant].border[checked];\n  const backgroundColor = getIn(theme, background);\n  const borderColor = getIn(theme, border);\n\n  return {\n    position: 'relative',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: makeSpace(radioSizes.icon[size].width),\n    height: makeSpace(radioSizes.icon[size].height),\n    borderWidth: makeBorderSize(theme.border.width.thick),\n    borderStyle: 'solid',\n    margin: makeSpace(theme.spacing[1]),\n    borderRadius: makeSize(theme.border.radius.max),\n    backgroundColor,\n    borderColor,\n    ...(!isReactNative && {\n      transitionDuration: castWebType(makeMotionTime(theme.motion.duration.xquick)),\n      transitionTimingFunction: castWebType(theme.motion.easing.exit.attentive),\n    }),\n  };\n};\n\nexport { getRadioIconWrapperStyles };\n"],"names":["getRadioIconWrapperStyles","_ref","theme","isChecked","isDisabled","isNegative","size","isReactNative","getPlatformType","variant","checked","background","radioIconColors","variants","border","backgroundColor","getIn","borderColor","Object","assign","position","display","alignItems","justifyContent","width","makeSpace","radioSizes","icon","height","borderWidth","makeBorderSize","thick","borderStyle","margin","spacing","borderRadius","makeSize","radius","max","transitionDuration","castWebType","makeMotionTime","motion","duration","xquick","transitionTimingFunction","easing","exit","attentive"],"mappings":";;;;;;;;;;;;;AAaM,IAAAA,yBAAyB,CAAG,SAA5BA,yBAAyBA,CAAAC,IAAA,CAMqB,CALlD,IAAAC,KAAK,CAAAD,IAAA,CAALC,KAAK,CACLC,SAAS,CAAAF,IAAA,CAATE,SAAS,CACTC,UAAU,CAAAH,IAAA,CAAVG,UAAU,CACVC,UAAU,CAAAJ,IAAA,CAAVI,UAAU,CACVC,IAAI,CAAAL,IAAA,CAAJK,IAAI,CAEJ,IAAMC,aAAa,CAAGC,eAAe,EAAE,GAAK,cAAc,CAC1D,IAAIC,OAA4C,CAAG,SAAS,CAC5D,GAAIL,UAAU,CAAEK,OAAO,CAAG,UAAU,CACpC,GAAIJ,UAAU,CAAEI,OAAO,CAAG,UAAU,CACpC,IAAMC,OAAO,CAAGP,SAAS,CAAG,SAAS,CAAG,WAAW,CACnD,IAAMQ,UAAU,CAAGC,eAAe,CAACC,QAAQ,CAACJ,OAAO,CAAC,CAACE,UAAU,CAACD,OAAO,CAAC,CACxE,IAAMI,MAAM,CAAGF,eAAe,CAACC,QAAQ,CAACJ,OAAO,CAAC,CAACK,MAAM,CAACJ,OAAO,CAAC,CAChE,IAAMK,eAAe,CAAGC,KAAK,CAACd,KAAK,CAAES,UAAU,CAAC,CAChD,IAAMM,WAAW,CAAGD,KAAK,CAACd,KAAK,CAAEY,MAAM,CAAC,CAExC,OAAAI,MAAA,CAAAC,MAAA,EACEC,QAAQ,CAAE,UAAU,CACpBC,OAAO,CAAE,MAAM,CACfC,UAAU,CAAE,QAAQ,CACpBC,cAAc,CAAE,QAAQ,CACxBC,KAAK,CAAEC,SAAS,CAACC,UAAU,CAACC,IAAI,CAACrB,IAAI,CAAC,CAACkB,KAAK,CAAC,CAC7CI,MAAM,CAAEH,SAAS,CAACC,UAAU,CAACC,IAAI,CAACrB,IAAI,CAAC,CAACsB,MAAM,CAAC,CAC/CC,WAAW,CAAEC,cAAc,CAAC5B,KAAK,CAACY,MAAM,CAACU,KAAK,CAACO,KAAK,CAAC,CACrDC,WAAW,CAAE,OAAO,CACpBC,MAAM,CAAER,SAAS,CAACvB,KAAK,CAACgC,OAAO,CAAC,CAAC,CAAC,CAAC,CACnCC,YAAY,CAAEC,QAAQ,CAAClC,KAAK,CAACY,MAAM,CAACuB,MAAM,CAACC,GAAG,CAAC,CAC/CvB,eAAe,CAAfA,eAAe,CACfE,WAAW,CAAXA,WAAW,CAAA,CACP,CAACV,aAAa,EAAI,CACpBgC,kBAAkB,CAAEC,WAAW,CAACC,cAAc,CAACvC,KAAK,CAACwC,MAAM,CAACC,QAAQ,CAACC,MAAM,CAAC,CAAC,CAC7EC,wBAAwB,CAAEL,WAAW,CAACtC,KAAK,CAACwC,MAAM,CAACI,MAAM,CAACC,IAAI,CAACC,SAAS,CAC1E,CAAC,CAAA,CAEL;;;;"}

package/build/lib/native/components/Radio/radioTokens.js

@@ -2,7 +2,7 @@ import '../../tokens/global/typography.js';
 import '../../tokens/global/motion.js';
 import { size } from '../../tokens/global/size.js';
 
-var radioSizes={group:{gap:{small:{mobile:'spacing.2',desktop:'spacing.0'},medium:{mobile:'spacing.3',desktop:'spacing.2'}}},icon:{small:{width:size[12],height:size[12],dotRadius:size[2]},medium:{width:size[16],height:size[16],dotRadius:size[3]}}};var radioIconColors={variants:{default:{dot:{checked:'colors.brand.gray.200.lowContrast',unchecked:'colors.brand.gray.200.lowContrast'},border:{checked:'colors.brand.primary.500',unchecked:'colors.brand.gray.500.lowContrast'},background:{checked:'colors.brand.primary.500',unchecked:'transparent'}},disabled:{dot:{checked:'colors.brand.gray.200.lowContrast',unchecked:'colors.brand.gray.200.lowContrast'},border:{checked:'transparent',unchecked:'colors.brand.gray.a100.lowContrast'},background:{checked:'colors.brand.gray.a100.lowContrast',unchecked:'transparent'}},negative:{dot:{checked:'colors.brand.gray.200.lowContrast',unchecked:'colors.brand.gray.200.lowContrast'},border:{checked:'colors.feedback.border.negative.highContrast',unchecked:'colors.feedback.border.negative.highContrast'},background:{checked:'colors.feedback.background.negative.highContrast',unchecked:'colors.feedback.background.negative.lowContrast'}}}};var radioHoverTokens={default:{background:{checked:'colors.brand.primary.600',unchecked:'colors.brand.gray.a50.lowContrast'},border:{checked:'colors.brand.primary.600',unchecked:'colors.brand.gray.500.lowContrast'}}};
+var radioSizes={group:{gap:{small:{mobile:'spacing.2',desktop:'spacing.0'},medium:{mobile:'spacing.3',desktop:'spacing.2'}}},icon:{small:{width:size[12],height:size[12],dotRadius:size[2]},medium:{width:size[16],height:size[16],dotRadius:size[3]}}};var radioIconColors={variants:{default:{dot:{checked:'colors.interactive.icon.onPrimary.normal',unchecked:'colors.transparent'},border:{checked:'colors.interactive.border.primary.default',unchecked:'colors.interactive.border.gray.default'},background:{checked:'colors.interactive.background.primary.default',unchecked:'colors.transparent'}},disabled:{dot:{checked:'colors.interactive.icon.onPrimary.normal',unchecked:'colors.interactive.icon.onPrimary.normal'},border:{checked:'colors.transparent',unchecked:'colors.interactive.border.gray.disabled'},background:{checked:'colors.interactive.background.primary.disabled',unchecked:'colors.transparent'}},negative:{dot:{checked:'colors.interactive.icon.onPrimary.normal',unchecked:'colors.transparent'},border:{checked:'colors.interactive.border.negative.default',unchecked:'colors.interactive.border.negative.default'},background:{checked:'colors.interactive.background.negative.default',unchecked:'colors.transparent'}}}};var radioHoverTokens={default:{background:{checked:'colors.interactive.background.primary.highlighted',unchecked:'colors.interactive.background.gray.faded'},border:{checked:'colors.interactive.background.primary.highlighted',unchecked:'colors.interactive.border.gray.default'}}};
 
 export { radioHoverTokens, radioIconColors, radioSizes };
 //# sourceMappingURL=radioTokens.js.map

package/build/lib/native/components/Radio/radioTokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"radioTokens.js","sources":["../../../../../src/components/Radio/radioTokens.ts"],"sourcesContent":["import type { Theme } from '~components/BladeProvider';\nimport type { DotNotationColorStringToken } from '~utils/types';\nimport type { SelectorInputHoverTokens } from '~components/Form/Selector/types';\nimport { size } from '~tokens/global';\n\nconst radioSizes = {\n  group: {\n    gap: {\n      small: {\n        mobile: 'spacing.2',\n        desktop: 'spacing.0',\n      },\n      medium: {\n        mobile: 'spacing.3',\n        desktop: 'spacing.2',\n      },\n    },\n  },\n  icon: {\n    small: {\n      width: size[12],\n      height: size[12],\n      dotRadius: size[2],\n    },\n    medium: {\n      width: size[16],\n      height: size[16],\n      dotRadius: size[3],\n    },\n  },\n} as const;\n\ntype ColorTokens = `colors.${DotNotationColorStringToken<Theme['colors']>}` | 'transparent';\ntype Variant = {\n  dot: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n  border: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n  background: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n};\n\ntype RadioIconColors = {\n  variants: {\n    default: Variant;\n    disabled: Variant;\n    negative: Variant;\n  };\n};\n\nconst radioIconColors: RadioIconColors = {\n  variants: {\n    default: {\n      dot: {\n        checked: 'colors.brand.gray.200.lowContrast',\n        unchecked: 'colors.brand.gray.200.lowContrast',\n      },\n      border: {\n        checked: 'colors.brand.primary.500',\n        unchecked: 'colors.brand.gray.500.lowContrast',\n      },\n      background: {\n        checked: 'colors.brand.primary.500',\n        unchecked: 'transparent',\n      },\n    },\n    disabled: {\n      dot: {\n        checked: 'colors.brand.gray.200.lowContrast',\n        unchecked: 'colors.brand.gray.200.lowContrast',\n      },\n      border: {\n        checked: 'transparent',\n        unchecked: 'colors.brand.gray.a100.lowContrast',\n      },\n      background: {\n        checked: 'colors.brand.gray.a100.lowContrast',\n        unchecked: 'transparent',\n      },\n    },\n    negative: {\n      dot: {\n        checked: 'colors.brand.gray.200.lowContrast',\n        unchecked: 'colors.brand.gray.200.lowContrast',\n      },\n      border: {\n        checked: 'colors.feedback.border.negative.highContrast',\n        unchecked: 'colors.feedback.border.negative.highContrast',\n      },\n      background: {\n        checked: 'colors.feedback.background.negative.highContrast',\n        unchecked: 'colors.feedback.background.negative.lowContrast',\n      },\n    },\n  },\n} as const;\n\nconst radioHoverTokens: SelectorInputHoverTokens = {\n  default: {\n    background: {\n      checked: 'colors.brand.primary.600',\n      unchecked: 'colors.brand.gray.a50.lowContrast',\n    },\n    border: {\n      checked: 'colors.brand.primary.600',\n      unchecked: 'colors.brand.gray.500.lowContrast',\n    },\n  },\n};\n\nexport { radioSizes, radioIconColors, radioHoverTokens };\n"],"names":["radioSizes","group","gap","small","mobile","desktop","medium","icon","width","size","height","dotRadius","radioIconColors","variants","default","dot","checked","unchecked","border","background","disabled","negative","radioHoverTokens"],"mappings":";;;;AAKM,IAAAA,UAAU,CAAG,CACjBC,KAAK,CAAE,CACLC,GAAG,CAAE,CACHC,KAAK,CAAE,CACLC,MAAM,CAAE,WAAW,CACnBC,OAAO,CAAE,WACX,CAAC,CACDC,MAAM,CAAE,CACNF,MAAM,CAAE,WAAW,CACnBC,OAAO,CAAE,WACX,CACF,CACF,CAAC,CACDE,IAAI,CAAE,CACJJ,KAAK,CAAE,CACLK,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAED,IAAI,CAAC,EAAE,CAAC,CAChBE,SAAS,CAAEF,IAAI,CAAC,CAAC,CACnB,CAAC,CACDH,MAAM,CAAE,CACNE,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAED,IAAI,CAAC,EAAE,CAAC,CAChBE,SAAS,CAAEF,IAAI,CAAC,CAAC,CACnB,CACF,CACF,EA0BM,IAAAG,eAAgC,CAAG,CACvCC,QAAQ,CAAE,CACRC,OAAO,CAAE,CACPC,GAAG,CAAE,CACHC,OAAO,CAAE,mCAAmC,CAC5CC,SAAS,CAAE,mCACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,0BAA0B,CACnCC,SAAS,CAAE,mCACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,0BAA0B,CACnCC,SAAS,CAAE,aACb,CACF,CAAC,CACDG,QAAQ,CAAE,CACRL,GAAG,CAAE,CACHC,OAAO,CAAE,mCAAmC,CAC5CC,SAAS,CAAE,mCACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,aAAa,CACtBC,SAAS,CAAE,oCACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,oCAAoC,CAC7CC,SAAS,CAAE,aACb,CACF,CAAC,CACDI,QAAQ,CAAE,CACRN,GAAG,CAAE,CACHC,OAAO,CAAE,mCAAmC,CAC5CC,SAAS,CAAE,mCACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,8CAA8C,CACvDC,SAAS,CAAE,8CACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,kDAAkD,CAC3DC,SAAS,CAAE,iDACb,CACF,CACF,CACF,EAEM,IAAAK,gBAA0C,CAAG,CACjDR,OAAO,CAAE,CACPK,UAAU,CAAE,CACVH,OAAO,CAAE,0BAA0B,CACnCC,SAAS,CAAE,mCACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,0BAA0B,CACnCC,SAAS,CAAE,mCACb,CACF,CACF;;;;"}
+{"version":3,"file":"radioTokens.js","sources":["../../../../../src/components/Radio/radioTokens.ts"],"sourcesContent":["import type { Theme } from '~components/BladeProvider';\nimport type { SelectorInputHoverTokens } from '~components/Form/Selector/types';\nimport type { DotNotationToken } from '~utils/lodashButBetter/get';\nimport { size } from '~tokens/global';\n\nconst radioSizes = {\n  group: {\n    gap: {\n      small: {\n        mobile: 'spacing.2',\n        desktop: 'spacing.0',\n      },\n      medium: {\n        mobile: 'spacing.3',\n        desktop: 'spacing.2',\n      },\n    },\n  },\n  icon: {\n    small: {\n      width: size[12],\n      height: size[12],\n      dotRadius: size[2],\n    },\n    medium: {\n      width: size[16],\n      height: size[16],\n      dotRadius: size[3],\n    },\n  },\n} as const;\n\ntype ColorTokens = `colors.${DotNotationToken<Theme['colors']>}`;\ntype Variant = {\n  dot: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n  border: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n  background: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n};\n\ntype RadioIconColors = {\n  variants: {\n    default: Variant;\n    disabled: Variant;\n    negative: Variant;\n  };\n};\n\nconst radioIconColors: RadioIconColors = {\n  variants: {\n    default: {\n      dot: {\n        checked: 'colors.interactive.icon.onPrimary.normal',\n        unchecked: 'colors.transparent',\n      },\n      border: {\n        checked: 'colors.interactive.border.primary.default',\n        unchecked: 'colors.interactive.border.gray.default',\n      },\n      background: {\n        checked: 'colors.interactive.background.primary.default',\n        unchecked: 'colors.transparent',\n      },\n    },\n    disabled: {\n      dot: {\n        checked: 'colors.interactive.icon.onPrimary.normal',\n        unchecked: 'colors.interactive.icon.onPrimary.normal',\n      },\n      border: {\n        checked: 'colors.transparent',\n        unchecked: 'colors.interactive.border.gray.disabled',\n      },\n      background: {\n        checked: 'colors.interactive.background.primary.disabled',\n        unchecked: 'colors.transparent',\n      },\n    },\n    negative: {\n      dot: {\n        checked: 'colors.interactive.icon.onPrimary.normal',\n        unchecked: 'colors.transparent',\n      },\n      border: {\n        checked: 'colors.interactive.border.negative.default',\n        unchecked: 'colors.interactive.border.negative.default',\n      },\n      background: {\n        checked: 'colors.interactive.background.negative.default',\n        unchecked: 'colors.transparent',\n      },\n    },\n  },\n} as const;\n\nconst radioHoverTokens: SelectorInputHoverTokens = {\n  default: {\n    background: {\n      checked: 'colors.interactive.background.primary.highlighted',\n      unchecked: 'colors.interactive.background.gray.faded',\n    },\n    border: {\n      checked: 'colors.interactive.background.primary.highlighted', // Intentionally not using border tokens here since we want to match the background color\n      unchecked: 'colors.interactive.border.gray.default',\n    },\n  },\n};\n\nexport { radioSizes, radioIconColors, radioHoverTokens };\n"],"names":["radioSizes","group","gap","small","mobile","desktop","medium","icon","width","size","height","dotRadius","radioIconColors","variants","default","dot","checked","unchecked","border","background","disabled","negative","radioHoverTokens"],"mappings":";;;;AAKM,IAAAA,UAAU,CAAG,CACjBC,KAAK,CAAE,CACLC,GAAG,CAAE,CACHC,KAAK,CAAE,CACLC,MAAM,CAAE,WAAW,CACnBC,OAAO,CAAE,WACX,CAAC,CACDC,MAAM,CAAE,CACNF,MAAM,CAAE,WAAW,CACnBC,OAAO,CAAE,WACX,CACF,CACF,CAAC,CACDE,IAAI,CAAE,CACJJ,KAAK,CAAE,CACLK,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAED,IAAI,CAAC,EAAE,CAAC,CAChBE,SAAS,CAAEF,IAAI,CAAC,CAAC,CACnB,CAAC,CACDH,MAAM,CAAE,CACNE,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAED,IAAI,CAAC,EAAE,CAAC,CAChBE,SAAS,CAAEF,IAAI,CAAC,CAAC,CACnB,CACF,CACF,EA0BM,IAAAG,eAAgC,CAAG,CACvCC,QAAQ,CAAE,CACRC,OAAO,CAAE,CACPC,GAAG,CAAE,CACHC,OAAO,CAAE,0CAA0C,CACnDC,SAAS,CAAE,oBACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,2CAA2C,CACpDC,SAAS,CAAE,wCACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,+CAA+C,CACxDC,SAAS,CAAE,oBACb,CACF,CAAC,CACDG,QAAQ,CAAE,CACRL,GAAG,CAAE,CACHC,OAAO,CAAE,0CAA0C,CACnDC,SAAS,CAAE,0CACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,oBAAoB,CAC7BC,SAAS,CAAE,yCACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,gDAAgD,CACzDC,SAAS,CAAE,oBACb,CACF,CAAC,CACDI,QAAQ,CAAE,CACRN,GAAG,CAAE,CACHC,OAAO,CAAE,0CAA0C,CACnDC,SAAS,CAAE,oBACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,4CAA4C,CACrDC,SAAS,CAAE,4CACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,gDAAgD,CACzDC,SAAS,CAAE,oBACb,CACF,CACF,CACF,EAEM,IAAAK,gBAA0C,CAAG,CACjDR,OAAO,CAAE,CACPK,UAAU,CAAE,CACVH,OAAO,CAAE,mDAAmD,CAC5DC,SAAS,CAAE,0CACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,mDAAmD,CAC5DC,SAAS,CAAE,wCACb,CACF,CACF;;;;"}

package/build/lib/native/components/Skeleton/PulseAnimation.native.js

@@ -1,4 +1,3 @@
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import Animated, { useSharedValue, withRepeat, withSequence, withTiming, cancelAnimation, useAnimatedStyle, interpolateColor } from 'react-native-reanimated';
 import React__default from 'react';
 import { BaseBox } from '../Box/BaseBox/BaseBox.native.js';
@@ -13,7 +12,7 @@ import 'react-native-gesture-handler';
 import '../BottomSheet/BottomSheetStack.js';
 import { jsx } from 'react/jsx-runtime';
 
-var _excluded=["contrast"];var AnimatedBox=Animated.createAnimatedComponent(BaseBox);var PulseAnimation=function PulseAnimation(_ref){var contrast=_ref.contrast,props=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var durationPluseOff=theme.motion.duration.xmoderate;var durationPluseOn=theme.motion.duration['2xgentle'];var totalDuration=castNativeType(makeMotionTime(durationPluseOn+durationPluseOff));var easing=castNativeType(theme.motion.easing.standard.revealing);var progress=useSharedValue(0);var fadeIn=function fadeIn(){'worklet';var animations={opacity:withTiming(1,{duration:totalDuration,easing:easing})};var initialValues={opacity:0};return {initialValues:initialValues,animations:animations};};React__default.useEffect(function(){var pulsatingAnimationTimingConfig={duration:totalDuration,easing:easing};progress.value=withRepeat(withSequence(withTiming(0,pulsatingAnimationTimingConfig),withTiming(1,pulsatingAnimationTimingConfig)),-1,true);return function(){cancelAnimation(progress);};},[easing,progress,totalDuration]);var pulseAnimatedStyle=useAnimatedStyle(function(){return {backgroundColor:interpolateColor(progress.value,[1,0],[theme.colors.brand.gray.a50[`${contrast}Contrast`],theme.colors.brand.gray.a100[`${contrast}Contrast`]])};});return jsx(AnimatedBox,Object.assign({entering:fadeIn,style:pulseAnimatedStyle},props));};
+var AnimatedBox=Animated.createAnimatedComponent(BaseBox);var PulseAnimation=function PulseAnimation(props){var _useTheme=useTheme(),theme=_useTheme.theme;var durationPluseOff=theme.motion.duration.xmoderate;var durationPluseOn=theme.motion.duration['2xgentle'];var totalDuration=castNativeType(makeMotionTime(durationPluseOn+durationPluseOff));var easing=castNativeType(theme.motion.easing.standard.revealing);var progress=useSharedValue(0);var fadeIn=function fadeIn(){'worklet';var animations={opacity:withTiming(1,{duration:totalDuration,easing:easing})};var initialValues={opacity:0};return {initialValues:initialValues,animations:animations};};React__default.useEffect(function(){var pulsatingAnimationTimingConfig={duration:totalDuration,easing:easing};progress.value=withRepeat(withSequence(withTiming(0,pulsatingAnimationTimingConfig),withTiming(1,pulsatingAnimationTimingConfig)),-1,true);return function(){cancelAnimation(progress);};},[easing,progress,totalDuration]);var pulseAnimatedStyle=useAnimatedStyle(function(){return {backgroundColor:interpolateColor(progress.value,[1,0],[theme.colors.interactive.background.gray.highlighted,theme.colors.interactive.background.gray.default])};});return jsx(AnimatedBox,Object.assign({entering:fadeIn,style:pulseAnimatedStyle},props));};
 
 export { PulseAnimation };
 //# sourceMappingURL=PulseAnimation.native.js.map

package/build/lib/native/components/Skeleton/PulseAnimation.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"PulseAnimation.native.js","sources":["../../../../../src/components/Skeleton/PulseAnimation.native.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport Animated, {\n  cancelAnimation,\n  interpolateColor,\n  useAnimatedStyle,\n  useSharedValue,\n  withRepeat,\n  withSequence,\n  withTiming,\n} from 'react-native-reanimated';\nimport React from 'react';\nimport type { SkeletonProps } from './types';\nimport BaseBox from '~components/Box/BaseBox';\nimport { castNativeType, makeMotionTime } from '~utils';\nimport { useTheme } from '~components/BladeProvider';\n\nconst AnimatedBox = Animated.createAnimatedComponent(BaseBox);\n\nconst PulseAnimation = ({\n  contrast,\n  ...props\n}: { contrast: 'low' | 'high' } & SkeletonProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const durationPluseOff = theme.motion.duration.xmoderate;\n  const durationPluseOn = theme.motion.duration['2xgentle'];\n  const totalDuration = castNativeType(makeMotionTime(durationPluseOn + durationPluseOff));\n  const easing = castNativeType(theme.motion.easing.standard.revealing);\n  const progress = useSharedValue(0);\n\n  const fadeIn = () => {\n    'worklet';\n    const animations = {\n      opacity: withTiming(1, { duration: totalDuration, easing }),\n    };\n    const initialValues = {\n      opacity: 0,\n    };\n    return {\n      initialValues,\n      animations,\n    };\n  };\n\n  // Trigger pulsating animation\n  React.useEffect(() => {\n    const pulsatingAnimationTimingConfig = {\n      duration: totalDuration,\n      easing,\n    };\n    progress.value = withRepeat(\n      withSequence(\n        withTiming(0, pulsatingAnimationTimingConfig),\n        withTiming(1, pulsatingAnimationTimingConfig),\n      ),\n      -1,\n      true,\n    );\n\n    return () => {\n      cancelAnimation(progress);\n    };\n  }, [easing, progress, totalDuration]);\n\n  const pulseAnimatedStyle = useAnimatedStyle(() => {\n    return {\n      backgroundColor: interpolateColor(\n        progress.value,\n        [1, 0],\n        [\n          theme.colors.brand.gray.a50[`${contrast}Contrast`],\n          theme.colors.brand.gray.a100[`${contrast}Contrast`],\n        ],\n      ),\n    };\n  });\n\n  return <AnimatedBox entering={fadeIn} style={pulseAnimatedStyle} {...props} />;\n};\n\nexport { PulseAnimation };\n"],"names":["AnimatedBox","Animated","createAnimatedComponent","BaseBox","PulseAnimation","_ref","contrast","props","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","durationPluseOff","motion","duration","xmoderate","durationPluseOn","totalDuration","castNativeType","makeMotionTime","easing","standard","revealing","progress","useSharedValue","fadeIn","animations","opacity","withTiming","initialValues","React","useEffect","pulsatingAnimationTimingConfig","value","withRepeat","withSequence","cancelAnimation","pulseAnimatedStyle","useAnimatedStyle","backgroundColor","interpolateColor","colors","brand","gray","a50","a100","_jsx","Object","assign","entering","style"],"mappings":";;;;;;;;;;;;;;;AAEA,IAAA,SAAA,CAAA,CAAA,UAAA,CAAA,CAeA,IAAMA,WAAW,CAAGC,QAAQ,CAACC,uBAAuB,CAACC,OAAO,CAAC,CAEvD,IAAAC,cAAc,CAAG,SAAjBA,cAAcA,CAAAC,IAAA,CAGoD,CAAA,IAFtEC,QAAQ,CAAAD,IAAA,CAARC,QAAQ,CACLC,KAAK,CAAAC,wBAAA,CAAAH,IAAA,CAAAI,SAAA,CAAA,CAER,IAAAC,SAAA,CAAkBC,QAAQ,EAAE,CAApBC,KAAK,CAAAF,SAAA,CAALE,KAAK,CACb,IAAMC,gBAAgB,CAAGD,KAAK,CAACE,MAAM,CAACC,QAAQ,CAACC,SAAS,CACxD,IAAMC,eAAe,CAAGL,KAAK,CAACE,MAAM,CAACC,QAAQ,CAAC,UAAU,CAAC,CACzD,IAAMG,aAAa,CAAGC,cAAc,CAACC,cAAc,CAACH,eAAe,CAAGJ,gBAAgB,CAAC,CAAC,CACxF,IAAMQ,MAAM,CAAGF,cAAc,CAACP,KAAK,CAACE,MAAM,CAACO,MAAM,CAACC,QAAQ,CAACC,SAAS,CAAC,CACrE,IAAMC,QAAQ,CAAGC,cAAc,CAAC,CAAC,CAAC,CAElC,IAAMC,MAAM,CAAG,SAATA,MAAMA,EAAS,CACnB,SAAS,CACT,IAAMC,UAAU,CAAG,CACjBC,OAAO,CAAEC,UAAU,CAAC,CAAC,CAAE,CAAEd,QAAQ,CAAEG,aAAa,CAAEG,MAAM,CAANA,MAAO,CAAC,CAC5D,CAAC,CACD,IAAMS,aAAa,CAAG,CACpBF,OAAO,CAAE,CACX,CAAC,CACD,OAAO,CACLE,aAAa,CAAbA,aAAa,CACbH,UAAU,CAAVA,UACF,CAAC,CACH,CAAC,CAGDI,cAAK,CAACC,SAAS,CAAC,UAAM,CACpB,IAAMC,8BAA8B,CAAG,CACrClB,QAAQ,CAAEG,aAAa,CACvBG,MAAM,CAANA,MACF,CAAC,CACDG,QAAQ,CAACU,KAAK,CAAGC,UAAU,CACzBC,YAAY,CACVP,UAAU,CAAC,CAAC,CAAEI,8BAA8B,CAAC,CAC7CJ,UAAU,CAAC,CAAC,CAAEI,8BAA8B,CAC9C,CAAC,CACD,CAAC,CAAC,CACF,IACF,CAAC,CAED,OAAa,UAAA,CACXI,eAAe,CAACb,QAAQ,CAAC,CAC3B,CAAC,CACH,CAAC,CAAE,CAACH,MAAM,CAAEG,QAAQ,CAAEN,aAAa,CAAC,CAAC,CAErC,IAAMoB,kBAAkB,CAAGC,gBAAgB,CAAC,UAAM,CAChD,OAAO,CACLC,eAAe,CAAEC,gBAAgB,CAC/BjB,QAAQ,CAACU,KAAK,CACd,CAAC,CAAC,CAAE,CAAC,CAAC,CACN,CACEtB,KAAK,CAAC8B,MAAM,CAACC,KAAK,CAACC,IAAI,CAACC,GAAG,CAAE,GAAEvC,QAAS,CAAA,QAAA,CAAS,CAAC,CAClDM,KAAK,CAAC8B,MAAM,CAACC,KAAK,CAACC,IAAI,CAACE,IAAI,CAAE,CAAExC,EAAAA,QAAS,UAAS,CAAC,CAEvD,CACF,CAAC,CACH,CAAC,CAAC,CAEF,OAAOyC,GAAA,CAAC/C,WAAW,CAAAgD,MAAA,CAAAC,MAAA,EAACC,QAAQ,CAAExB,MAAO,CAACyB,KAAK,CAAEb,kBAAmB,CAAA,CAAK/B,KAAK,CAAG,CAAC,CAChF;;;;"}
+{"version":3,"file":"PulseAnimation.native.js","sources":["../../../../../src/components/Skeleton/PulseAnimation.native.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport Animated, {\n  cancelAnimation,\n  interpolateColor,\n  useAnimatedStyle,\n  useSharedValue,\n  withRepeat,\n  withSequence,\n  withTiming,\n} from 'react-native-reanimated';\nimport React from 'react';\nimport type { SkeletonProps } from './types';\nimport BaseBox from '~components/Box/BaseBox';\nimport { castNativeType, makeMotionTime } from '~utils';\nimport { useTheme } from '~components/BladeProvider';\n\nconst AnimatedBox = Animated.createAnimatedComponent(BaseBox);\n\nconst PulseAnimation = (props: SkeletonProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const durationPluseOff = theme.motion.duration.xmoderate;\n  const durationPluseOn = theme.motion.duration['2xgentle'];\n  const totalDuration = castNativeType(makeMotionTime(durationPluseOn + durationPluseOff));\n  const easing = castNativeType(theme.motion.easing.standard.revealing);\n  const progress = useSharedValue(0);\n\n  const fadeIn = () => {\n    'worklet';\n    const animations = {\n      opacity: withTiming(1, { duration: totalDuration, easing }),\n    };\n    const initialValues = {\n      opacity: 0,\n    };\n    return {\n      initialValues,\n      animations,\n    };\n  };\n\n  // Trigger pulsating animation\n  React.useEffect(() => {\n    const pulsatingAnimationTimingConfig = {\n      duration: totalDuration,\n      easing,\n    };\n    progress.value = withRepeat(\n      withSequence(\n        withTiming(0, pulsatingAnimationTimingConfig),\n        withTiming(1, pulsatingAnimationTimingConfig),\n      ),\n      -1,\n      true,\n    );\n\n    return () => {\n      cancelAnimation(progress);\n    };\n  }, [easing, progress, totalDuration]);\n\n  const pulseAnimatedStyle = useAnimatedStyle(() => {\n    return {\n      backgroundColor: interpolateColor(\n        progress.value,\n        [1, 0],\n        [\n          theme.colors.interactive.background.gray.highlighted,\n          theme.colors.interactive.background.gray.default,\n        ],\n      ),\n    };\n  });\n\n  return <AnimatedBox entering={fadeIn} style={pulseAnimatedStyle} {...props} />;\n};\n\nexport { PulseAnimation };\n"],"names":["AnimatedBox","Animated","createAnimatedComponent","BaseBox","PulseAnimation","props","_useTheme","useTheme","theme","durationPluseOff","motion","duration","xmoderate","durationPluseOn","totalDuration","castNativeType","makeMotionTime","easing","standard","revealing","progress","useSharedValue","fadeIn","animations","opacity","withTiming","initialValues","React","useEffect","pulsatingAnimationTimingConfig","value","withRepeat","withSequence","cancelAnimation","pulseAnimatedStyle","useAnimatedStyle","backgroundColor","interpolateColor","colors","interactive","background","gray","highlighted","default","_jsx","Object","assign","entering","style"],"mappings":";;;;;;;;;;;;;;AAiBA,IAAMA,WAAW,CAAGC,QAAQ,CAACC,uBAAuB,CAACC,OAAO,CAAC,CAEvD,IAAAC,cAAc,CAAG,SAAjBA,cAAcA,CAAIC,KAAoB,CAAyB,CACnE,IAAAC,SAAA,CAAkBC,QAAQ,EAAE,CAApBC,KAAK,CAAAF,SAAA,CAALE,KAAK,CACb,IAAMC,gBAAgB,CAAGD,KAAK,CAACE,MAAM,CAACC,QAAQ,CAACC,SAAS,CACxD,IAAMC,eAAe,CAAGL,KAAK,CAACE,MAAM,CAACC,QAAQ,CAAC,UAAU,CAAC,CACzD,IAAMG,aAAa,CAAGC,cAAc,CAACC,cAAc,CAACH,eAAe,CAAGJ,gBAAgB,CAAC,CAAC,CACxF,IAAMQ,MAAM,CAAGF,cAAc,CAACP,KAAK,CAACE,MAAM,CAACO,MAAM,CAACC,QAAQ,CAACC,SAAS,CAAC,CACrE,IAAMC,QAAQ,CAAGC,cAAc,CAAC,CAAC,CAAC,CAElC,IAAMC,MAAM,CAAG,SAATA,MAAMA,EAAS,CACnB,SAAS,CACT,IAAMC,UAAU,CAAG,CACjBC,OAAO,CAAEC,UAAU,CAAC,CAAC,CAAE,CAAEd,QAAQ,CAAEG,aAAa,CAAEG,MAAM,CAANA,MAAO,CAAC,CAC5D,CAAC,CACD,IAAMS,aAAa,CAAG,CACpBF,OAAO,CAAE,CACX,CAAC,CACD,OAAO,CACLE,aAAa,CAAbA,aAAa,CACbH,UAAU,CAAVA,UACF,CAAC,CACH,CAAC,CAGDI,cAAK,CAACC,SAAS,CAAC,UAAM,CACpB,IAAMC,8BAA8B,CAAG,CACrClB,QAAQ,CAAEG,aAAa,CACvBG,MAAM,CAANA,MACF,CAAC,CACDG,QAAQ,CAACU,KAAK,CAAGC,UAAU,CACzBC,YAAY,CACVP,UAAU,CAAC,CAAC,CAAEI,8BAA8B,CAAC,CAC7CJ,UAAU,CAAC,CAAC,CAAEI,8BAA8B,CAC9C,CAAC,CACD,CAAC,CAAC,CACF,IACF,CAAC,CAED,OAAa,UAAA,CACXI,eAAe,CAACb,QAAQ,CAAC,CAC3B,CAAC,CACH,CAAC,CAAE,CAACH,MAAM,CAAEG,QAAQ,CAAEN,aAAa,CAAC,CAAC,CAErC,IAAMoB,kBAAkB,CAAGC,gBAAgB,CAAC,UAAM,CAChD,OAAO,CACLC,eAAe,CAAEC,gBAAgB,CAC/BjB,QAAQ,CAACU,KAAK,CACd,CAAC,CAAC,CAAE,CAAC,CAAC,CACN,CACEtB,KAAK,CAAC8B,MAAM,CAACC,WAAW,CAACC,UAAU,CAACC,IAAI,CAACC,WAAW,CACpDlC,KAAK,CAAC8B,MAAM,CAACC,WAAW,CAACC,UAAU,CAACC,IAAI,CAACE,OAAO,CAEpD,CACF,CAAC,CACH,CAAC,CAAC,CAEF,OAAOC,GAAA,CAAC5C,WAAW,CAAA6C,MAAA,CAAAC,MAAA,EAACC,QAAQ,CAAEzB,MAAO,CAAC0B,KAAK,CAAEd,kBAAmB,CAAA,CAAK7B,KAAK,CAAG,CAAC,CAChF;;;;"}

package/build/lib/native/components/Skeleton/Skeleton.js

@@ -12,7 +12,7 @@ import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.native.js
 import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
 import { jsx } from 'react/jsx-runtime';
 
-var _excluded=["contrast","width","maxWidth","minWidth","height","maxHeight","minHeight","borderRadius","flexWrap","flexDirection","flexGrow","flexShrink","flexBasis","alignItems","alignContent","alignSelf","justifyItems","justifyContent","justifySelf","placeSelf","placeItems","order","testID"];var Skeleton=function Skeleton(_ref){var _ref$contrast=_ref.contrast,contrast=_ref$contrast===void 0?'low':_ref$contrast,width=_ref.width,maxWidth=_ref.maxWidth,minWidth=_ref.minWidth,height=_ref.height,maxHeight=_ref.maxHeight,minHeight=_ref.minHeight,borderRadius=_ref.borderRadius,flexWrap=_ref.flexWrap,flexDirection=_ref.flexDirection,flexGrow=_ref.flexGrow,flexShrink=_ref.flexShrink,flexBasis=_ref.flexBasis,alignItems=_ref.alignItems,alignContent=_ref.alignContent,alignSelf=_ref.alignSelf,justifyItems=_ref.justifyItems,justifyContent=_ref.justifyContent,justifySelf=_ref.justifySelf,placeSelf=_ref.placeSelf,placeItems=_ref.placeItems,order=_ref.order,testID=_ref.testID,props=_objectWithoutProperties(_ref,_excluded);return jsx(PulseAnimation,Object.assign({width:width,minWidth:minWidth,maxWidth:maxWidth,height:height,minHeight:minHeight,maxHeight:maxHeight,borderRadius:borderRadius,flexWrap:flexWrap,flexDirection:flexDirection,flexGrow:flexGrow,flexShrink:flexShrink,flexBasis:flexBasis,alignItems:alignItems,alignContent:alignContent,alignSelf:alignSelf,justifyItems:justifyItems,justifyContent:justifyContent,justifySelf:justifySelf,placeSelf:placeSelf,placeItems:placeItems,order:order,contrast:contrast},getStyledProps(props),makeAccessible({hidden:true}),metaAttribute({name:MetaConstants.Skeleton,testID:testID})));};
+var _excluded=["width","maxWidth","minWidth","height","maxHeight","minHeight","borderRadius","flexWrap","flexDirection","flexGrow","flexShrink","flexBasis","alignItems","alignContent","alignSelf","justifyItems","justifyContent","justifySelf","placeSelf","placeItems","order","testID"];var Skeleton=function Skeleton(_ref){var width=_ref.width,maxWidth=_ref.maxWidth,minWidth=_ref.minWidth,height=_ref.height,maxHeight=_ref.maxHeight,minHeight=_ref.minHeight,borderRadius=_ref.borderRadius,flexWrap=_ref.flexWrap,flexDirection=_ref.flexDirection,flexGrow=_ref.flexGrow,flexShrink=_ref.flexShrink,flexBasis=_ref.flexBasis,alignItems=_ref.alignItems,alignContent=_ref.alignContent,alignSelf=_ref.alignSelf,justifyItems=_ref.justifyItems,justifyContent=_ref.justifyContent,justifySelf=_ref.justifySelf,placeSelf=_ref.placeSelf,placeItems=_ref.placeItems,order=_ref.order,testID=_ref.testID,props=_objectWithoutProperties(_ref,_excluded);return jsx(PulseAnimation,Object.assign({width:width,minWidth:minWidth,maxWidth:maxWidth,height:height,minHeight:minHeight,maxHeight:maxHeight,borderRadius:borderRadius,flexWrap:flexWrap,flexDirection:flexDirection,flexGrow:flexGrow,flexShrink:flexShrink,flexBasis:flexBasis,alignItems:alignItems,alignContent:alignContent,alignSelf:alignSelf,justifyItems:justifyItems,justifyContent:justifyContent,justifySelf:justifySelf,placeSelf:placeSelf,placeItems:placeItems,order:order},getStyledProps(props),makeAccessible({hidden:true}),metaAttribute({name:MetaConstants.Skeleton,testID:testID})));};
 
 export { Skeleton };
 //# sourceMappingURL=Skeleton.js.map

package/build/lib/native/components/Skeleton/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.js","sources":["../../../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unnecessary-type-assertion */\nimport { PulseAnimation } from './PulseAnimation';\nimport type { SkeletonProps } from './types';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\n\nconst Skeleton = ({\n  contrast = 'low',\n  width,\n  maxWidth,\n  minWidth,\n  height,\n  maxHeight,\n  minHeight,\n  borderRadius,\n  flexWrap,\n  flexDirection,\n  flexGrow,\n  flexShrink,\n  flexBasis,\n  alignItems,\n  alignContent,\n  alignSelf,\n  justifyItems,\n  justifyContent,\n  justifySelf,\n  placeSelf,\n  placeItems,\n  order,\n  testID,\n  ...props\n}: SkeletonProps): React.ReactElement => {\n  return (\n    <PulseAnimation\n      width={width}\n      minWidth={minWidth}\n      maxWidth={maxWidth}\n      height={height}\n      minHeight={minHeight}\n      maxHeight={maxHeight}\n      borderRadius={borderRadius}\n      flexWrap={flexWrap}\n      flexDirection={flexDirection}\n      flexGrow={flexGrow}\n      flexShrink={flexShrink}\n      flexBasis={flexBasis}\n      alignItems={alignItems}\n      alignContent={alignContent}\n      alignSelf={alignSelf}\n      justifyItems={justifyItems}\n      justifyContent={justifyContent}\n      justifySelf={justifySelf}\n      placeSelf={placeSelf}\n      placeItems={placeItems}\n      order={order}\n      contrast={contrast}\n      {...getStyledProps(props)}\n      {...makeAccessible({ hidden: true })}\n      {...metaAttribute({ name: MetaConstants.Skeleton, testID })}\n    />\n  );\n};\n\nexport { Skeleton };\n"],"names":["Skeleton","_ref","_ref$contrast","contrast","width","maxWidth","minWidth","height","maxHeight","minHeight","borderRadius","flexWrap","flexDirection","flexGrow","flexShrink","flexBasis","alignItems","alignContent","alignSelf","justifyItems","justifyContent","justifySelf","placeSelf","placeItems","order","testID","props","_objectWithoutProperties","_excluded","_jsx","PulseAnimation","Object","assign","getStyledProps","makeAccessible","hidden","metaAttribute","name","MetaConstants"],"mappings":";;;;;;;;;;;;;;AACA,IAAA,SAAA,CAAA,CAAA,UAAA,CAAA,OAAA,CAAA,UAAA,CAAA,UAAA,CAAA,QAAA,CAAA,WAAA,CAAA,WAAA,CAAA,cAAA,CAAA,UAAA,CAAA,eAAA,CAAA,UAAA,CAAA,YAAA,CAAA,WAAA,CAAA,YAAA,CAAA,cAAA,CAAA,WAAA,CAAA,cAAA,CAAA,gBAAA,CAAA,aAAA,CAAA,WAAA,CAAA,YAAA,CAAA,OAAA,CAAA,QAAA,CAAA,CAMM,IAAAA,QAAQ,CAAG,SAAXA,QAAQA,CAAAC,IAAA,CAyB2B,CAAA,IAAAC,aAAA,CAAAD,IAAA,CAxBvCE,QAAQ,CAARA,QAAQ,CAAAD,aAAA,GAAA,KAAA,CAAA,CAAG,KAAK,CAAAA,aAAA,CAChBE,KAAK,CAAAH,IAAA,CAALG,KAAK,CACLC,QAAQ,CAAAJ,IAAA,CAARI,QAAQ,CACRC,QAAQ,CAAAL,IAAA,CAARK,QAAQ,CACRC,MAAM,CAAAN,IAAA,CAANM,MAAM,CACNC,SAAS,CAAAP,IAAA,CAATO,SAAS,CACTC,SAAS,CAAAR,IAAA,CAATQ,SAAS,CACTC,YAAY,CAAAT,IAAA,CAAZS,YAAY,CACZC,QAAQ,CAAAV,IAAA,CAARU,QAAQ,CACRC,aAAa,CAAAX,IAAA,CAAbW,aAAa,CACbC,QAAQ,CAAAZ,IAAA,CAARY,QAAQ,CACRC,UAAU,CAAAb,IAAA,CAAVa,UAAU,CACVC,SAAS,CAAAd,IAAA,CAATc,SAAS,CACTC,UAAU,CAAAf,IAAA,CAAVe,UAAU,CACVC,YAAY,CAAAhB,IAAA,CAAZgB,YAAY,CACZC,SAAS,CAAAjB,IAAA,CAATiB,SAAS,CACTC,YAAY,CAAAlB,IAAA,CAAZkB,YAAY,CACZC,cAAc,CAAAnB,IAAA,CAAdmB,cAAc,CACdC,WAAW,CAAApB,IAAA,CAAXoB,WAAW,CACXC,SAAS,CAAArB,IAAA,CAATqB,SAAS,CACTC,UAAU,CAAAtB,IAAA,CAAVsB,UAAU,CACVC,KAAK,CAAAvB,IAAA,CAALuB,KAAK,CACLC,MAAM,CAAAxB,IAAA,CAANwB,MAAM,CACHC,KAAK,CAAAC,wBAAA,CAAA1B,IAAA,CAAA2B,SAAA,CAER,CAAA,OACEC,GAAA,CAACC,cAAc,CAAAC,MAAA,CAAAC,MAAA,CACb5B,CAAAA,KAAK,CAAEA,KAAM,CACbE,QAAQ,CAAEA,QAAS,CACnBD,QAAQ,CAAEA,QAAS,CACnBE,MAAM,CAAEA,MAAO,CACfE,SAAS,CAAEA,SAAU,CACrBD,SAAS,CAAEA,SAAU,CACrBE,YAAY,CAAEA,YAAa,CAC3BC,QAAQ,CAAEA,QAAS,CACnBC,aAAa,CAAEA,aAAc,CAC7BC,QAAQ,CAAEA,QAAS,CACnBC,UAAU,CAAEA,UAAW,CACvBC,SAAS,CAAEA,SAAU,CACrBC,UAAU,CAAEA,UAAW,CACvBC,YAAY,CAAEA,YAAa,CAC3BC,SAAS,CAAEA,SAAU,CACrBC,YAAY,CAAEA,YAAa,CAC3BC,cAAc,CAAEA,cAAe,CAC/BC,WAAW,CAAEA,WAAY,CACzBC,SAAS,CAAEA,SAAU,CACrBC,UAAU,CAAEA,UAAW,CACvBC,KAAK,CAAEA,KAAM,CACbrB,QAAQ,CAAEA,QAAS,CACf8B,CAAAA,cAAc,CAACP,KAAK,CAAC,CACrBQ,cAAc,CAAC,CAAEC,MAAM,CAAE,IAAK,CAAC,CAAC,CAChCC,aAAa,CAAC,CAAEC,IAAI,CAAEC,aAAa,CAACtC,QAAQ,CAAEyB,MAAM,CAANA,MAAO,CAAC,CAAC,CAC5D,CAAC,CAEN;;;;"}
+{"version":3,"file":"Skeleton.js","sources":["../../../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unnecessary-type-assertion */\nimport { PulseAnimation } from './PulseAnimation';\nimport type { SkeletonProps } from './types';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\n\nconst Skeleton = ({\n  width,\n  maxWidth,\n  minWidth,\n  height,\n  maxHeight,\n  minHeight,\n  borderRadius,\n  flexWrap,\n  flexDirection,\n  flexGrow,\n  flexShrink,\n  flexBasis,\n  alignItems,\n  alignContent,\n  alignSelf,\n  justifyItems,\n  justifyContent,\n  justifySelf,\n  placeSelf,\n  placeItems,\n  order,\n  testID,\n  ...props\n}: SkeletonProps): React.ReactElement => {\n  return (\n    <PulseAnimation\n      width={width}\n      minWidth={minWidth}\n      maxWidth={maxWidth}\n      height={height}\n      minHeight={minHeight}\n      maxHeight={maxHeight}\n      borderRadius={borderRadius}\n      flexWrap={flexWrap}\n      flexDirection={flexDirection}\n      flexGrow={flexGrow}\n      flexShrink={flexShrink}\n      flexBasis={flexBasis}\n      alignItems={alignItems}\n      alignContent={alignContent}\n      alignSelf={alignSelf}\n      justifyItems={justifyItems}\n      justifyContent={justifyContent}\n      justifySelf={justifySelf}\n      placeSelf={placeSelf}\n      placeItems={placeItems}\n      order={order}\n      {...getStyledProps(props)}\n      {...makeAccessible({ hidden: true })}\n      {...metaAttribute({ name: MetaConstants.Skeleton, testID })}\n    />\n  );\n};\n\nexport { Skeleton };\n"],"names":["Skeleton","_ref","width","maxWidth","minWidth","height","maxHeight","minHeight","borderRadius","flexWrap","flexDirection","flexGrow","flexShrink","flexBasis","alignItems","alignContent","alignSelf","justifyItems","justifyContent","justifySelf","placeSelf","placeItems","order","testID","props","_objectWithoutProperties","_excluded","_jsx","PulseAnimation","Object","assign","getStyledProps","makeAccessible","hidden","metaAttribute","name","MetaConstants"],"mappings":";;;;;;;;;;;;;;AACA,IAAA,SAAA,CAAA,CAAA,OAAA,CAAA,UAAA,CAAA,UAAA,CAAA,QAAA,CAAA,WAAA,CAAA,WAAA,CAAA,cAAA,CAAA,UAAA,CAAA,eAAA,CAAA,UAAA,CAAA,YAAA,CAAA,WAAA,CAAA,YAAA,CAAA,cAAA,CAAA,WAAA,CAAA,cAAA,CAAA,gBAAA,CAAA,aAAA,CAAA,WAAA,CAAA,YAAA,CAAA,OAAA,CAAA,QAAA,CAAA,CAMM,IAAAA,QAAQ,CAAG,SAAXA,QAAQA,CAAAC,IAAA,CAwB2B,CAvBvC,IAAAC,KAAK,CAAAD,IAAA,CAALC,KAAK,CACLC,QAAQ,CAAAF,IAAA,CAARE,QAAQ,CACRC,QAAQ,CAAAH,IAAA,CAARG,QAAQ,CACRC,MAAM,CAAAJ,IAAA,CAANI,MAAM,CACNC,SAAS,CAAAL,IAAA,CAATK,SAAS,CACTC,SAAS,CAAAN,IAAA,CAATM,SAAS,CACTC,YAAY,CAAAP,IAAA,CAAZO,YAAY,CACZC,QAAQ,CAAAR,IAAA,CAARQ,QAAQ,CACRC,aAAa,CAAAT,IAAA,CAAbS,aAAa,CACbC,QAAQ,CAAAV,IAAA,CAARU,QAAQ,CACRC,UAAU,CAAAX,IAAA,CAAVW,UAAU,CACVC,SAAS,CAAAZ,IAAA,CAATY,SAAS,CACTC,UAAU,CAAAb,IAAA,CAAVa,UAAU,CACVC,YAAY,CAAAd,IAAA,CAAZc,YAAY,CACZC,SAAS,CAAAf,IAAA,CAATe,SAAS,CACTC,YAAY,CAAAhB,IAAA,CAAZgB,YAAY,CACZC,cAAc,CAAAjB,IAAA,CAAdiB,cAAc,CACdC,WAAW,CAAAlB,IAAA,CAAXkB,WAAW,CACXC,SAAS,CAAAnB,IAAA,CAATmB,SAAS,CACTC,UAAU,CAAApB,IAAA,CAAVoB,UAAU,CACVC,KAAK,CAAArB,IAAA,CAALqB,KAAK,CACLC,MAAM,CAAAtB,IAAA,CAANsB,MAAM,CACHC,KAAK,CAAAC,wBAAA,CAAAxB,IAAA,CAAAyB,SAAA,CAER,CAAA,OACEC,GAAA,CAACC,cAAc,CAAAC,MAAA,CAAAC,MAAA,CACb5B,CAAAA,KAAK,CAAEA,KAAM,CACbE,QAAQ,CAAEA,QAAS,CACnBD,QAAQ,CAAEA,QAAS,CACnBE,MAAM,CAAEA,MAAO,CACfE,SAAS,CAAEA,SAAU,CACrBD,SAAS,CAAEA,SAAU,CACrBE,YAAY,CAAEA,YAAa,CAC3BC,QAAQ,CAAEA,QAAS,CACnBC,aAAa,CAAEA,aAAc,CAC7BC,QAAQ,CAAEA,QAAS,CACnBC,UAAU,CAAEA,UAAW,CACvBC,SAAS,CAAEA,SAAU,CACrBC,UAAU,CAAEA,UAAW,CACvBC,YAAY,CAAEA,YAAa,CAC3BC,SAAS,CAAEA,SAAU,CACrBC,YAAY,CAAEA,YAAa,CAC3BC,cAAc,CAAEA,cAAe,CAC/BC,WAAW,CAAEA,WAAY,CACzBC,SAAS,CAAEA,SAAU,CACrBC,UAAU,CAAEA,UAAW,CACvBC,KAAK,CAAEA,KAAM,CAAA,CACTS,cAAc,CAACP,KAAK,CAAC,CACrBQ,cAAc,CAAC,CAAEC,MAAM,CAAE,IAAK,CAAC,CAAC,CAChCC,aAAa,CAAC,CAAEC,IAAI,CAAEC,aAAa,CAACpC,QAAQ,CAAEuB,MAAM,CAANA,MAAO,CAAC,CAAC,CAC5D,CAAC,CAEN;;;;"}

package/build/lib/native/components/Spinner/BaseSpinner/BaseSpinner.js

@@ -24,7 +24,7 @@ import { Text } from '../../Typography/Text/Text.js';
 import '../../Typography/Code/Code.js';
 import { makeAccessible } from '../../../utils/makeAccessible/makeAccessible.native.js';
 
-var _excluded=["label","labelPosition","accessibilityLabel","contrast","color","size","testID"];var getColor=function getColor(_ref){var contrast=_ref.contrast,color=_ref.color,theme=_ref.theme;if(contrast==='high'||color&&color==='white'){return getIn(theme.colors,'static.white');}if(color&&color!=='default'){return getIn(theme.colors,`feedback.${color}.action.icon.primary.disabled.lowContrast`);}return getIn(theme.colors,'brand.gray.700.lowContrast');};var BaseSpinner=function BaseSpinner(_ref2){var label=_ref2.label,_ref2$labelPosition=_ref2.labelPosition,labelPosition=_ref2$labelPosition===void 0?'right':_ref2$labelPosition,accessibilityLabel=_ref2.accessibilityLabel,_ref2$contrast=_ref2.contrast,contrast=_ref2$contrast===void 0?'low':_ref2$contrast,_ref2$color=_ref2.color,color=_ref2$color===void 0?'default':_ref2$color,_ref2$size=_ref2.size,size=_ref2$size===void 0?'medium':_ref2$size,testID=_ref2.testID,styledProps=_objectWithoutProperties(_ref2,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;return jsx(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.Spinner,testID:testID}),getStyledProps(styledProps),{children:jsxs(BaseBox,Object.assign({display:"flex",alignItems:"center",flexDirection:labelPosition==='right'?'row':'column'},makeAccessible({label:accessibilityLabel,role:'progressbar'}),{children:[jsx(SpinningBox,{children:jsx(SpinnerIcon,{dimensions:makeSize(dimensions[size]),color:getColor({contrast:contrast,color:color,theme:theme})})}),label&&label.trim().length>0?jsx(BaseBox,{marginLeft:labelPosition==='right'?'spacing.3':'spacing.0',marginTop:labelPosition==='bottom'?'spacing.3':'spacing.0',children:jsx(Text,{variant:"body",weight:"regular",type:"subdued",size:"small",contrast:contrast,children:label})}):null]}))}));};
+var _excluded=["label","labelPosition","accessibilityLabel","color","size","testID"];var getColor=function getColor(_ref){var color=_ref.color,theme=_ref.theme;if(color&&color==='white'){return getIn(theme.colors,'surface.background.gray.intense');}if(color&&color!=='primary'){return getIn(theme.colors,`feedback.background.${color}.intense`);}return getIn(theme.colors,'surface.background.primary.intense');};var BaseSpinner=function BaseSpinner(_ref2){var label=_ref2.label,_ref2$labelPosition=_ref2.labelPosition,labelPosition=_ref2$labelPosition===void 0?'right':_ref2$labelPosition,accessibilityLabel=_ref2.accessibilityLabel,_ref2$color=_ref2.color,color=_ref2$color===void 0?'neutral':_ref2$color,_ref2$size=_ref2.size,size=_ref2$size===void 0?'medium':_ref2$size,testID=_ref2.testID,styledProps=_objectWithoutProperties(_ref2,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;return jsx(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.Spinner,testID:testID}),getStyledProps(styledProps),{children:jsxs(BaseBox,Object.assign({display:"flex",alignItems:"center",flexDirection:labelPosition==='right'?'row':'column'},makeAccessible({label:accessibilityLabel,role:'progressbar'}),{children:[jsx(SpinningBox,{children:jsx(SpinnerIcon,{dimensions:makeSize(dimensions[size]),color:getColor({color:color,theme:theme})})}),label&&label.trim().length>0?jsx(BaseBox,{marginLeft:labelPosition==='right'?'spacing.3':'spacing.0',marginTop:labelPosition==='bottom'?'spacing.3':'spacing.0',children:jsx(Text,{variant:"body",weight:"regular",size:"small",color:"surface.text.gray.muted",children:label})}):null]}))}));};
 
 export { BaseSpinner };
 //# sourceMappingURL=BaseSpinner.js.map

package/build/lib/native/components/Spinner/BaseSpinner/BaseSpinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseSpinner.js","sources":["../../../../../../src/components/Spinner/BaseSpinner/BaseSpinner.tsx"],"sourcesContent":["import React from 'react';\nimport { dimensions } from './spinnerTokens';\nimport SpinnerIcon from './SpinnerIcon';\nimport { SpinningBox } from './SpinningBox';\nimport getIn from '~utils/lodashButBetter/get';\nimport type { Theme } from '~components/BladeProvider';\nimport { useTheme } from '~components/BladeProvider';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { ColorContrastTypes, Feedback } from '~tokens/theme/theme';\nimport BaseBox from '~components/Box/BaseBox';\nimport { Text } from '~components/Typography';\nimport type { TestID } from '~utils/types';\nimport { makeSize } from '~utils/makeSize';\nimport { makeAccessible } from '~utils/makeAccessible';\n\ntype BaseSpinnerProps = {\n  /**\n   * Sets the color of the spinner.\n   *\n   * @default 'default'\n   */\n  color?: 'default' | 'white' | Feedback;\n  /**\n   * Sets the label of the spinner.\n   *\n   * @default 'right'\n   */\n  label?: string;\n  /**\n   * Sets the label of the spinner.\n   *\n   */\n  labelPosition?: 'right' | 'bottom';\n  /**\n   * This is deprecated in favor of the `color` prop.\n   *\n   * @deprecated Use `color=\"white\"` for high contrast and `color=\"default\"` for low contrast\n   * @default 'low'\n   */\n  contrast?: ColorContrastTypes;\n  /**\n   * Sets the size of the spinner.\n   *\n   * @default 'medium'\n   */\n  size?: 'medium' | 'large' | 'xlarge';\n  /**\n   * Sets the aria-label for web & accessibilityLabel react-native.\n   *\n   */\n  accessibilityLabel: string;\n} & TestID &\n  StyledPropsBlade;\n\nconst getColor = ({\n  contrast,\n  color,\n  theme,\n}: {\n  contrast: NonNullable<BaseSpinnerProps['contrast']>;\n  color: BaseSpinnerProps['color'];\n  theme: Theme;\n}): string => {\n  if (contrast === 'high' || (color && color === 'white')) {\n    return getIn(theme.colors, 'static.white');\n  }\n  if (color && color !== 'default') {\n    return getIn(theme.colors, `feedback.${color}.action.icon.primary.disabled.lowContrast`);\n  }\n  return getIn(theme.colors, 'brand.gray.700.lowContrast');\n};\n\nconst BaseSpinner = ({\n  label,\n  labelPosition = 'right',\n  accessibilityLabel,\n  contrast = 'low',\n  color = 'default',\n  size = 'medium',\n  testID,\n  ...styledProps\n}: BaseSpinnerProps): React.ReactElement => {\n  const { theme } = useTheme();\n  return (\n    <BaseBox\n      {...metaAttribute({ name: MetaConstants.Spinner, testID })}\n      {...getStyledProps(styledProps)}\n    >\n      <BaseBox\n        display=\"flex\"\n        alignItems=\"center\"\n        flexDirection={labelPosition === 'right' ? 'row' : 'column'}\n        {...makeAccessible({\n          label: accessibilityLabel,\n          role: 'progressbar',\n        })}\n      >\n        <SpinningBox>\n          <SpinnerIcon\n            dimensions={makeSize(dimensions[size])}\n            color={getColor({ contrast, color, theme })}\n          />\n        </SpinningBox>\n        {label && label.trim().length > 0 ? (\n          <BaseBox\n            marginLeft={labelPosition === 'right' ? 'spacing.3' : 'spacing.0'}\n            marginTop={labelPosition === 'bottom' ? 'spacing.3' : 'spacing.0'}\n          >\n            <Text variant=\"body\" weight=\"regular\" type=\"subdued\" size=\"small\" contrast={contrast}>\n              {label}\n            </Text>\n          </BaseBox>\n        ) : null}\n      </BaseBox>\n    </BaseBox>\n  );\n};\n\nexport type { BaseSpinnerProps };\nexport { BaseSpinner };\n"],"names":["getColor","_ref","contrast","color","theme","getIn","colors","BaseSpinner","_ref2","label","_ref2$labelPosition","labelPosition","accessibilityLabel","_ref2$contrast","_ref2$color","_ref2$size","size","testID","styledProps","_objectWithoutProperties","_excluded","_useTheme","useTheme","_jsx","BaseBox","Object","assign","metaAttribute","name","MetaConstants","Spinner","getStyledProps","children","_jsxs","display","alignItems","flexDirection","makeAccessible","role","SpinningBox","SpinnerIcon","dimensions","makeSize","trim","length","marginLeft","marginTop","Text","variant","weight","type"],"mappings":"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"}
+{"version":3,"file":"BaseSpinner.js","sources":["../../../../../../src/components/Spinner/BaseSpinner/BaseSpinner.tsx"],"sourcesContent":["import React from 'react';\nimport { dimensions } from './spinnerTokens';\nimport SpinnerIcon from './SpinnerIcon';\nimport { SpinningBox } from './SpinningBox';\nimport getIn from '~utils/lodashButBetter/get';\nimport type { Theme } from '~components/BladeProvider';\nimport { useTheme } from '~components/BladeProvider';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { FeedbackColors } from '~tokens/theme/theme';\nimport BaseBox from '~components/Box/BaseBox';\nimport { Text } from '~components/Typography';\nimport type { TestID } from '~utils/types';\nimport { makeSize } from '~utils/makeSize';\nimport { makeAccessible } from '~utils/makeAccessible';\n\ntype BaseSpinnerProps = {\n  /**\n   * Sets the color of the spinner.\n   *\n   * @default 'default'\n   */\n  color?: 'primary' | 'white' | FeedbackColors;\n  /**\n   * Sets the label of the spinner.\n   *\n   * @default 'right'\n   */\n  label?: string;\n  /**\n   * Sets the label of the spinner.\n   *\n   */\n  labelPosition?: 'right' | 'bottom';\n  /**\n   * Sets the size of the spinner.\n   *\n   * @default 'medium'\n   */\n  size?: 'medium' | 'large' | 'xlarge';\n  /**\n   * Sets the aria-label for web & accessibilityLabel react-native.\n   *\n   */\n  accessibilityLabel: string;\n} & TestID &\n  StyledPropsBlade;\n\nconst getColor = ({ color, theme }: { color: BaseSpinnerProps['color']; theme: Theme }): string => {\n  if (color && color === 'white') {\n    return getIn(theme.colors, 'surface.background.gray.intense');\n  }\n  if (color && color !== 'primary') {\n    return getIn(theme.colors, `feedback.background.${color}.intense`);\n  }\n  return getIn(theme.colors, 'surface.background.primary.intense');\n};\n\nconst BaseSpinner = ({\n  label,\n  labelPosition = 'right',\n  accessibilityLabel,\n  color = 'neutral',\n  size = 'medium',\n  testID,\n  ...styledProps\n}: BaseSpinnerProps): React.ReactElement => {\n  const { theme } = useTheme();\n  return (\n    <BaseBox\n      {...metaAttribute({ name: MetaConstants.Spinner, testID })}\n      {...getStyledProps(styledProps)}\n    >\n      <BaseBox\n        display=\"flex\"\n        alignItems=\"center\"\n        flexDirection={labelPosition === 'right' ? 'row' : 'column'}\n        {...makeAccessible({\n          label: accessibilityLabel,\n          role: 'progressbar',\n        })}\n      >\n        <SpinningBox>\n          <SpinnerIcon dimensions={makeSize(dimensions[size])} color={getColor({ color, theme })} />\n        </SpinningBox>\n        {label && label.trim().length > 0 ? (\n          <BaseBox\n            marginLeft={labelPosition === 'right' ? 'spacing.3' : 'spacing.0'}\n            marginTop={labelPosition === 'bottom' ? 'spacing.3' : 'spacing.0'}\n          >\n            <Text variant=\"body\" weight=\"regular\" size=\"small\" color=\"surface.text.gray.muted\">\n              {label}\n            </Text>\n          </BaseBox>\n        ) : null}\n      </BaseBox>\n    </BaseBox>\n  );\n};\n\nexport type { BaseSpinnerProps };\nexport { BaseSpinner };\n"],"names":["getColor","_ref","color","theme","getIn","colors","BaseSpinner","_ref2","label","_ref2$labelPosition","labelPosition","accessibilityLabel","_ref2$color","_ref2$size","size","testID","styledProps","_objectWithoutProperties","_excluded","_useTheme","useTheme","_jsx","BaseBox","Object","assign","metaAttribute","name","MetaConstants","Spinner","getStyledProps","children","_jsxs","display","alignItems","flexDirection","makeAccessible","role","SpinningBox","SpinnerIcon","dimensions","makeSize","trim","length","marginLeft","marginTop","Text","variant","weight"],"mappings":"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"}

package/build/lib/native/components/Spinner/Spinner/Spinner.js

@@ -2,7 +2,7 @@ import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProper
 import { BaseSpinner } from '../BaseSpinner/BaseSpinner.js';
 import { jsx } from 'react/jsx-runtime';
 
-var _excluded=["label","labelPosition","accessibilityLabel","color","contrast","size","testID"];var Spinner=function Spinner(_ref){var _ref2;var label=_ref.label,labelPosition=_ref.labelPosition,accessibilityLabel=_ref.accessibilityLabel,_ref$color=_ref.color,color=_ref$color===void 0?'default':_ref$color,_ref$contrast=_ref.contrast,contrast=_ref$contrast===void 0?'low':_ref$contrast,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded);return jsx(BaseSpinner,Object.assign({label:label,labelPosition:labelPosition,accessibilityLabel:(_ref2=accessibilityLabel!=null?accessibilityLabel:label)!=null?_ref2:'Loading',contrast:contrast,color:color,size:size,testID:testID},styledProps));};
+var _excluded=["label","labelPosition","accessibilityLabel","color","size","testID"];var Spinner=function Spinner(_ref){var _ref2;var label=_ref.label,labelPosition=_ref.labelPosition,accessibilityLabel=_ref.accessibilityLabel,_ref$color=_ref.color,color=_ref$color===void 0?'neutral':_ref$color,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded);return jsx(BaseSpinner,Object.assign({label:label,labelPosition:labelPosition,accessibilityLabel:(_ref2=accessibilityLabel!=null?accessibilityLabel:label)!=null?_ref2:'Loading',color:color,size:size,testID:testID},styledProps));};
 
 export { Spinner };
 //# sourceMappingURL=Spinner.js.map

package/build/lib/native/components/Spinner/Spinner/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.js","sources":["../../../../../../src/components/Spinner/Spinner/Spinner.tsx"],"sourcesContent":["import { BaseSpinner } from '../BaseSpinner';\nimport type { BaseSpinnerProps } from '../BaseSpinner';\n\ntype SpinnerProps = Omit<BaseSpinnerProps, 'intent'> & {\n  /**\n   * Sets the color of the spinner.\n   *\n   * @default 'default'\n   */\n  color?: 'default' | 'white';\n};\n\nconst Spinner = ({\n  label,\n  labelPosition,\n  accessibilityLabel,\n  color = 'default',\n  // TODO: Remove contrast prop in favor of color in the next major release\n  contrast = 'low',\n  size = 'medium',\n  testID,\n  ...styledProps\n}: SpinnerProps): React.ReactElement => {\n  return (\n    <BaseSpinner\n      label={label}\n      labelPosition={labelPosition}\n      accessibilityLabel={accessibilityLabel ?? label ?? 'Loading'}\n      contrast={contrast}\n      color={color}\n      size={size}\n      testID={testID}\n      {...styledProps}\n    />\n  );\n};\n\nexport type { SpinnerProps };\nexport { Spinner };\n"],"names":["Spinner","_ref","_ref2","label","labelPosition","accessibilityLabel","_ref$color","color","_ref$contrast","contrast","_ref$size","size","testID","styledProps","_objectWithoutProperties","_excluded","_jsx","BaseSpinner","Object","assign"],"mappings":";;;;AAAA,IAAA,SAAA,CAAA,CAAA,OAAA,CAAA,eAAA,CAAA,oBAAA,CAAA,OAAA,CAAA,UAAA,CAAA,MAAA,CAAA,QAAA,CAAA,CAYM,IAAAA,OAAO,CAAG,SAAVA,OAAOA,CAAAC,IAAA,CAU2B,CAAAC,IAAAA,KAAA,CATtC,IAAAC,KAAK,CAAAF,IAAA,CAALE,KAAK,CACLC,aAAa,CAAAH,IAAA,CAAbG,aAAa,CACbC,kBAAkB,CAAAJ,IAAA,CAAlBI,kBAAkB,CAAAC,UAAA,CAAAL,IAAA,CAClBM,KAAK,CAALA,KAAK,CAAAD,UAAA,GAAG,KAAA,CAAA,CAAA,SAAS,CAAAA,UAAA,CAAAE,aAAA,CAAAP,IAAA,CAEjBQ,QAAQ,CAARA,QAAQ,CAAAD,aAAA,UAAG,KAAK,CAAAA,aAAA,CAAAE,SAAA,CAAAT,IAAA,CAChBU,IAAI,CAAJA,IAAI,CAAAD,SAAA,GAAA,KAAA,CAAA,CAAG,QAAQ,CAAAA,SAAA,CACfE,MAAM,CAAAX,IAAA,CAANW,MAAM,CACHC,WAAW,CAAAC,wBAAA,CAAAb,IAAA,CAAAc,SAAA,CAEd,CAAA,OACEC,GAAA,CAACC,WAAW,CAAAC,MAAA,CAAAC,MAAA,CAAA,CACVhB,KAAK,CAAEA,KAAM,CACbC,aAAa,CAAEA,aAAc,CAC7BC,kBAAkB,CAAA,CAAAH,KAAA,CAAEG,kBAAkB,EAAA,IAAA,CAAlBA,kBAAkB,CAAIF,KAAK,GAAAD,IAAAA,CAAAA,KAAA,CAAI,SAAU,CAC7DO,QAAQ,CAAEA,QAAS,CACnBF,KAAK,CAAEA,KAAM,CACbI,IAAI,CAAEA,IAAK,CACXC,MAAM,CAAEA,MAAO,CACXC,CAAAA,WAAW,CAChB,CAAC,CAEN;;;;"}
+{"version":3,"file":"Spinner.js","sources":["../../../../../../src/components/Spinner/Spinner/Spinner.tsx"],"sourcesContent":["import { BaseSpinner } from '../BaseSpinner';\nimport type { BaseSpinnerProps } from '../BaseSpinner';\n\ntype SpinnerProps = BaseSpinnerProps & {\n  /**\n   * Sets the color of the spinner.\n   *\n   * @default 'default'\n   */\n  color?: 'primary' | 'neutral' | 'white';\n};\n\nconst Spinner = ({\n  label,\n  labelPosition,\n  accessibilityLabel,\n  color = 'neutral',\n  size = 'medium',\n  testID,\n  ...styledProps\n}: SpinnerProps): React.ReactElement => {\n  return (\n    <BaseSpinner\n      label={label}\n      labelPosition={labelPosition}\n      accessibilityLabel={accessibilityLabel ?? label ?? 'Loading'}\n      color={color}\n      size={size}\n      testID={testID}\n      {...styledProps}\n    />\n  );\n};\n\nexport type { SpinnerProps };\nexport { Spinner };\n"],"names":["Spinner","_ref","_ref2","label","labelPosition","accessibilityLabel","_ref$color","color","_ref$size","size","testID","styledProps","_objectWithoutProperties","_excluded","_jsx","BaseSpinner","Object","assign"],"mappings":";;;;AAAA,IAAA,SAAA,CAAA,CAAA,OAAA,CAAA,eAAA,CAAA,oBAAA,CAAA,OAAA,CAAA,MAAA,CAAA,QAAA,CAAA,CAYM,IAAAA,OAAO,CAAG,SAAVA,OAAOA,CAAAC,IAAA,CAQ2B,CAAAC,IAAAA,KAAA,CAPtC,IAAAC,KAAK,CAAAF,IAAA,CAALE,KAAK,CACLC,aAAa,CAAAH,IAAA,CAAbG,aAAa,CACbC,kBAAkB,CAAAJ,IAAA,CAAlBI,kBAAkB,CAAAC,UAAA,CAAAL,IAAA,CAClBM,KAAK,CAALA,KAAK,CAAAD,UAAA,GAAA,KAAA,CAAA,CAAG,SAAS,CAAAA,UAAA,CAAAE,SAAA,CAAAP,IAAA,CACjBQ,IAAI,CAAJA,IAAI,CAAAD,SAAA,GAAA,KAAA,CAAA,CAAG,QAAQ,CAAAA,SAAA,CACfE,MAAM,CAAAT,IAAA,CAANS,MAAM,CACHC,WAAW,CAAAC,wBAAA,CAAAX,IAAA,CAAAY,SAAA,EAEd,OACEC,GAAA,CAACC,WAAW,CAAAC,MAAA,CAAAC,MAAA,CAAA,CACVd,KAAK,CAAEA,KAAM,CACbC,aAAa,CAAEA,aAAc,CAC7BC,kBAAkB,CAAAH,CAAAA,KAAA,CAAEG,kBAAkB,EAAlBA,IAAAA,CAAAA,kBAAkB,CAAIF,KAAK,GAAAD,IAAAA,CAAAA,KAAA,CAAI,SAAU,CAC7DK,KAAK,CAAEA,KAAM,CACbE,IAAI,CAAEA,IAAK,CACXC,MAAM,CAAEA,MAAO,CAAA,CACXC,WAAW,CAChB,CAAC,CAEN;;;;"}

package/build/lib/native/components/Switch/switchTokens.js

@@ -2,7 +2,7 @@ import '../../tokens/global/typography.js';
 import '../../tokens/global/motion.js';
 import { size } from '../../tokens/global/size.js';
 
-var switchSizes={track:{desktop:{small:{width:size[28],height:'spacing.5'},medium:{width:size[36],height:'spacing.6'}},mobile:{small:{width:size[36],height:'spacing.6'},medium:{width:size[44],height:'spacing.7'}}},thumb:{desktop:{small:{width:'spacing.4',height:'spacing.4'},medium:{width:'spacing.5',height:'spacing.5'}},mobile:{small:{width:'spacing.5',height:'spacing.5'},medium:{width:'spacing.6',height:'spacing.6'}}}};var switchColors={track:{default:{background:{checked:'colors.brand.primary.500',unchecked:'colors.brand.gray.500.lowContrast'}},disabled:{background:{checked:'colors.brand.primary.400',unchecked:'colors.brand.gray.a100.lowContrast'}}},thumb:{default:{background:'colors.brand.gray.700.highContrast'},disabled:{background:'colors.brand.gray.200.lowContrast'}},thumbIcon:{default:{fill:'colors.brand.gray.200.highContrast'},disabled:{fill:'colors.surface.text.placeholder.lowContrast'}}};var switchMotion={easing:{thumb:'motion.easing.standard.effective',thumbIcon:'motion.easing.standard.effective',track:'motion.easing.standard.effective'},duration:{thumb:'motion.duration.xquick',thumbIcon:'motion.duration.xquick',track:'motion.duration.xquick'}};var switchHoverTokens={default:{background:{checked:'colors.brand.primary.600',unchecked:'colors.brand.gray.600.lowContrast'}}};
+var switchSizes={track:{desktop:{small:{width:size[28],height:'spacing.5'},medium:{width:size[36],height:'spacing.6'}},mobile:{small:{width:size[36],height:'spacing.6'},medium:{width:size[44],height:'spacing.7'}}},thumb:{desktop:{small:{width:'spacing.4',height:'spacing.4'},medium:{width:'spacing.5',height:'spacing.5'}},mobile:{small:{width:'spacing.5',height:'spacing.5'},medium:{width:'spacing.6',height:'spacing.6'}}}};var switchColors={track:{default:{background:{checked:'colors.interactive.background.primary.default',unchecked:'colors.interactive.background.gray.faded'}},disabled:{background:{checked:'colors.interactive.background.primary.faded',unchecked:'colors.interactive.background.gray.disabled'}}},thumb:{default:{background:'colors.interactive.background.staticWhite.default'},disabled:{background:'colors.interactive.background.staticWhite.disabled'}},thumbIcon:{default:{fill:'colors.interactive.icon.staticBlack.normal'},disabled:{fill:'colors.interactive.icon.staticBlack.disabled'}}};var switchMotion={easing:{thumb:'motion.easing.standard.effective',thumbIcon:'motion.easing.standard.effective',track:'motion.easing.standard.effective'},duration:{thumb:'motion.duration.xquick',thumbIcon:'motion.duration.xquick',track:'motion.duration.xquick'}};var switchHoverTokens={default:{background:{checked:'colors.interactive.background.primary.highlighted',unchecked:'colors.interactive.background.gray.fadedHighlighted'}}};
 
 export { switchColors, switchHoverTokens, switchMotion, switchSizes };
 //# sourceMappingURL=switchTokens.js.map

package/build/lib/native/components/Switch/switchTokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"switchTokens.js","sources":["../../../../../src/components/Switch/switchTokens.ts"],"sourcesContent":["import type { Theme } from '~components/BladeProvider';\nimport type { SelectorInputHoverTokens } from '~components/Form/Selector/types';\nimport type { DurationString, EasingString } from '~tokens/global/motion';\nimport { size } from '~tokens/global';\nimport type { DotNotationColorStringToken } from '~utils/types';\n\ntype ColorTokens = `colors.${DotNotationColorStringToken<Theme['colors']>}` | 'transparent';\ntype State = {\n  checked: ColorTokens;\n  unchecked: ColorTokens;\n};\ntype SwitchColors = {\n  track: Record<'default' | 'disabled', Record<string, State>>;\n  thumb: Record<'default' | 'disabled', Record<string, ColorTokens>>;\n  thumbIcon: Record<'default' | 'disabled', Record<string, ColorTokens>>;\n};\n\nconst switchSizes = {\n  track: {\n    desktop: {\n      small: {\n        width: size[28],\n        height: 'spacing.5',\n      },\n      medium: {\n        width: size[36],\n        height: 'spacing.6',\n      },\n    },\n    mobile: {\n      small: {\n        width: size[36],\n        height: 'spacing.6',\n      },\n      medium: {\n        width: size[44],\n        height: 'spacing.7',\n      },\n    },\n  },\n  thumb: {\n    desktop: {\n      small: {\n        width: 'spacing.4',\n        height: 'spacing.4',\n      },\n      medium: {\n        width: 'spacing.5',\n        height: 'spacing.5',\n      },\n    },\n    mobile: {\n      small: {\n        width: 'spacing.5',\n        height: 'spacing.5',\n      },\n      medium: {\n        width: 'spacing.6',\n        height: 'spacing.6',\n      },\n    },\n  },\n} as const;\n\nconst switchColors: SwitchColors = {\n  track: {\n    default: {\n      background: {\n        checked: 'colors.brand.primary.500',\n        unchecked: 'colors.brand.gray.500.lowContrast',\n      },\n    },\n    disabled: {\n      background: {\n        checked: 'colors.brand.primary.400',\n        unchecked: 'colors.brand.gray.a100.lowContrast',\n      },\n    },\n  },\n  thumb: {\n    default: {\n      background: 'colors.brand.gray.700.highContrast',\n    },\n    disabled: {\n      background: 'colors.brand.gray.200.lowContrast',\n    },\n  },\n  thumbIcon: {\n    default: {\n      fill: 'colors.brand.gray.200.highContrast',\n    },\n    disabled: {\n      fill: 'colors.surface.text.placeholder.lowContrast',\n    },\n  },\n};\n\nconst switchMotion: Record<string, Record<string, `motion.${EasingString | DurationString}`>> = {\n  easing: {\n    thumb: 'motion.easing.standard.effective',\n    thumbIcon: 'motion.easing.standard.effective',\n    track: 'motion.easing.standard.effective',\n  },\n  duration: {\n    thumb: 'motion.duration.xquick',\n    thumbIcon: 'motion.duration.xquick',\n    track: 'motion.duration.xquick',\n  },\n};\n\nconst switchHoverTokens: SelectorInputHoverTokens = {\n  default: {\n    background: {\n      checked: 'colors.brand.primary.600',\n      unchecked: 'colors.brand.gray.600.lowContrast',\n    },\n  },\n};\n\nexport { switchColors, switchSizes, switchHoverTokens, switchMotion };\n"],"names":["switchSizes","track","desktop","small","width","size","height","medium","mobile","thumb","switchColors","default","background","checked","unchecked","disabled","thumbIcon","fill","switchMotion","easing","duration","switchHoverTokens"],"mappings":";;;;AAiBM,IAAAA,WAAW,CAAG,CAClBC,KAAK,CAAE,CACLC,OAAO,CAAE,CACPC,KAAK,CAAE,CACLC,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAE,WACV,CAAC,CACDC,MAAM,CAAE,CACNH,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAE,WACV,CACF,CAAC,CACDE,MAAM,CAAE,CACNL,KAAK,CAAE,CACLC,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAE,WACV,CAAC,CACDC,MAAM,CAAE,CACNH,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAE,WACV,CACF,CACF,CAAC,CACDG,KAAK,CAAE,CACLP,OAAO,CAAE,CACPC,KAAK,CAAE,CACLC,KAAK,CAAE,WAAW,CAClBE,MAAM,CAAE,WACV,CAAC,CACDC,MAAM,CAAE,CACNH,KAAK,CAAE,WAAW,CAClBE,MAAM,CAAE,WACV,CACF,CAAC,CACDE,MAAM,CAAE,CACNL,KAAK,CAAE,CACLC,KAAK,CAAE,WAAW,CAClBE,MAAM,CAAE,WACV,CAAC,CACDC,MAAM,CAAE,CACNH,KAAK,CAAE,WAAW,CAClBE,MAAM,CAAE,WACV,CACF,CACF,CACF,EAEM,IAAAI,YAA0B,CAAG,CACjCT,KAAK,CAAE,CACLU,OAAO,CAAE,CACPC,UAAU,CAAE,CACVC,OAAO,CAAE,0BAA0B,CACnCC,SAAS,CAAE,mCACb,CACF,CAAC,CACDC,QAAQ,CAAE,CACRH,UAAU,CAAE,CACVC,OAAO,CAAE,0BAA0B,CACnCC,SAAS,CAAE,oCACb,CACF,CACF,CAAC,CACDL,KAAK,CAAE,CACLE,OAAO,CAAE,CACPC,UAAU,CAAE,oCACd,CAAC,CACDG,QAAQ,CAAE,CACRH,UAAU,CAAE,mCACd,CACF,CAAC,CACDI,SAAS,CAAE,CACTL,OAAO,CAAE,CACPM,IAAI,CAAE,oCACR,CAAC,CACDF,QAAQ,CAAE,CACRE,IAAI,CAAE,6CACR,CACF,CACF,EAEM,IAAAC,YAAuF,CAAG,CAC9FC,MAAM,CAAE,CACNV,KAAK,CAAE,kCAAkC,CACzCO,SAAS,CAAE,kCAAkC,CAC7Cf,KAAK,CAAE,kCACT,CAAC,CACDmB,QAAQ,CAAE,CACRX,KAAK,CAAE,wBAAwB,CAC/BO,SAAS,CAAE,wBAAwB,CACnCf,KAAK,CAAE,wBACT,CACF,EAEM,IAAAoB,iBAA2C,CAAG,CAClDV,OAAO,CAAE,CACPC,UAAU,CAAE,CACVC,OAAO,CAAE,0BAA0B,CACnCC,SAAS,CAAE,mCACb,CACF,CACF;;;;"}
+{"version":3,"file":"switchTokens.js","sources":["../../../../../src/components/Switch/switchTokens.ts"],"sourcesContent":["import { size } from '~tokens/global';\n\nconst switchSizes = {\n  track: {\n    desktop: {\n      small: {\n        width: size[28],\n        height: 'spacing.5',\n      },\n      medium: {\n        width: size[36],\n        height: 'spacing.6',\n      },\n    },\n    mobile: {\n      small: {\n        width: size[36],\n        height: 'spacing.6',\n      },\n      medium: {\n        width: size[44],\n        height: 'spacing.7',\n      },\n    },\n  },\n  thumb: {\n    desktop: {\n      small: {\n        width: 'spacing.4',\n        height: 'spacing.4',\n      },\n      medium: {\n        width: 'spacing.5',\n        height: 'spacing.5',\n      },\n    },\n    mobile: {\n      small: {\n        width: 'spacing.5',\n        height: 'spacing.5',\n      },\n      medium: {\n        width: 'spacing.6',\n        height: 'spacing.6',\n      },\n    },\n  },\n} as const;\n\nconst switchColors = {\n  track: {\n    default: {\n      background: {\n        checked: 'colors.interactive.background.primary.default',\n        unchecked: 'colors.interactive.background.gray.faded',\n      },\n    },\n    disabled: {\n      background: {\n        checked: 'colors.interactive.background.primary.faded',\n        unchecked: 'colors.interactive.background.gray.disabled',\n      },\n    },\n  },\n  thumb: {\n    default: {\n      background: 'colors.interactive.background.staticWhite.default',\n    },\n    disabled: {\n      background: 'colors.interactive.background.staticWhite.disabled',\n    },\n  },\n  thumbIcon: {\n    default: {\n      fill: 'colors.interactive.icon.staticBlack.normal',\n    },\n    disabled: {\n      fill: 'colors.interactive.icon.staticBlack.disabled',\n    },\n  },\n} as const;\n\nconst switchMotion = {\n  easing: {\n    thumb: 'motion.easing.standard.effective',\n    thumbIcon: 'motion.easing.standard.effective',\n    track: 'motion.easing.standard.effective',\n  },\n  duration: {\n    thumb: 'motion.duration.xquick',\n    thumbIcon: 'motion.duration.xquick',\n    track: 'motion.duration.xquick',\n  },\n} as const;\n\nconst switchHoverTokens = {\n  default: {\n    background: {\n      checked: 'colors.interactive.background.primary.highlighted',\n      unchecked: 'colors.interactive.background.gray.fadedHighlighted',\n    },\n  },\n} as const;\n\nexport { switchColors, switchSizes, switchHoverTokens, switchMotion };\n"],"names":["switchSizes","track","desktop","small","width","size","height","medium","mobile","thumb","switchColors","default","background","checked","unchecked","disabled","thumbIcon","fill","switchMotion","easing","duration","switchHoverTokens"],"mappings":";;;;AAEM,IAAAA,WAAW,CAAG,CAClBC,KAAK,CAAE,CACLC,OAAO,CAAE,CACPC,KAAK,CAAE,CACLC,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAE,WACV,CAAC,CACDC,MAAM,CAAE,CACNH,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAE,WACV,CACF,CAAC,CACDE,MAAM,CAAE,CACNL,KAAK,CAAE,CACLC,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAE,WACV,CAAC,CACDC,MAAM,CAAE,CACNH,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAE,WACV,CACF,CACF,CAAC,CACDG,KAAK,CAAE,CACLP,OAAO,CAAE,CACPC,KAAK,CAAE,CACLC,KAAK,CAAE,WAAW,CAClBE,MAAM,CAAE,WACV,CAAC,CACDC,MAAM,CAAE,CACNH,KAAK,CAAE,WAAW,CAClBE,MAAM,CAAE,WACV,CACF,CAAC,CACDE,MAAM,CAAE,CACNL,KAAK,CAAE,CACLC,KAAK,CAAE,WAAW,CAClBE,MAAM,CAAE,WACV,CAAC,CACDC,MAAM,CAAE,CACNH,KAAK,CAAE,WAAW,CAClBE,MAAM,CAAE,WACV,CACF,CACF,CACF,EAEM,IAAAI,YAAY,CAAG,CACnBT,KAAK,CAAE,CACLU,OAAO,CAAE,CACPC,UAAU,CAAE,CACVC,OAAO,CAAE,+CAA+C,CACxDC,SAAS,CAAE,0CACb,CACF,CAAC,CACDC,QAAQ,CAAE,CACRH,UAAU,CAAE,CACVC,OAAO,CAAE,6CAA6C,CACtDC,SAAS,CAAE,6CACb,CACF,CACF,CAAC,CACDL,KAAK,CAAE,CACLE,OAAO,CAAE,CACPC,UAAU,CAAE,mDACd,CAAC,CACDG,QAAQ,CAAE,CACRH,UAAU,CAAE,oDACd,CACF,CAAC,CACDI,SAAS,CAAE,CACTL,OAAO,CAAE,CACPM,IAAI,CAAE,4CACR,CAAC,CACDF,QAAQ,CAAE,CACRE,IAAI,CAAE,8CACR,CACF,CACF,EAEM,IAAAC,YAAY,CAAG,CACnBC,MAAM,CAAE,CACNV,KAAK,CAAE,kCAAkC,CACzCO,SAAS,CAAE,kCAAkC,CAC7Cf,KAAK,CAAE,kCACT,CAAC,CACDmB,QAAQ,CAAE,CACRX,KAAK,CAAE,wBAAwB,CAC/BO,SAAS,CAAE,wBAAwB,CACnCf,KAAK,CAAE,wBACT,CACF,EAEM,IAAAoB,iBAAiB,CAAG,CACxBV,OAAO,CAAE,CACPC,UAAU,CAAE,CACVC,OAAO,CAAE,mDAAmD,CAC5DC,SAAS,CAAE,qDACb,CACF,CACF;;;;"}

package/build/lib/native/components/Tabs/TabIndicator.native.js

@@ -12,7 +12,7 @@ import { jsx } from 'react/jsx-runtime';
 import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.native.js';
 import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
 
-var TabIndicator=function TabIndicator(props){var _useTheme=useTheme(),theme=_useTheme.theme;var _useTabsContext=useTabsContext(),variant=_useTabsContext.variant;var isFilled=variant==='filled';return jsx(TabBarIndicator,Object.assign({},props,metaAttribute({name:MetaConstants.TabIndicator}),{width:"auto",getTabWidth:function getTabWidth(index){if(!isFilled)return props.getTabWidth(index);if(index===props.navigationState.routes.length-1){return props.getTabWidth(index)-theme.spacing[2]*3;}return props.getTabWidth(index);},style:Object.assign({pointerEvents:'none'},isFilled?{height:props.layout.height-theme.border.width.thick-theme.spacing[2]*2,left:theme.spacing[2],bottom:theme.spacing[2],backgroundColor:theme.colors.brand.primary[300],borderRadius:theme.border.radius.small}:{height:theme.border.width.thick,backgroundColor:theme.colors.brand.primary[500]})}));};
+var TabIndicator=function TabIndicator(props){var _useTheme=useTheme(),theme=_useTheme.theme;var _useTabsContext=useTabsContext(),variant=_useTabsContext.variant;var isFilled=variant==='filled';return jsx(TabBarIndicator,Object.assign({},props,metaAttribute({name:MetaConstants.TabIndicator}),{width:"auto",getTabWidth:function getTabWidth(index){if(!isFilled)return props.getTabWidth(index);if(index===props.navigationState.routes.length-1){return props.getTabWidth(index)-theme.spacing[2]*3;}return props.getTabWidth(index);},style:Object.assign({pointerEvents:'none'},isFilled?{height:props.layout.height-theme.border.width.thicker-theme.spacing[2]*2,left:theme.spacing[2],bottom:theme.spacing[2],backgroundColor:theme.colors.interactive.background.primary.faded,borderRadius:theme.border.radius.small}:{height:theme.border.width.thicker,backgroundColor:theme.colors.interactive.border.primary.default})}));};
 
 export { TabIndicator };
 //# sourceMappingURL=TabIndicator.native.js.map

package/build/lib/native/components/Tabs/TabIndicator.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabIndicator.native.js","sources":["../../../../../src/components/Tabs/TabIndicator.native.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React from 'react';\nimport type { TabBarIndicatorProps } from 'react-native-tab-view';\nimport { TabBarIndicator as RNTabBarIndicator } from 'react-native-tab-view';\nimport { useTabsContext } from './TabsContext';\nimport { useTheme } from '~components/BladeProvider';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\n\nconst TabIndicator = (props: TabBarIndicatorProps<any>): React.ReactElement => {\n  const { theme } = useTheme();\n  const { variant } = useTabsContext();\n  const isFilled = variant === 'filled';\n  return (\n    <RNTabBarIndicator\n      {...props}\n      {...metaAttribute({ name: MetaConstants.TabIndicator })}\n      width=\"auto\"\n      getTabWidth={(index) => {\n        if (!isFilled) return props.getTabWidth(index);\n        if (index === props.navigationState.routes.length - 1) {\n          return props.getTabWidth(index) - theme.spacing[2] * 3;\n        }\n        return props.getTabWidth(index);\n      }}\n      style={{\n        pointerEvents: 'none',\n        ...(isFilled\n          ? {\n              height: props.layout.height - theme.border.width.thick - theme.spacing[2] * 2,\n              left: theme.spacing[2],\n              bottom: theme.spacing[2],\n              backgroundColor: theme.colors.brand.primary[300],\n              borderRadius: theme.border.radius.small,\n            }\n          : {\n              height: theme.border.width.thick,\n              backgroundColor: theme.colors.brand.primary[500],\n            }),\n      }}\n    />\n  );\n};\n\nexport { TabIndicator };\n"],"names":["TabIndicator","props","_useTheme","useTheme","theme","_useTabsContext","useTabsContext","variant","isFilled","_jsx","RNTabBarIndicator","Object","assign","metaAttribute","name","MetaConstants","width","getTabWidth","index","navigationState","routes","length","spacing","style","pointerEvents","height","layout","border","thick","left","bottom","backgroundColor","colors","brand","primary","borderRadius","radius","small"],"mappings":";;;;;;;;;;;;;;AAQM,IAAAA,YAAY,CAAG,SAAfA,YAAYA,CAAIC,KAAgC,CAAyB,CAC7E,IAAAC,SAAA,CAAkBC,QAAQ,EAAE,CAApBC,KAAK,CAAAF,SAAA,CAALE,KAAK,CACb,IAAAC,eAAA,CAAoBC,cAAc,EAAE,CAA5BC,OAAO,CAAAF,eAAA,CAAPE,OAAO,CACf,IAAMC,QAAQ,CAAGD,OAAO,GAAK,QAAQ,CACrC,OACEE,GAAA,CAACC,eAAiB,CAAAC,MAAA,CAAAC,MAAA,CACZX,EAAAA,CAAAA,KAAK,CACLY,aAAa,CAAC,CAAEC,IAAI,CAAEC,aAAa,CAACf,YAAa,CAAC,CAAC,CACvDgB,CAAAA,KAAK,CAAC,MAAM,CACZC,WAAW,CAAE,SAAAA,WAAAA,CAACC,KAAK,CAAK,CACtB,GAAI,CAACV,QAAQ,CAAE,OAAOP,KAAK,CAACgB,WAAW,CAACC,KAAK,CAAC,CAC9C,GAAIA,KAAK,GAAKjB,KAAK,CAACkB,eAAe,CAACC,MAAM,CAACC,MAAM,CAAG,CAAC,CAAE,CACrD,OAAOpB,KAAK,CAACgB,WAAW,CAACC,KAAK,CAAC,CAAGd,KAAK,CAACkB,OAAO,CAAC,CAAC,CAAC,CAAG,CAAC,CACxD,CACA,OAAOrB,KAAK,CAACgB,WAAW,CAACC,KAAK,CAAC,CACjC,CAAE,CACFK,KAAK,CAAAZ,MAAA,CAAAC,MAAA,EACHY,aAAa,CAAE,MAAM,CAAA,CACjBhB,QAAQ,CACR,CACEiB,MAAM,CAAExB,KAAK,CAACyB,MAAM,CAACD,MAAM,CAAGrB,KAAK,CAACuB,MAAM,CAACX,KAAK,CAACY,KAAK,CAAGxB,KAAK,CAACkB,OAAO,CAAC,CAAC,CAAC,CAAG,CAAC,CAC7EO,IAAI,CAAEzB,KAAK,CAACkB,OAAO,CAAC,CAAC,CAAC,CACtBQ,MAAM,CAAE1B,KAAK,CAACkB,OAAO,CAAC,CAAC,CAAC,CACxBS,eAAe,CAAE3B,KAAK,CAAC4B,MAAM,CAACC,KAAK,CAACC,OAAO,CAAC,GAAG,CAAC,CAChDC,YAAY,CAAE/B,KAAK,CAACuB,MAAM,CAACS,MAAM,CAACC,KACpC,CAAC,CACD,CACEZ,MAAM,CAAErB,KAAK,CAACuB,MAAM,CAACX,KAAK,CAACY,KAAK,CAChCG,eAAe,CAAE3B,KAAK,CAAC4B,MAAM,CAACC,KAAK,CAACC,OAAO,CAAC,GAAG,CACjD,CAAC,CACL,CAAA,CACH,CAAC,CAEN;;;;"}
+{"version":3,"file":"TabIndicator.native.js","sources":["../../../../../src/components/Tabs/TabIndicator.native.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React from 'react';\nimport type { TabBarIndicatorProps } from 'react-native-tab-view';\nimport { TabBarIndicator as RNTabBarIndicator } from 'react-native-tab-view';\nimport { useTabsContext } from './TabsContext';\nimport { useTheme } from '~components/BladeProvider';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\n\nconst TabIndicator = (props: TabBarIndicatorProps<any>): React.ReactElement => {\n  const { theme } = useTheme();\n  const { variant } = useTabsContext();\n  const isFilled = variant === 'filled';\n  return (\n    <RNTabBarIndicator\n      {...props}\n      {...metaAttribute({ name: MetaConstants.TabIndicator })}\n      width=\"auto\"\n      getTabWidth={(index) => {\n        if (!isFilled) return props.getTabWidth(index);\n        if (index === props.navigationState.routes.length - 1) {\n          return props.getTabWidth(index) - theme.spacing[2] * 3;\n        }\n        return props.getTabWidth(index);\n      }}\n      style={{\n        pointerEvents: 'none',\n        ...(isFilled\n          ? {\n              height: props.layout.height - theme.border.width.thicker - theme.spacing[2] * 2,\n              left: theme.spacing[2],\n              bottom: theme.spacing[2],\n              backgroundColor: theme.colors.interactive.background.primary.faded,\n              borderRadius: theme.border.radius.small,\n            }\n          : {\n              height: theme.border.width.thicker,\n              backgroundColor: theme.colors.interactive.border.primary.default,\n            }),\n      }}\n    />\n  );\n};\n\nexport { TabIndicator };\n"],"names":["TabIndicator","props","_useTheme","useTheme","theme","_useTabsContext","useTabsContext","variant","isFilled","_jsx","RNTabBarIndicator","Object","assign","metaAttribute","name","MetaConstants","width","getTabWidth","index","navigationState","routes","length","spacing","style","pointerEvents","height","layout","border","thicker","left","bottom","backgroundColor","colors","interactive","background","primary","faded","borderRadius","radius","small","default"],"mappings":";;;;;;;;;;;;;;AAQM,IAAAA,YAAY,CAAG,SAAfA,YAAYA,CAAIC,KAAgC,CAAyB,CAC7E,IAAAC,SAAA,CAAkBC,QAAQ,EAAE,CAApBC,KAAK,CAAAF,SAAA,CAALE,KAAK,CACb,IAAAC,eAAA,CAAoBC,cAAc,EAAE,CAA5BC,OAAO,CAAAF,eAAA,CAAPE,OAAO,CACf,IAAMC,QAAQ,CAAGD,OAAO,GAAK,QAAQ,CACrC,OACEE,GAAA,CAACC,eAAiB,CAAAC,MAAA,CAAAC,MAAA,CACZX,EAAAA,CAAAA,KAAK,CACLY,aAAa,CAAC,CAAEC,IAAI,CAAEC,aAAa,CAACf,YAAa,CAAC,CAAC,CACvDgB,CAAAA,KAAK,CAAC,MAAM,CACZC,WAAW,CAAE,SAAAA,WAAAA,CAACC,KAAK,CAAK,CACtB,GAAI,CAACV,QAAQ,CAAE,OAAOP,KAAK,CAACgB,WAAW,CAACC,KAAK,CAAC,CAC9C,GAAIA,KAAK,GAAKjB,KAAK,CAACkB,eAAe,CAACC,MAAM,CAACC,MAAM,CAAG,CAAC,CAAE,CACrD,OAAOpB,KAAK,CAACgB,WAAW,CAACC,KAAK,CAAC,CAAGd,KAAK,CAACkB,OAAO,CAAC,CAAC,CAAC,CAAG,CAAC,CACxD,CACA,OAAOrB,KAAK,CAACgB,WAAW,CAACC,KAAK,CAAC,CACjC,CAAE,CACFK,KAAK,CAAAZ,MAAA,CAAAC,MAAA,CAAA,CACHY,aAAa,CAAE,MAAM,CACjBhB,CAAAA,QAAQ,CACR,CACEiB,MAAM,CAAExB,KAAK,CAACyB,MAAM,CAACD,MAAM,CAAGrB,KAAK,CAACuB,MAAM,CAACX,KAAK,CAACY,OAAO,CAAGxB,KAAK,CAACkB,OAAO,CAAC,CAAC,CAAC,CAAG,CAAC,CAC/EO,IAAI,CAAEzB,KAAK,CAACkB,OAAO,CAAC,CAAC,CAAC,CACtBQ,MAAM,CAAE1B,KAAK,CAACkB,OAAO,CAAC,CAAC,CAAC,CACxBS,eAAe,CAAE3B,KAAK,CAAC4B,MAAM,CAACC,WAAW,CAACC,UAAU,CAACC,OAAO,CAACC,KAAK,CAClEC,YAAY,CAAEjC,KAAK,CAACuB,MAAM,CAACW,MAAM,CAACC,KACpC,CAAC,CACD,CACEd,MAAM,CAAErB,KAAK,CAACuB,MAAM,CAACX,KAAK,CAACY,OAAO,CAClCG,eAAe,CAAE3B,KAAK,CAAC4B,MAAM,CAACC,WAAW,CAACN,MAAM,CAACQ,OAAO,CAACK,OAC3D,CAAC,CACL,CAAA,CACH,CAAC,CAEN;;;;"}

package/build/lib/native/components/Tabs/Tabs.native.js

@@ -5,13 +5,14 @@ import { TabBar, TabView } from 'react-native-tab-view';
 import { Dimensions } from 'react-native';
 import { TabsContext } from './TabsContext.js';
 import { StyledTabButton } from './TabItem.native.js';
-import { textColor } from './tabTokens.js';
+import { iconColor, textColor, trackColor } from './tabTokens.js';
 import { useTabsItemPropRestriction, iconSizeMap } from './utils.js';
 import { TabIndicator } from './TabIndicator.native.js';
 import { SafeSceneMap } from './SafeSceneMap.native.js';
 import { getComponentId } from '../../utils/isValidAllowedChildren/isValidAllowedChildren.js';
 import '@babel/runtime/helpers/objectWithoutProperties';
 import '../Typography/BaseText/BaseText.native.js';
+import getIn from '../../utils/lodashButBetter/get.js';
 import '../../tokens/global/typography.js';
 import '../../tokens/global/motion.js';
 import useTheme from '../BladeProvider/useTheme.js';
@@ -28,7 +29,7 @@ import { Divider } from '../Divider/Divider.js';
 import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.native.js';
 import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
 
-var initialLayout={height:0,width:Dimensions.get('window').width};var getTabs=function getTabs(node){var children=React__default.Children.toArray(node);var tabList=children.find(function(child){return getComponentId(child)==='TabList';});if(!tabList||!React__default.isValidElement(tabList)){throw new Error('TabList is required');}return tabList.props.children;};var getTabPanels=function getTabPanels(node){var children=React__default.Children.toArray(node);return children.filter(function(child){return getComponentId(child)==='TabPanel';}).reduce(function(prev,curr){return Object.assign({},prev,_defineProperty({},curr.props.value,function(){return curr.props.children;}));},{});};var getRoutes=function getRoutes(tabs){return tabs.map(function(TabComponent,index){return {index:index,title:TabComponent.props.children,key:TabComponent.props.value,value:TabComponent.props.value,leading:TabComponent.props.leading,trailing:TabComponent.props.trailing};});};var getRouteIndexFromValue=function getRouteIndexFromValue(_ref){var value=_ref.value,routes=_ref.routes;return routes.findIndex(function(route){return route.value===value;});};var getRouteValueFromIndex=function getRouteValueFromIndex(_ref2){var _routes$find;var index=_ref2.index,routes=_ref2.routes;return (_routes$find=routes.find(function(route){return route.index===index;}))==null?void 0:_routes$find.value;};var Tabs=function Tabs(_ref3){var children=_ref3.children,defaultValue=_ref3.defaultValue,value=_ref3.value,_onChange=_ref3.onChange,_ref3$size=_ref3.size,size=_ref3$size===void 0?'medium':_ref3$size,_ref3$variant=_ref3.variant,variant=_ref3$variant===void 0?'bordered':_ref3$variant,_ref3$isFullWidthTabI=_ref3.isFullWidthTabItem,isFullWidthTabItem=_ref3$isFullWidthTabI===void 0?false:_ref3$isFullWidthTabI,_ref3$isLazy=_ref3.isLazy,isLazy=_ref3$isLazy===void 0?false:_ref3$isLazy;var _useTheme=useTheme(),theme=_useTheme.theme;var tabs=getTabs(children);var panels=getTabPanels(children);var routes=getRoutes(tabs);var isFilled=variant==='filled';var _useControllableState=useControllableState({defaultValue:defaultValue,value:value,onChange:function onChange(value){_onChange==null?void 0:_onChange(value);}}),_useControllableState2=_slicedToArray(_useControllableState,2),selectedValue=_useControllableState2[0],setSelectedValue=_useControllableState2[1];var routeIndex=getRouteIndexFromValue({value:selectedValue,routes:routes});var setIndex=React__default.useCallback(function(index){var skipUpdate=arguments.length>1&&arguments[1]!==undefined?arguments[1]:false;var value=getRouteValueFromIndex({index:index,routes:routes});setSelectedValue(function(){return value;},skipUpdate);},[routes,setSelectedValue]);var isVertical=false;var contextValue={baseId:'',selectedValue:selectedValue,isVertical:isVertical,size:size,variant:variant,isFullWidthTabItem:isFullWidthTabItem};React__default.useLayoutEffect(function(){if(selectedValue)return;setIndex(0,true);},[selectedValue,setIndex]);var renderTabLabel=React__default.useCallback(function(_ref4){var route=_ref4.route,focused=_ref4.focused;var title=route.title,Leading=route.leading,trailing=route.trailing;var selectedState=focused?'selected':'unselected';var validatedTrailingComponent=useTabsItemPropRestriction(trailing,size);return jsx(StyledTabButton,Object.assign({size:size,variant:variant,isFullWidthTabItem:!isFullWidthTabItem&&!isFilled},metaAttribute({name:MetaConstants.TabItem}),{children:jsxs(Box,{display:"flex",alignItems:"center",flexDirection:"row",gap:"spacing.3",children:[Leading?jsx(Leading,{size:iconSizeMap[size],color:selectedState==='selected'?'brand.primary.500':'surface.action.icon.default.lowContrast'}):null,jsx(Text,{color:textColor[selectedState].default,size:size==='medium'?'medium':'large',weight:"bold",children:title}),validatedTrailingComponent]})}));},[isFullWidthTabItem,isFilled,size,variant]);var renderTabBar=React__default.useCallback(function(props){return jsx(TabBar,Object.assign({},props,metaAttribute({name:MetaConstants.TabList}),{gap:0,android_ripple:{borderless:true,color:'transparent'},scrollEnabled:!isFullWidthTabItem&&!isFilled,tabStyle:{padding:0,margin:0,minHeight:0},style:Object.assign({},isFilled?{shadowOpacity:0,shadowColor:'transparent',borderRadius:theme.border.radius.small,borderWidth:theme.border.width.thick,borderColor:theme.colors.surface.border.normal.lowContrast,backgroundColor:theme.colors.surface.background.level2.lowContrast,padding:theme.spacing[2]}:Object.assign({shadowOpacity:0,shadowColor:'transparent',backgroundColor:'transparent'},variant!=='borderless'&&{borderBottomColor:theme.colors.surface.border.normal.lowContrast,borderBottomWidth:theme.border.width.thin})),renderIndicator:TabIndicator,renderLabel:renderTabLabel,renderBadge:function renderBadge(){if(!isFilled)return null;if(routeIndex===0){return null;}return jsx(Divider,{left:"1px",height:"20px",variant:"normal",orientation:"vertical",top:size==='large'?'6px':'4px'});}}));},[isFullWidthTabItem,isFilled,renderTabLabel]);return jsx(TabsContext.Provider,{value:contextValue,children:jsx(TabView,{navigationState:{index:routeIndex,routes:routes},renderScene:SafeSceneMap(panels),renderTabBar:renderTabBar,onIndexChange:function onIndexChange(idx){setIndex(idx);},initialLayout:initialLayout,lazy:isLazy})});};
+var initialLayout={height:0,width:Dimensions.get('window').width};var getTabs=function getTabs(node){var children=React__default.Children.toArray(node);var tabList=children.find(function(child){return getComponentId(child)==='TabList';});if(!tabList||!React__default.isValidElement(tabList)){throw new Error('TabList is required');}return tabList.props.children;};var getTabPanels=function getTabPanels(node){var children=React__default.Children.toArray(node);return children.filter(function(child){return getComponentId(child)==='TabPanel';}).reduce(function(prev,curr){return Object.assign({},prev,_defineProperty({},curr.props.value,function(){return curr.props.children;}));},{});};var getRoutes=function getRoutes(tabs){return tabs.map(function(TabComponent,index){return {index:index,title:TabComponent.props.children,key:TabComponent.props.value,value:TabComponent.props.value,leading:TabComponent.props.leading,trailing:TabComponent.props.trailing};});};var getRouteIndexFromValue=function getRouteIndexFromValue(_ref){var value=_ref.value,routes=_ref.routes;return routes.findIndex(function(route){return route.value===value;});};var getRouteValueFromIndex=function getRouteValueFromIndex(_ref2){var _routes$find;var index=_ref2.index,routes=_ref2.routes;return (_routes$find=routes.find(function(route){return route.index===index;}))==null?void 0:_routes$find.value;};var Tabs=function Tabs(_ref3){var children=_ref3.children,defaultValue=_ref3.defaultValue,value=_ref3.value,_onChange=_ref3.onChange,_ref3$size=_ref3.size,size=_ref3$size===void 0?'medium':_ref3$size,_ref3$variant=_ref3.variant,variant=_ref3$variant===void 0?'bordered':_ref3$variant,_ref3$isFullWidthTabI=_ref3.isFullWidthTabItem,isFullWidthTabItem=_ref3$isFullWidthTabI===void 0?false:_ref3$isFullWidthTabI,_ref3$isLazy=_ref3.isLazy,isLazy=_ref3$isLazy===void 0?false:_ref3$isLazy;var _useTheme=useTheme(),theme=_useTheme.theme;var tabs=getTabs(children);var panels=getTabPanels(children);var routes=getRoutes(tabs);var isFilled=variant==='filled';var _useControllableState=useControllableState({defaultValue:defaultValue,value:value,onChange:function onChange(value){_onChange==null?void 0:_onChange(value);}}),_useControllableState2=_slicedToArray(_useControllableState,2),selectedValue=_useControllableState2[0],setSelectedValue=_useControllableState2[1];var routeIndex=getRouteIndexFromValue({value:selectedValue,routes:routes});var setIndex=React__default.useCallback(function(index){var skipUpdate=arguments.length>1&&arguments[1]!==undefined?arguments[1]:false;var value=getRouteValueFromIndex({index:index,routes:routes});setSelectedValue(function(){return value;},skipUpdate);},[routes,setSelectedValue]);var isVertical=false;var contextValue={baseId:'',selectedValue:selectedValue,isVertical:isVertical,size:size,variant:variant,isFullWidthTabItem:isFullWidthTabItem};React__default.useLayoutEffect(function(){if(selectedValue)return;setIndex(0,true);},[selectedValue,setIndex]);var renderTabLabel=React__default.useCallback(function(_ref4){var route=_ref4.route,focused=_ref4.focused;var title=route.title,Leading=route.leading,trailing=route.trailing;var selectedState=focused?'selected':'unselected';var validatedTrailingComponent=useTabsItemPropRestriction(trailing,size);return jsx(StyledTabButton,Object.assign({size:size,variant:variant,isFullWidthTabItem:!isFullWidthTabItem&&!isFilled},metaAttribute({name:MetaConstants.TabItem}),{children:jsxs(Box,{display:"flex",alignItems:"center",flexDirection:"row",gap:"spacing.3",children:[Leading?jsx(Leading,{size:iconSizeMap[size],color:iconColor[selectedState].default}):null,jsx(Text,{color:textColor[selectedState].default,size:size==='medium'?'medium':'large',weight:"semibold",children:title}),validatedTrailingComponent]})}));},[isFullWidthTabItem,isFilled,size,variant]);var renderTabBar=React__default.useCallback(function(props){return jsx(TabBar,Object.assign({},props,metaAttribute({name:MetaConstants.TabList}),{gap:0,android_ripple:{borderless:true,color:'transparent'},scrollEnabled:!isFullWidthTabItem&&!isFilled,tabStyle:{padding:0,margin:0,minHeight:0},style:Object.assign({},isFilled?{shadowOpacity:0,shadowColor:'transparent',borderRadius:theme.border.radius.small,borderWidth:theme.border.width.thick,borderColor:theme.colors.interactive.border.gray.faded,backgroundColor:theme.colors.surface.background.gray.intense,padding:theme.spacing[2]}:Object.assign({shadowOpacity:0,shadowColor:'transparent',backgroundColor:'transparent'},variant!=='borderless'&&{borderBottomColor:getIn(theme.colors,trackColor),borderBottomWidth:theme.border.width.thin})),renderIndicator:TabIndicator,renderLabel:renderTabLabel,renderBadge:function renderBadge(){if(!isFilled)return null;if(routeIndex===0){return null;}return jsx(Divider,{left:"1px",height:"20px",variant:"normal",orientation:"vertical",top:size==='large'?'6px':'4px'});}}));},[isFullWidthTabItem,isFilled,renderTabLabel]);return jsx(TabsContext.Provider,{value:contextValue,children:jsx(TabView,{navigationState:{index:routeIndex,routes:routes},renderScene:SafeSceneMap(panels),renderTabBar:renderTabBar,onIndexChange:function onIndexChange(idx){setIndex(idx);},initialLayout:initialLayout,lazy:isLazy})});};
 
 export { Tabs };
 //# sourceMappingURL=Tabs.native.js.map