@razorpay/blade 12.12.0 → 12.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/lib/native/components/Box/Box.js +1 -1
- package/build/lib/native/components/Box/Box.js.map +1 -1
- package/build/lib/native/components/Button/BaseButton/BaseButton.js +1 -1
- package/build/lib/native/components/Button/BaseButton/BaseButton.js.map +1 -1
- package/build/lib/native/components/Chip/Chip.js +1 -1
- package/build/lib/native/components/Chip/Chip.js.map +1 -1
- package/build/lib/native/components/Chip/ChipGroup.js +1 -1
- package/build/lib/native/components/Chip/ChipGroup.js.map +1 -1
- package/build/lib/native/components/Icons/DragHandleIcon/DragHandleIcon.js +12 -0
- package/build/lib/native/components/Icons/DragHandleIcon/DragHandleIcon.js.map +1 -0
- package/build/lib/native/components/index.js +1 -0
- package/build/lib/native/components/index.js.map +1 -1
- package/build/lib/web/development/components/Box/Box.js +2 -2
- package/build/lib/web/development/components/Box/Box.js.map +1 -1
- package/build/lib/web/development/components/Button/BaseButton/BaseButton.js +4 -2
- package/build/lib/web/development/components/Button/BaseButton/BaseButton.js.map +1 -1
- package/build/lib/web/development/components/ButtonGroup/StyledButtonGroup.js +24 -16
- package/build/lib/web/development/components/ButtonGroup/StyledButtonGroup.js.map +1 -1
- package/build/lib/web/development/components/Chip/AnimatedChip.web.js +1 -1
- package/build/lib/web/development/components/Chip/AnimatedChip.web.js.map +1 -1
- package/build/lib/web/development/components/Chip/Chip.js +11 -2
- package/build/lib/web/development/components/Chip/Chip.js.map +1 -1
- package/build/lib/web/development/components/Chip/ChipGroup.js +4 -7
- package/build/lib/web/development/components/Chip/ChipGroup.js.map +1 -1
- package/build/lib/web/development/components/Icons/DragHandleIcon/DragHandleIcon.js +39 -0
- package/build/lib/web/development/components/Icons/DragHandleIcon/DragHandleIcon.js.map +1 -0
- package/build/lib/web/development/components/Icons/DragHandleIcon/index.js +2 -0
- package/build/lib/web/development/components/Icons/DragHandleIcon/index.js.map +1 -0
- package/build/lib/web/development/components/Icons/index.js +1 -0
- package/build/lib/web/development/components/Icons/index.js.map +1 -1
- package/build/lib/web/development/components/Tabs/TabItem.web.js +2 -2
- package/build/lib/web/development/components/Tabs/TabItem.web.js.map +1 -1
- package/build/lib/web/development/components/Tabs/TabList.web.js +4 -15
- package/build/lib/web/development/components/Tabs/TabList.web.js.map +1 -1
- package/build/lib/web/development/components/index.js +1 -0
- package/build/lib/web/development/components/index.js.map +1 -1
- package/build/lib/web/production/components/Box/Box.js +2 -2
- package/build/lib/web/production/components/Box/Box.js.map +1 -1
- package/build/lib/web/production/components/Button/BaseButton/BaseButton.js +4 -2
- package/build/lib/web/production/components/Button/BaseButton/BaseButton.js.map +1 -1
- package/build/lib/web/production/components/ButtonGroup/StyledButtonGroup.js +24 -16
- package/build/lib/web/production/components/ButtonGroup/StyledButtonGroup.js.map +1 -1
- package/build/lib/web/production/components/Chip/AnimatedChip.web.js +1 -1
- package/build/lib/web/production/components/Chip/AnimatedChip.web.js.map +1 -1
- package/build/lib/web/production/components/Chip/Chip.js +11 -2
- package/build/lib/web/production/components/Chip/Chip.js.map +1 -1
- package/build/lib/web/production/components/Chip/ChipGroup.js +4 -7
- package/build/lib/web/production/components/Chip/ChipGroup.js.map +1 -1
- package/build/lib/web/production/components/Icons/DragHandleIcon/DragHandleIcon.js +39 -0
- package/build/lib/web/production/components/Icons/DragHandleIcon/DragHandleIcon.js.map +1 -0
- package/build/lib/web/production/components/Icons/DragHandleIcon/index.js +2 -0
- package/build/lib/web/production/components/Icons/DragHandleIcon/index.js.map +1 -0
- package/build/lib/web/production/components/Icons/index.js +1 -0
- package/build/lib/web/production/components/Icons/index.js.map +1 -1
- package/build/lib/web/production/components/Tabs/TabItem.web.js +2 -2
- package/build/lib/web/production/components/Tabs/TabItem.web.js.map +1 -1
- package/build/lib/web/production/components/Tabs/TabList.web.js +4 -15
- package/build/lib/web/production/components/Tabs/TabList.web.js.map +1 -1
- package/build/lib/web/production/components/index.js +1 -0
- package/build/lib/web/production/components/index.js.map +1 -1
- package/build/types/components/index.d.ts +39 -11
- package/build/types/components/index.native.d.ts +39 -11
- package/package.json +1 -1
|
@@ -12,7 +12,7 @@ import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/a
|
|
|
12
12
|
import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
|
|
13
13
|
import { jsx } from 'react/jsx-runtime';
|
|
14
14
|
|
|
15
|
-
var validateBackgroundString=function validateBackgroundString(stringBackgroundColorValue){if(__DEV__){if(!stringBackgroundColorValue.startsWith('surface.background')&&!stringBackgroundColorValue.startsWith('
|
|
15
|
+
var validateBackgroundString=function validateBackgroundString(stringBackgroundColorValue){if(__DEV__){if(!stringBackgroundColorValue.startsWith('surface.background')&&!stringBackgroundColorValue.startsWith('overlay.')&&stringBackgroundColorValue!=='transparent'){throwBladeError({message:`Oops! Currently you can only use \`transparent\`, \`surface.background.*\`, and \`overlay.*\` tokens with backgroundColor property but we received \`${stringBackgroundColorValue}\` instead.\n\n Do you have a usecase of using other values? Create an issue on https://github.com/razorpay/blade repo to let us know and we can discuss ✨`,moduleName:'Box'});}}};var validateBackgroundProp=function validateBackgroundProp(responsiveBackgroundColor){if(__DEV__){if(responsiveBackgroundColor){if(typeof responsiveBackgroundColor==='string'){validateBackgroundString(responsiveBackgroundColor);return;}Object.values(responsiveBackgroundColor).forEach(function(backgroundColor){if(typeof backgroundColor==='string'){validateBackgroundString(backgroundColor);}});}}};var makeBoxProps=function makeBoxProps(props){return {display:props.display,overflow:props.overflow,overflowX:props.overflowX,overflowY:props.overflowY,whiteSpace:props.whiteSpace,height:props.height,minHeight:props.minHeight,maxHeight:props.maxHeight,width:props.width,minWidth:props.minWidth,maxWidth:props.maxWidth,textAlign:props.textAlign,flex:props.flex,flexWrap:props.flexWrap,flexDirection:props.flexDirection,flexGrow:props.flexGrow,flexShrink:props.flexShrink,flexBasis:props.flexBasis,alignItems:props.alignItems,alignContent:props.alignContent,alignSelf:props.alignSelf,justifyItems:props.justifyItems,justifyContent:props.justifyContent,justifySelf:props.justifySelf,placeSelf:props.placeSelf,placeItems:props.placeItems,order:props.order,grid:props.grid,gridColumn:props.gridColumn,gridRow:props.gridRow,gridRowStart:props.gridRowStart,gridRowEnd:props.gridRowEnd,gridColumnStart:props.gridColumnStart,gridColumnEnd:props.gridColumnEnd,gridArea:props.gridArea,gridAutoFlow:props.gridAutoFlow,gridAutoRows:props.gridAutoRows,gridAutoColumns:props.gridAutoColumns,gridTemplate:props.gridTemplate,gridTemplateAreas:props.gridTemplateAreas,gridTemplateColumns:props.gridTemplateColumns,gridTemplateRows:props.gridTemplateRows,padding:props.padding,paddingTop:props.paddingTop,paddingBottom:props.paddingBottom,paddingRight:props.paddingRight,paddingLeft:props.paddingLeft,paddingX:props.paddingX,paddingY:props.paddingY,margin:props.margin,marginBottom:props.marginBottom,marginTop:props.marginTop,marginRight:props.marginRight,marginLeft:props.marginLeft,marginX:props.marginX,marginY:props.marginY,gap:props.gap,rowGap:props.rowGap,columnGap:props.columnGap,position:props.position,zIndex:props.zIndex,top:props.top,right:props.right,bottom:props.bottom,left:props.left,backgroundColor:props.backgroundColor,backgroundImage:props.backgroundImage,backgroundSize:props.backgroundSize,backgroundPosition:props.backgroundPosition,backgroundOrigin:props.backgroundOrigin,backgroundRepeat:props.backgroundRepeat,elevation:props.elevation,opacity:props.opacity,visibility:props.visibility,borderWidth:props.borderWidth,borderColor:props.borderColor,borderStyle:props.borderStyle,borderTopWidth:props.borderTopWidth,borderTopColor:props.borderTopColor,borderTopStyle:props.borderTopStyle,borderRightWidth:props.borderRightWidth,borderRightColor:props.borderRightColor,borderRightStyle:props.borderRightStyle,borderBottomWidth:props.borderBottomWidth,borderBottomColor:props.borderBottomColor,borderBottomStyle:props.borderBottomStyle,borderLeftWidth:props.borderLeftWidth,borderLeftColor:props.borderLeftColor,borderLeftStyle:props.borderLeftStyle,borderRadius:props.borderRadius,borderTopLeftRadius:props.borderTopLeftRadius,borderTopRightRadius:props.borderTopRightRadius,borderBottomRightRadius:props.borderBottomRightRadius,borderBottomLeftRadius:props.borderBottomLeftRadius,transform:props.transform,transformOrigin:props.transformOrigin,clipPath:props.clipPath,onMouseEnter:props.onMouseEnter,onMouseLeave:props.onMouseLeave,onMouseOver:props.onMouseOver,onScroll:props.onScroll,draggable:props.draggable,onDragStart:props.onDragStart,onDragEnd:props.onDragEnd,onDragEnter:props.onDragEnter,onDragLeave:props.onDragLeave,onDragOver:props.onDragOver,onDrop:props.onDrop,pointerEvents:props.pointerEvents,children:props.children,tabIndex:props.tabIndex,as:isReactNative()?undefined:props.as};};var _Box=function _Box(props,ref){React__default.useEffect(function(){if(__DEV__){validateBackgroundProp(props.backgroundColor);}},[props.backgroundColor]);React__default.useEffect(function(){if(__DEV__){if(props.as){if(isReactNative()){throwBladeError({message:'`as` prop is not supported on React Native',moduleName:'Box'});}if(!validBoxAsValues.includes(props.as)){throwBladeError({message:`Invalid \`as\` prop value - ${props.as}. Only ${validBoxAsValues.join(', ')} are valid values`,moduleName:'Box'});}}}},[props.as]);return jsx(BaseBox,Object.assign({ref:ref,id:props.id},metaAttribute({name:MetaConstants.Box,testID:props.testID}),makeBoxProps(props),makeAnalyticsAttribute(props)));};var Box=assignWithoutSideEffects(React__default.forwardRef(_Box),{displayName:'Box',componentId:'Box'});
|
|
16
16
|
|
|
17
17
|
export { Box, makeBoxProps };
|
|
18
18
|
//# sourceMappingURL=Box.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.js","sources":["../../../../../src/components/Box/Box.tsx"],"sourcesContent":["import React from 'react';\nimport BaseBox from './BaseBox';\nimport type { BoxProps, BoxRefType, MakeValueResponsive } from './BaseBox/types';\nimport { validBoxAsValues } from './BaseBox/types/propsTypes';\nimport type { KeysRequired } from '~utils/types';\nimport { isReactNative } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst validateBackgroundString = (stringBackgroundColorValue: string): void => {\n if (__DEV__) {\n if (\n !stringBackgroundColorValue.startsWith('surface.background') &&\n !stringBackgroundColorValue.startsWith('brand.') &&\n !stringBackgroundColorValue.startsWith('overlay.') &&\n stringBackgroundColorValue !== 'transparent'\n ) {\n throwBladeError({\n message: `Oops! Currently you can only use \\`transparent\\`, \\`surface.background.*\\`, \\`overlay.*\\` and \\`brand.*\\` tokens with backgroundColor property but we received \\`${stringBackgroundColorValue}\\` instead.\\n\\n Do you have a usecase of using other values? Create an issue on https://github.com/razorpay/blade repo to let us know and we can discuss ✨`,\n moduleName: 'Box',\n });\n }\n }\n};\n\nconst validateBackgroundProp = (\n responsiveBackgroundColor: MakeValueResponsive<string | undefined>,\n): void => {\n if (__DEV__) {\n if (responsiveBackgroundColor) {\n if (typeof responsiveBackgroundColor === 'string') {\n validateBackgroundString(responsiveBackgroundColor);\n return;\n }\n\n Object.values(responsiveBackgroundColor).forEach((backgroundColor) => {\n if (typeof backgroundColor === 'string') {\n validateBackgroundString(backgroundColor);\n }\n });\n }\n }\n};\n\n/**\n * This function is to filter out any unexpected props passed by the user\n */\nconst makeBoxProps = (\n props: BoxProps,\n): KeysRequired<Omit<BoxProps, 'testID' | 'id' | '__brand__'>> => {\n return {\n // Layout\n display: props.display,\n overflow: props.overflow,\n overflowX: props.overflowX,\n overflowY: props.overflowY,\n whiteSpace: props.whiteSpace,\n height: props.height,\n minHeight: props.minHeight,\n maxHeight: props.maxHeight,\n width: props.width,\n minWidth: props.minWidth,\n maxWidth: props.maxWidth,\n textAlign: props.textAlign,\n\n // Flex\n flex: props.flex,\n flexWrap: props.flexWrap,\n flexDirection: props.flexDirection,\n flexGrow: props.flexGrow,\n flexShrink: props.flexShrink,\n flexBasis: props.flexBasis,\n alignItems: props.alignItems,\n alignContent: props.alignContent,\n alignSelf: props.alignSelf,\n justifyItems: props.justifyItems,\n justifyContent: props.justifyContent,\n justifySelf: props.justifySelf,\n placeSelf: props.placeSelf,\n placeItems: props.placeItems,\n order: props.order,\n\n // Grid\n grid: props.grid,\n gridColumn: props.gridColumn,\n gridRow: props.gridRow,\n gridRowStart: props.gridRowStart,\n gridRowEnd: props.gridRowEnd,\n gridColumnStart: props.gridColumnStart,\n gridColumnEnd: props.gridColumnEnd,\n gridArea: props.gridArea,\n gridAutoFlow: props.gridAutoFlow,\n gridAutoRows: props.gridAutoRows,\n gridAutoColumns: props.gridAutoColumns,\n gridTemplate: props.gridTemplate,\n gridTemplateAreas: props.gridTemplateAreas,\n gridTemplateColumns: props.gridTemplateColumns,\n gridTemplateRows: props.gridTemplateRows,\n\n // Spacing\n padding: props.padding,\n paddingTop: props.paddingTop,\n paddingBottom: props.paddingBottom,\n paddingRight: props.paddingRight,\n paddingLeft: props.paddingLeft,\n paddingX: props.paddingX,\n paddingY: props.paddingY,\n margin: props.margin,\n marginBottom: props.marginBottom,\n marginTop: props.marginTop,\n marginRight: props.marginRight,\n marginLeft: props.marginLeft,\n marginX: props.marginX,\n marginY: props.marginY,\n gap: props.gap,\n rowGap: props.rowGap,\n columnGap: props.columnGap,\n\n // Position\n position: props.position,\n zIndex: props.zIndex,\n top: props.top,\n right: props.right,\n bottom: props.bottom,\n left: props.left,\n\n // Visual\n backgroundColor: props.backgroundColor,\n backgroundImage: props.backgroundImage,\n backgroundSize: props.backgroundSize,\n backgroundPosition: props.backgroundPosition,\n backgroundOrigin: props.backgroundOrigin,\n backgroundRepeat: props.backgroundRepeat,\n elevation: props.elevation,\n opacity: props.opacity,\n visibility: props.visibility,\n\n // Border\n borderWidth: props.borderWidth,\n borderColor: props.borderColor,\n borderStyle: props.borderStyle,\n borderTopWidth: props.borderTopWidth,\n borderTopColor: props.borderTopColor,\n borderTopStyle: props.borderTopStyle,\n borderRightWidth: props.borderRightWidth,\n borderRightColor: props.borderRightColor,\n borderRightStyle: props.borderRightStyle,\n borderBottomWidth: props.borderBottomWidth,\n borderBottomColor: props.borderBottomColor,\n borderBottomStyle: props.borderBottomStyle,\n borderLeftWidth: props.borderLeftWidth,\n borderLeftColor: props.borderLeftColor,\n borderLeftStyle: props.borderLeftStyle,\n borderRadius: props.borderRadius,\n borderTopLeftRadius: props.borderTopLeftRadius,\n borderTopRightRadius: props.borderTopRightRadius,\n borderBottomRightRadius: props.borderBottomRightRadius,\n borderBottomLeftRadius: props.borderBottomLeftRadius,\n\n // Polygon Support\n transform: props.transform,\n transformOrigin: props.transformOrigin,\n clipPath: props.clipPath,\n\n // callbacks\n onMouseEnter: props.onMouseEnter,\n onMouseLeave: props.onMouseLeave,\n onMouseOver: props.onMouseOver,\n onScroll: props.onScroll,\n\n // Drag and Drop\n draggable: props.draggable,\n onDragStart: props.onDragStart,\n onDragEnd: props.onDragEnd,\n onDragEnter: props.onDragEnter,\n onDragLeave: props.onDragLeave,\n onDragOver: props.onDragOver,\n onDrop: props.onDrop,\n\n pointerEvents: props.pointerEvents,\n children: props.children,\n tabIndex: props.tabIndex,\n as: isReactNative() ? undefined : props.as, // as is not supported on react-native\n };\n};\n\n/**\n * ## Box\n * \n * Box is the basic Layout component.\n *\n *\n * Box components supports most spacing CSS properties like `display`, `padding*`, `flex*`, `height`, `width`, etc.\n *\n * Check out {@linkcode BoxProps BoxPropsType} for complete list of props and [Layout RFC](https://github.com/razorpay/blade/blob/master/rfcs/2023-01-06-layout.md) for more details on API decision.\n * \n * ----\n * \n * ### Usage\n * \n * ```jsx\n * <Box display=\"flex\">\n * ```\n\n * #### Responsive Props\n *\n * ```jsx\n * <Box padding={{ base: 'spacing.3', m: 'spacing.10' }} />\n * ```\n * \n * #### Margin and Padding Shorthands\n * \n * ```jsx\n * <Box padding={[\"spacing.3\", \"spacing.10\"]} />\n * ```\n *\n * ---\n * \n * Checkout {@link https://blade.razorpay.com/?path=/docs/components-box Box Documentation}\n * \n */\nconst _Box: React.ForwardRefRenderFunction<BoxRefType, BoxProps> = (props, ref) => {\n React.useEffect(() => {\n if (__DEV__) {\n validateBackgroundProp(props.backgroundColor);\n }\n }, [props.backgroundColor]);\n\n React.useEffect(() => {\n if (__DEV__) {\n if (props.as) {\n if (isReactNative()) {\n throwBladeError({\n message: '`as` prop is not supported on React Native',\n moduleName: 'Box',\n });\n }\n\n if (!validBoxAsValues.includes(props.as)) {\n throwBladeError({\n message: `Invalid \\`as\\` prop value - ${props.as}. Only ${validBoxAsValues.join(\n ', ',\n )} are valid values`,\n moduleName: 'Box',\n });\n }\n }\n }\n }, [props.as]);\n\n return (\n <BaseBox\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref={ref as any}\n id={props.id}\n {...metaAttribute({ name: MetaConstants.Box, testID: props.testID })}\n {...makeBoxProps(props)}\n {...makeAnalyticsAttribute(props)}\n />\n );\n};\n\nconst Box = assignWithoutSideEffects(React.forwardRef(_Box), {\n displayName: 'Box',\n componentId: 'Box',\n});\n\nexport { Box, makeBoxProps };\n"],"names":["validateBackgroundString","stringBackgroundColorValue","__DEV__","startsWith","throwBladeError","message","moduleName","validateBackgroundProp","responsiveBackgroundColor","Object","values","forEach","backgroundColor","makeBoxProps","props","display","overflow","overflowX","overflowY","whiteSpace","height","minHeight","maxHeight","width","minWidth","maxWidth","textAlign","flex","flexWrap","flexDirection","flexGrow","flexShrink","flexBasis","alignItems","alignContent","alignSelf","justifyItems","justifyContent","justifySelf","placeSelf","placeItems","order","grid","gridColumn","gridRow","gridRowStart","gridRowEnd","gridColumnStart","gridColumnEnd","gridArea","gridAutoFlow","gridAutoRows","gridAutoColumns","gridTemplate","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","padding","paddingTop","paddingBottom","paddingRight","paddingLeft","paddingX","paddingY","margin","marginBottom","marginTop","marginRight","marginLeft","marginX","marginY","gap","rowGap","columnGap","position","zIndex","top","right","bottom","left","backgroundImage","backgroundSize","backgroundPosition","backgroundOrigin","backgroundRepeat","elevation","opacity","visibility","borderWidth","borderColor","borderStyle","borderTopWidth","borderTopColor","borderTopStyle","borderRightWidth","borderRightColor","borderRightStyle","borderBottomWidth","borderBottomColor","borderBottomStyle","borderLeftWidth","borderLeftColor","borderLeftStyle","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomRightRadius","borderBottomLeftRadius","transform","transformOrigin","clipPath","onMouseEnter","onMouseLeave","onMouseOver","onScroll","draggable","onDragStart","onDragEnd","onDragEnter","onDragLeave","onDragOver","onDrop","pointerEvents","children","tabIndex","as","isReactNative","undefined","_Box","ref","React","useEffect","validBoxAsValues","includes","join","_jsx","BaseBox","assign","id","metaAttribute","name","MetaConstants","Box","testID","makeAnalyticsAttribute","assignWithoutSideEffects","forwardRef","displayName","componentId"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Box.js","sources":["../../../../../src/components/Box/Box.tsx"],"sourcesContent":["import React from 'react';\nimport BaseBox from './BaseBox';\nimport type { BoxProps, BoxRefType, MakeValueResponsive } from './BaseBox/types';\nimport { validBoxAsValues } from './BaseBox/types/propsTypes';\nimport type { KeysRequired } from '~utils/types';\nimport { isReactNative } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst validateBackgroundString = (stringBackgroundColorValue: string): void => {\n if (__DEV__) {\n if (\n !stringBackgroundColorValue.startsWith('surface.background') &&\n !stringBackgroundColorValue.startsWith('overlay.') &&\n stringBackgroundColorValue !== 'transparent'\n ) {\n throwBladeError({\n message: `Oops! Currently you can only use \\`transparent\\`, \\`surface.background.*\\`, and \\`overlay.*\\` tokens with backgroundColor property but we received \\`${stringBackgroundColorValue}\\` instead.\\n\\n Do you have a usecase of using other values? Create an issue on https://github.com/razorpay/blade repo to let us know and we can discuss ✨`,\n moduleName: 'Box',\n });\n }\n }\n};\n\nconst validateBackgroundProp = (\n responsiveBackgroundColor: MakeValueResponsive<string | undefined>,\n): void => {\n if (__DEV__) {\n if (responsiveBackgroundColor) {\n if (typeof responsiveBackgroundColor === 'string') {\n validateBackgroundString(responsiveBackgroundColor);\n return;\n }\n\n Object.values(responsiveBackgroundColor).forEach((backgroundColor) => {\n if (typeof backgroundColor === 'string') {\n validateBackgroundString(backgroundColor);\n }\n });\n }\n }\n};\n\n/**\n * This function is to filter out any unexpected props passed by the user\n */\nconst makeBoxProps = (\n props: BoxProps,\n): KeysRequired<Omit<BoxProps, 'testID' | 'id' | '__brand__'>> => {\n return {\n // Layout\n display: props.display,\n overflow: props.overflow,\n overflowX: props.overflowX,\n overflowY: props.overflowY,\n whiteSpace: props.whiteSpace,\n height: props.height,\n minHeight: props.minHeight,\n maxHeight: props.maxHeight,\n width: props.width,\n minWidth: props.minWidth,\n maxWidth: props.maxWidth,\n textAlign: props.textAlign,\n\n // Flex\n flex: props.flex,\n flexWrap: props.flexWrap,\n flexDirection: props.flexDirection,\n flexGrow: props.flexGrow,\n flexShrink: props.flexShrink,\n flexBasis: props.flexBasis,\n alignItems: props.alignItems,\n alignContent: props.alignContent,\n alignSelf: props.alignSelf,\n justifyItems: props.justifyItems,\n justifyContent: props.justifyContent,\n justifySelf: props.justifySelf,\n placeSelf: props.placeSelf,\n placeItems: props.placeItems,\n order: props.order,\n\n // Grid\n grid: props.grid,\n gridColumn: props.gridColumn,\n gridRow: props.gridRow,\n gridRowStart: props.gridRowStart,\n gridRowEnd: props.gridRowEnd,\n gridColumnStart: props.gridColumnStart,\n gridColumnEnd: props.gridColumnEnd,\n gridArea: props.gridArea,\n gridAutoFlow: props.gridAutoFlow,\n gridAutoRows: props.gridAutoRows,\n gridAutoColumns: props.gridAutoColumns,\n gridTemplate: props.gridTemplate,\n gridTemplateAreas: props.gridTemplateAreas,\n gridTemplateColumns: props.gridTemplateColumns,\n gridTemplateRows: props.gridTemplateRows,\n\n // Spacing\n padding: props.padding,\n paddingTop: props.paddingTop,\n paddingBottom: props.paddingBottom,\n paddingRight: props.paddingRight,\n paddingLeft: props.paddingLeft,\n paddingX: props.paddingX,\n paddingY: props.paddingY,\n margin: props.margin,\n marginBottom: props.marginBottom,\n marginTop: props.marginTop,\n marginRight: props.marginRight,\n marginLeft: props.marginLeft,\n marginX: props.marginX,\n marginY: props.marginY,\n gap: props.gap,\n rowGap: props.rowGap,\n columnGap: props.columnGap,\n\n // Position\n position: props.position,\n zIndex: props.zIndex,\n top: props.top,\n right: props.right,\n bottom: props.bottom,\n left: props.left,\n\n // Visual\n backgroundColor: props.backgroundColor,\n backgroundImage: props.backgroundImage,\n backgroundSize: props.backgroundSize,\n backgroundPosition: props.backgroundPosition,\n backgroundOrigin: props.backgroundOrigin,\n backgroundRepeat: props.backgroundRepeat,\n elevation: props.elevation,\n opacity: props.opacity,\n visibility: props.visibility,\n\n // Border\n borderWidth: props.borderWidth,\n borderColor: props.borderColor,\n borderStyle: props.borderStyle,\n borderTopWidth: props.borderTopWidth,\n borderTopColor: props.borderTopColor,\n borderTopStyle: props.borderTopStyle,\n borderRightWidth: props.borderRightWidth,\n borderRightColor: props.borderRightColor,\n borderRightStyle: props.borderRightStyle,\n borderBottomWidth: props.borderBottomWidth,\n borderBottomColor: props.borderBottomColor,\n borderBottomStyle: props.borderBottomStyle,\n borderLeftWidth: props.borderLeftWidth,\n borderLeftColor: props.borderLeftColor,\n borderLeftStyle: props.borderLeftStyle,\n borderRadius: props.borderRadius,\n borderTopLeftRadius: props.borderTopLeftRadius,\n borderTopRightRadius: props.borderTopRightRadius,\n borderBottomRightRadius: props.borderBottomRightRadius,\n borderBottomLeftRadius: props.borderBottomLeftRadius,\n\n // Polygon Support\n transform: props.transform,\n transformOrigin: props.transformOrigin,\n clipPath: props.clipPath,\n\n // callbacks\n onMouseEnter: props.onMouseEnter,\n onMouseLeave: props.onMouseLeave,\n onMouseOver: props.onMouseOver,\n onScroll: props.onScroll,\n\n // Drag and Drop\n draggable: props.draggable,\n onDragStart: props.onDragStart,\n onDragEnd: props.onDragEnd,\n onDragEnter: props.onDragEnter,\n onDragLeave: props.onDragLeave,\n onDragOver: props.onDragOver,\n onDrop: props.onDrop,\n\n pointerEvents: props.pointerEvents,\n children: props.children,\n tabIndex: props.tabIndex,\n as: isReactNative() ? undefined : props.as, // as is not supported on react-native\n };\n};\n\n/**\n * ## Box\n * \n * Box is the basic Layout component.\n *\n *\n * Box components supports most spacing CSS properties like `display`, `padding*`, `flex*`, `height`, `width`, etc.\n *\n * Check out {@linkcode BoxProps BoxPropsType} for complete list of props and [Layout RFC](https://github.com/razorpay/blade/blob/master/rfcs/2023-01-06-layout.md) for more details on API decision.\n * \n * ----\n * \n * ### Usage\n * \n * ```jsx\n * <Box display=\"flex\">\n * ```\n\n * #### Responsive Props\n *\n * ```jsx\n * <Box padding={{ base: 'spacing.3', m: 'spacing.10' }} />\n * ```\n * \n * #### Margin and Padding Shorthands\n * \n * ```jsx\n * <Box padding={[\"spacing.3\", \"spacing.10\"]} />\n * ```\n *\n * ---\n * \n * Checkout {@link https://blade.razorpay.com/?path=/docs/components-box Box Documentation}\n * \n */\nconst _Box: React.ForwardRefRenderFunction<BoxRefType, BoxProps> = (props, ref) => {\n React.useEffect(() => {\n if (__DEV__) {\n validateBackgroundProp(props.backgroundColor);\n }\n }, [props.backgroundColor]);\n\n React.useEffect(() => {\n if (__DEV__) {\n if (props.as) {\n if (isReactNative()) {\n throwBladeError({\n message: '`as` prop is not supported on React Native',\n moduleName: 'Box',\n });\n }\n\n if (!validBoxAsValues.includes(props.as)) {\n throwBladeError({\n message: `Invalid \\`as\\` prop value - ${props.as}. Only ${validBoxAsValues.join(\n ', ',\n )} are valid values`,\n moduleName: 'Box',\n });\n }\n }\n }\n }, [props.as]);\n\n return (\n <BaseBox\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref={ref as any}\n id={props.id}\n {...metaAttribute({ name: MetaConstants.Box, testID: props.testID })}\n {...makeBoxProps(props)}\n {...makeAnalyticsAttribute(props)}\n />\n );\n};\n\nconst Box = assignWithoutSideEffects(React.forwardRef(_Box), {\n displayName: 'Box',\n componentId: 'Box',\n});\n\nexport { Box, makeBoxProps };\n"],"names":["validateBackgroundString","stringBackgroundColorValue","__DEV__","startsWith","throwBladeError","message","moduleName","validateBackgroundProp","responsiveBackgroundColor","Object","values","forEach","backgroundColor","makeBoxProps","props","display","overflow","overflowX","overflowY","whiteSpace","height","minHeight","maxHeight","width","minWidth","maxWidth","textAlign","flex","flexWrap","flexDirection","flexGrow","flexShrink","flexBasis","alignItems","alignContent","alignSelf","justifyItems","justifyContent","justifySelf","placeSelf","placeItems","order","grid","gridColumn","gridRow","gridRowStart","gridRowEnd","gridColumnStart","gridColumnEnd","gridArea","gridAutoFlow","gridAutoRows","gridAutoColumns","gridTemplate","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","padding","paddingTop","paddingBottom","paddingRight","paddingLeft","paddingX","paddingY","margin","marginBottom","marginTop","marginRight","marginLeft","marginX","marginY","gap","rowGap","columnGap","position","zIndex","top","right","bottom","left","backgroundImage","backgroundSize","backgroundPosition","backgroundOrigin","backgroundRepeat","elevation","opacity","visibility","borderWidth","borderColor","borderStyle","borderTopWidth","borderTopColor","borderTopStyle","borderRightWidth","borderRightColor","borderRightStyle","borderBottomWidth","borderBottomColor","borderBottomStyle","borderLeftWidth","borderLeftColor","borderLeftStyle","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomRightRadius","borderBottomLeftRadius","transform","transformOrigin","clipPath","onMouseEnter","onMouseLeave","onMouseOver","onScroll","draggable","onDragStart","onDragEnd","onDragEnter","onDragLeave","onDragOver","onDrop","pointerEvents","children","tabIndex","as","isReactNative","undefined","_Box","ref","React","useEffect","validBoxAsValues","includes","join","_jsx","BaseBox","assign","id","metaAttribute","name","MetaConstants","Box","testID","makeAnalyticsAttribute","assignWithoutSideEffects","forwardRef","displayName","componentId"],"mappings":"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"}
|
|
@@ -33,7 +33,7 @@ import { MetaConstants } from '../../../utils/metaAttribute/metaConstants.js';
|
|
|
33
33
|
import { getStringFromReactText } from '../../../utils/getStringChildren/getStringChildren.js';
|
|
34
34
|
import { makeAnalyticsAttribute } from '../../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
|
|
35
35
|
|
|
36
|
-
var _excluded=["href","target","rel","tabIndex","id","variant","color","size","icon","iconPosition","isDisabled","isFullWidth","isLoading","onClick","onBlur","onKeyDown","type","children","testID","onFocus","onMouseLeave","onMouseMove","onMouseDown","onPointerDown","onPointerEnter","accessibilityProps","onTouchEnd","onTouchStart"];var getRenderElement=function getRenderElement(href){if(isReactNative()){return undefined;}if(href){return 'a';}return 'button';};var getBackgroundColorToken=function getBackgroundColorToken(_ref){var property=_ref.property,variant=_ref.variant,state=_ref.state,color=_ref.color;var _state=state==='focus'||state==='hover'?'highlighted':state;var tokens=backgroundColor(property);if(color==='white'){return tokens.white[variant][_state];}if(color&&color!=='primary'){if(variant==='tertiary'){throw new Error(`Tertiary variant can only be used with color: "primary" or "white" but received "${color}"`);}return tokens.color(color)[variant][_state];}return tokens.base[variant][_state];};var getTextColorToken=function getTextColorToken(_ref2){var property=_ref2.property,variant=_ref2.variant,state=_ref2.state,color=_ref2.color;var tokens=textColor(property);var _state=state==='focus'||state==='hover'?'highlighted':state;if(color==='white'){return tokens.white[variant][_state];}if(color&&color!=='primary'){if(variant==='tertiary'){throw new Error(`Tertiary variant can only be used with color: "primary" or "white" but received "${color}"`);}return tokens.color(color)[variant][_state];}return tokens.base[variant][_state];};var getProps=function getProps(_ref3){var buttonTypographyTokens=_ref3.buttonTypographyTokens,childrenString=_ref3.childrenString,isDisabled=_ref3.isDisabled,size=_ref3.size,theme=_ref3.theme,variant=_ref3.variant,color=_ref3.color,hasIcon=_ref3.hasIcon;if(variant==='tertiary'&&color!=='primary'&&color!=='white'){throwBladeError({moduleName:'BaseButton',message:`Tertiary variant can only be used with color: "primary" or "white" but received "${color}"`});}var isIconOnly=hasIcon&&(!childrenString||(childrenString==null?void 0:childrenString.trim().length)===0);var props={iconSize:isIconOnly?buttonIconOnlySizeToIconSizeMap[size]:buttonSizeToIconSizeMap[size],spinnerSize:buttonSizeToSpinnerSizeMap[size],fontSize:buttonTypographyTokens.fonts.size[size],lineHeight:buttonTypographyTokens.lineHeights[size],minHeight:makeSize(minHeight[size]),height:isIconOnly?buttonIconOnlyHeightWidth[size]:undefined,width:isIconOnly?buttonIconOnlyHeightWidth[size]:undefined,iconPadding:hasIcon&&childrenString!=null&&childrenString.trim()?`spacing.${buttonIconPadding[size]}`:undefined,iconColor:getTextColorToken({property:'icon',variant:variant,color:color,state:'default'}),textColor:getTextColorToken({property:'text',variant:variant,color:color,state:'default'}),buttonPaddingTop:isIconOnly?makeSpace(0):makeSpace(theme.spacing[buttonPadding[size].top]),buttonPaddingBottom:isIconOnly?makeSpace(0):makeSpace(theme.spacing[buttonPadding[size].bottom]),buttonPaddingLeft:isIconOnly?makeSpace(0):makeSpace(theme.spacing[buttonPadding[size].left]),buttonPaddingRight:isIconOnly?makeSpace(0):makeSpace(theme.spacing[buttonPadding[size].right]),text:childrenString==null?void 0:childrenString.trim(),defaultBackgroundColor:getIn(theme.colors,getBackgroundColorToken({property:'background',variant:variant,color:color,state:'default'})),defaultBorderColor:getIn(theme.colors,getBackgroundColorToken({property:'border',variant:variant,color:color,state:'default'})),hoverBackgroundColor:getIn(theme.colors,getBackgroundColorToken({property:'background',variant:variant,color:color,state:'hover'})),hoverBorderColor:getIn(theme.colors,getBackgroundColorToken({property:'border',variant:variant,color:color,state:'hover'})),focusBackgroundColor:getIn(theme.colors,getBackgroundColorToken({property:'background',variant:variant,color:color,state:'focus'})),focusBorderColor:getIn(theme.colors,getBackgroundColorToken({property:'border',variant:variant,color:color,state:'focus'})),focusRingColor:getIn(theme.colors,'surface.border.primary.muted'),borderWidth:variant=='secondary'?makeBorderSize(theme.border.width.thin):'0px',borderRadius:makeBorderSize(theme.border.radius.medium),motionDuration:'duration.xquick',motionEasing:'easing.standard'};if(isDisabled){var disabledBackgroundColor=getIn(theme.colors,getBackgroundColorToken({property:'background',variant:variant,color:color,state:'disabled'}));var disabledBorderColor=getIn(theme.colors,getBackgroundColorToken({property:'border',variant:variant,color:color,state:'disabled'}));props.iconColor=getTextColorToken({property:'icon',variant:variant,color:color,state:'disabled'});props.textColor=getTextColorToken({property:'text',variant:variant,color:color,state:'disabled'});props.defaultBackgroundColor=disabledBackgroundColor;props.defaultBorderColor=disabledBorderColor;props.hoverBackgroundColor=disabledBackgroundColor;props.hoverBorderColor=disabledBorderColor;props.focusBackgroundColor=disabledBackgroundColor;props.focusBorderColor=disabledBorderColor;}return props;};var ButtonContent=styled(BaseBox)(function(_ref4){var isHidden=_ref4.isHidden;return {opacity:isHidden?0:1};});var _BaseButton=function _BaseButton(_ref5,ref){var _buttonGroupProps$isD,_buttonGroupProps$siz,_buttonGroupProps$var,_buttonGroupProps$col,_accessibilityProps$r,_buttonGroupProps$isF;var href=_ref5.href,target=_ref5.target,rel=_ref5.rel,tabIndex=_ref5.tabIndex,id=_ref5.id,_ref5$variant=_ref5.variant,variant=_ref5$variant===void 0?'primary':_ref5$variant,_ref5$color=_ref5.color,color=_ref5$color===void 0?'primary':_ref5$color,_ref5$size=_ref5.size,size=_ref5$size===void 0?'medium':_ref5$size,Icon=_ref5.icon,_ref5$iconPosition=_ref5.iconPosition,iconPosition=_ref5$iconPosition===void 0?'left':_ref5$iconPosition,_ref5$isDisabled=_ref5.isDisabled,isDisabled=_ref5$isDisabled===void 0?false:_ref5$isDisabled,_ref5$isFullWidth=_ref5.isFullWidth,isFullWidth=_ref5$isFullWidth===void 0?false:_ref5$isFullWidth,_ref5$isLoading=_ref5.isLoading,isLoading=_ref5$isLoading===void 0?false:_ref5$isLoading,onClick=_ref5.onClick,onBlur=_ref5.onBlur,_onKeyDown=_ref5.onKeyDown,_ref5$type=_ref5.type,type=_ref5$type===void 0?'button':_ref5$type,children=_ref5.children,testID=_ref5.testID,onFocus=_ref5.onFocus,onMouseLeave=_ref5.onMouseLeave,onMouseMove=_ref5.onMouseMove,_onMouseDown=_ref5.onMouseDown,onPointerDown=_ref5.onPointerDown,onPointerEnter=_ref5.onPointerEnter,accessibilityProps=_ref5.accessibilityProps,_onTouchEnd=_ref5.onTouchEnd,_onTouchStart=_ref5.onTouchStart,rest=_objectWithoutProperties(_ref5,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var buttonGroupProps=useButtonGroupContext();var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isPressed=_React$useState2[0],setIsPressed=_React$useState2[1];var isLink=Boolean(href);var childrenString=getStringFromReactText(children);var isChildrenComponent=React__default.isValidElement(children);var disabled=(_buttonGroupProps$isD=buttonGroupProps.isDisabled)!=null?_buttonGroupProps$isD:isLoading||isDisabled&&!isLink;if(__DEV__){if(!Icon&&!(childrenString!=null&&childrenString.trim())){throwBladeError({message:'At least one of icon or text is required to render a button.',moduleName:'BaseButton'});}}var prevLoading=usePrevious(isLoading);React__default.useEffect(function(){if(isLoading)announce('Started loading');if(!isLoading&&prevLoading)announce('Stopped loading');},[isLoading,prevLoading]);var _getProps=getProps({buttonTypographyTokens:typography,childrenString:childrenString,isDisabled:disabled,size:(_buttonGroupProps$siz=buttonGroupProps.size)!=null?_buttonGroupProps$siz:size,variant:(_buttonGroupProps$var=buttonGroupProps.variant)!=null?_buttonGroupProps$var:variant,theme:theme,color:(_buttonGroupProps$col=buttonGroupProps.color)!=null?_buttonGroupProps$col:color,hasIcon:Boolean(Icon)}),defaultBorderColor=_getProps.defaultBorderColor,defaultBackgroundColor=_getProps.defaultBackgroundColor,minHeight=_getProps.minHeight,height=_getProps.height,width=_getProps.width,buttonPaddingTop=_getProps.buttonPaddingTop,buttonPaddingBottom=_getProps.buttonPaddingBottom,buttonPaddingLeft=_getProps.buttonPaddingLeft,buttonPaddingRight=_getProps.buttonPaddingRight,focusBorderColor=_getProps.focusBorderColor,focusBackgroundColor=_getProps.focusBackgroundColor,focusRingColor=_getProps.focusRingColor,fontSize=_getProps.fontSize,hoverBorderColor=_getProps.hoverBorderColor,hoverBackgroundColor=_getProps.hoverBackgroundColor,iconColor=_getProps.iconColor,iconSize=_getProps.iconSize,iconPadding=_getProps.iconPadding,spinnerSize=_getProps.spinnerSize,lineHeight=_getProps.lineHeight,text=_getProps.text,textColor=_getProps.textColor,borderWidth=_getProps.borderWidth,borderRadius=_getProps.borderRadius,motionDuration=_getProps.motionDuration,motionEasing=_getProps.motionEasing;var renderElement=React__default.useMemo(function(){return getRenderElement(href);},[href]);var defaultRole=isLink?'link':'button';var handlePointerPressedIn=React__default.useCallback(function(){if(disabled)return;setIsPressed(true);},[disabled]);var handlePointerPressedOut=React__default.useCallback(function(){if(disabled)return;setIsPressed(false);},[disabled]);var handleKeyboardPressedIn=React__default.useCallback(function(e){if(disabled)return;if(e.key===' '||e.key==='Enter'){setIsPressed(true);}},[disabled]);var handleKeyboardPressedOut=React__default.useCallback(function(e){if(disabled)return;if(e.key===' '||e.key==='Enter'){setIsPressed(false);}},[disabled]);return jsx(StyledBaseButton,Object.assign({ref:ref,id:id,as:renderElement,href:href,target:target,rel:rel,accessibilityProps:Object.assign({},makeAccessible(Object.assign({},accessibilityProps,{role:(_accessibilityProps$r=accessibilityProps==null?void 0:accessibilityProps.role)!=null?_accessibilityProps$r:defaultRole}))),variant:variant,isLoading:isLoading,disabled:disabled,defaultBorderColor:defaultBorderColor,minHeight:minHeight,buttonPaddingTop:buttonPaddingTop,buttonPaddingBottom:buttonPaddingBottom,buttonPaddingLeft:buttonPaddingLeft,buttonPaddingRight:buttonPaddingRight,defaultBackgroundColor:defaultBackgroundColor,focusBorderColor:focusBorderColor,focusBackgroundColor:focusBackgroundColor,focusRingColor:focusRingColor,hoverBorderColor:hoverBorderColor,hoverBackgroundColor:hoverBackgroundColor,isFullWidth:(_buttonGroupProps$isF=buttonGroupProps.isFullWidth)!=null?_buttonGroupProps$isF:isFullWidth,onClick:onClick,onBlur:onBlur,onFocus:onFocus,onMouseLeave:onMouseLeave,onMouseMove:onMouseMove,tabIndex:tabIndex,onPointerDown:onPointerDown,onPointerEnter:onPointerEnter,onKeyDown:function onKeyDown(event){handleKeyboardPressedIn(event);_onKeyDown==null?void 0:_onKeyDown(event);},onTouchStart:function onTouchStart(event){handlePointerPressedIn();_onTouchStart==null?void 0:_onTouchStart(event);},onTouchEnd:function onTouchEnd(event){handlePointerPressedOut();_onTouchEnd==null?void 0:_onTouchEnd(event);},type:type,borderWidth:borderWidth,borderRadius:borderRadius,motionDuration:motionDuration,motionEasing:motionEasing,height:height,width:width,isPressed:isPressed,onMouseDown:function onMouseDown(event){handlePointerPressedIn();_onMouseDown==null?void 0:_onMouseDown(event);},onMouseUp:handlePointerPressedOut,onMouseOut:handlePointerPressedOut,onKeyUp:handleKeyboardPressedOut},metaAttribute({name:MetaConstants.Button,testID:testID}),getStyledProps(rest),makeAnalyticsAttribute(rest),{children:jsxs(AnimatedButtonContent,{motionDuration:motionDuration,motionEasing:motionEasing,isPressed:isPressed,children:[isLoading?jsx(BaseBox,{display:"flex",justifyContent:"center",alignItems:"center",position:"absolute",top:"0px",left:"0px",bottom:"0px",right:"0px",zIndex:1,children:jsx(BaseSpinner,{accessibilityLabel:"Loading",size:spinnerSize,color:color})}):null,jsxs(ButtonContent,{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"center",flex:1,isHidden:isLoading,zIndex:1,children:[Icon&&iconPosition=='left'?jsx(BaseBox,{paddingRight:iconPadding,display:"flex",justifyContent:"center",alignItems:"center",children:jsx(Icon,{size:iconSize,color:iconColor})}):null,text?isChildrenComponent?children:jsx(BaseText,{lineHeight:lineHeight,fontSize:fontSize,fontWeight:"medium",textAlign:"center",color:textColor,children:text}):null,Icon&&iconPosition=='right'?jsx(BaseBox,{paddingLeft:iconPadding,display:"flex",justifyContent:"center",alignItems:"center",children:jsx(Icon,{size:iconSize,color:iconColor})}):null]})]})}));};var BaseButton=assignWithoutSideEffects(React__default.forwardRef(_BaseButton),{displayName:'BaseButton'});
|
|
36
|
+
var _excluded=["href","target","rel","tabIndex","id","variant","color","size","icon","iconPosition","isDisabled","isFullWidth","isLoading","onClick","onBlur","onKeyDown","type","children","testID","onFocus","onMouseLeave","onMouseMove","onMouseDown","onPointerDown","onPointerEnter","accessibilityProps","onTouchEnd","onTouchStart"];var getRenderElement=function getRenderElement(href){if(isReactNative()){return undefined;}if(href){return 'a';}return 'button';};var getBackgroundColorToken=function getBackgroundColorToken(_ref){var property=_ref.property,variant=_ref.variant,state=_ref.state,color=_ref.color;var _state=state==='focus'||state==='hover'?'highlighted':state;var tokens=backgroundColor(property);if(color==='white'){return tokens.white[variant][_state];}if(color&&color!=='primary'){if(variant==='tertiary'){throw new Error(`Tertiary variant can only be used with color: "primary" or "white" but received "${color}"`);}return tokens.color(color)[variant][_state];}return tokens.base[variant][_state];};var getTextColorToken=function getTextColorToken(_ref2){var property=_ref2.property,variant=_ref2.variant,state=_ref2.state,color=_ref2.color;var tokens=textColor(property);var _state=state==='focus'||state==='hover'?'highlighted':state;if(color==='white'){return tokens.white[variant][_state];}if(color&&color!=='primary'){if(variant==='tertiary'){throw new Error(`Tertiary variant can only be used with color: "primary" or "white" but received "${color}"`);}return tokens.color(color)[variant][_state];}return tokens.base[variant][_state];};var getProps=function getProps(_ref3){var buttonTypographyTokens=_ref3.buttonTypographyTokens,childrenString=_ref3.childrenString,isDisabled=_ref3.isDisabled,size=_ref3.size,theme=_ref3.theme,variant=_ref3.variant,color=_ref3.color,hasIcon=_ref3.hasIcon;if(variant==='tertiary'&&color!=='primary'&&color!=='white'){throwBladeError({moduleName:'BaseButton',message:`Tertiary variant can only be used with color: "primary" or "white" but received "${color}"`});}var isIconOnly=hasIcon&&(!childrenString||(childrenString==null?void 0:childrenString.trim().length)===0);var props={iconSize:isIconOnly?buttonIconOnlySizeToIconSizeMap[size]:buttonSizeToIconSizeMap[size],spinnerSize:buttonSizeToSpinnerSizeMap[size],fontSize:buttonTypographyTokens.fonts.size[size],lineHeight:buttonTypographyTokens.lineHeights[size],minHeight:makeSize(minHeight[size]),height:isIconOnly?buttonIconOnlyHeightWidth[size]:undefined,width:isIconOnly?buttonIconOnlyHeightWidth[size]:undefined,iconPadding:hasIcon&&childrenString!=null&&childrenString.trim()?`spacing.${buttonIconPadding[size]}`:undefined,iconColor:getTextColorToken({property:'icon',variant:variant,color:color,state:'default'}),textColor:getTextColorToken({property:'text',variant:variant,color:color,state:'default'}),buttonPaddingTop:isIconOnly?makeSpace(0):makeSpace(theme.spacing[buttonPadding[size].top]),buttonPaddingBottom:isIconOnly?makeSpace(0):makeSpace(theme.spacing[buttonPadding[size].bottom]),buttonPaddingLeft:isIconOnly?makeSpace(0):makeSpace(theme.spacing[buttonPadding[size].left]),buttonPaddingRight:isIconOnly?makeSpace(0):makeSpace(theme.spacing[buttonPadding[size].right]),text:childrenString==null?void 0:childrenString.trim(),defaultBackgroundColor:getIn(theme.colors,getBackgroundColorToken({property:'background',variant:variant,color:color,state:'default'})),defaultBorderColor:getIn(theme.colors,getBackgroundColorToken({property:'border',variant:variant,color:color,state:'default'})),hoverBackgroundColor:getIn(theme.colors,getBackgroundColorToken({property:'background',variant:variant,color:color,state:'hover'})),hoverBorderColor:getIn(theme.colors,getBackgroundColorToken({property:'border',variant:variant,color:color,state:'hover'})),focusBackgroundColor:getIn(theme.colors,getBackgroundColorToken({property:'background',variant:variant,color:color,state:'focus'})),focusBorderColor:getIn(theme.colors,getBackgroundColorToken({property:'border',variant:variant,color:color,state:'focus'})),focusRingColor:getIn(theme.colors,'surface.border.primary.muted'),borderWidth:variant=='secondary'?makeBorderSize(theme.border.width.thin):'0px',borderRadius:makeBorderSize(theme.border.radius.medium),motionDuration:'duration.xquick',motionEasing:'easing.standard'};if(isDisabled){var disabledBackgroundColor=getIn(theme.colors,getBackgroundColorToken({property:'background',variant:variant,color:color,state:'disabled'}));var disabledBorderColor=getIn(theme.colors,getBackgroundColorToken({property:'border',variant:variant,color:color,state:'disabled'}));props.iconColor=getTextColorToken({property:'icon',variant:variant,color:color,state:'disabled'});props.textColor=getTextColorToken({property:'text',variant:variant,color:color,state:'disabled'});props.defaultBackgroundColor=disabledBackgroundColor;props.defaultBorderColor=disabledBorderColor;props.hoverBackgroundColor=disabledBackgroundColor;props.hoverBorderColor=disabledBorderColor;props.focusBackgroundColor=disabledBackgroundColor;props.focusBorderColor=disabledBorderColor;}return props;};var ButtonContent=styled(BaseBox)(function(_ref4){var isHidden=_ref4.isHidden;return {opacity:isHidden?0:1};});var _BaseButton=function _BaseButton(_ref5,ref){var _buttonGroupProps$siz,_buttonGroupProps$var,_buttonGroupProps$col,_accessibilityProps$r,_buttonGroupProps$isF;var href=_ref5.href,target=_ref5.target,rel=_ref5.rel,tabIndex=_ref5.tabIndex,id=_ref5.id,_ref5$variant=_ref5.variant,variant=_ref5$variant===void 0?'primary':_ref5$variant,_ref5$color=_ref5.color,color=_ref5$color===void 0?'primary':_ref5$color,_ref5$size=_ref5.size,size=_ref5$size===void 0?'medium':_ref5$size,Icon=_ref5.icon,_ref5$iconPosition=_ref5.iconPosition,iconPosition=_ref5$iconPosition===void 0?'left':_ref5$iconPosition,_ref5$isDisabled=_ref5.isDisabled,isDisabled=_ref5$isDisabled===void 0?false:_ref5$isDisabled,_ref5$isFullWidth=_ref5.isFullWidth,isFullWidth=_ref5$isFullWidth===void 0?false:_ref5$isFullWidth,_ref5$isLoading=_ref5.isLoading,isLoading=_ref5$isLoading===void 0?false:_ref5$isLoading,onClick=_ref5.onClick,onBlur=_ref5.onBlur,_onKeyDown=_ref5.onKeyDown,_ref5$type=_ref5.type,type=_ref5$type===void 0?'button':_ref5$type,children=_ref5.children,testID=_ref5.testID,onFocus=_ref5.onFocus,onMouseLeave=_ref5.onMouseLeave,onMouseMove=_ref5.onMouseMove,_onMouseDown=_ref5.onMouseDown,onPointerDown=_ref5.onPointerDown,onPointerEnter=_ref5.onPointerEnter,accessibilityProps=_ref5.accessibilityProps,_onTouchEnd=_ref5.onTouchEnd,_onTouchStart=_ref5.onTouchStart,rest=_objectWithoutProperties(_ref5,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var buttonGroupProps=useButtonGroupContext();var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isPressed=_React$useState2[0],setIsPressed=_React$useState2[1];var isLink=Boolean(href);var childrenString=getStringFromReactText(children);var isChildrenComponent=React__default.isValidElement(children);var disabled=buttonGroupProps.isDisabled||isLoading||isDisabled&&!isLink;if(__DEV__){if(!Icon&&!(childrenString!=null&&childrenString.trim())){throwBladeError({message:'At least one of icon or text is required to render a button.',moduleName:'BaseButton'});}}var prevLoading=usePrevious(isLoading);React__default.useEffect(function(){if(isLoading)announce('Started loading');if(!isLoading&&prevLoading)announce('Stopped loading');},[isLoading,prevLoading]);var _getProps=getProps({buttonTypographyTokens:typography,childrenString:childrenString,isDisabled:disabled,size:(_buttonGroupProps$siz=buttonGroupProps.size)!=null?_buttonGroupProps$siz:size,variant:(_buttonGroupProps$var=buttonGroupProps.variant)!=null?_buttonGroupProps$var:variant,theme:theme,color:(_buttonGroupProps$col=buttonGroupProps.color)!=null?_buttonGroupProps$col:color,hasIcon:Boolean(Icon)}),defaultBorderColor=_getProps.defaultBorderColor,defaultBackgroundColor=_getProps.defaultBackgroundColor,minHeight=_getProps.minHeight,height=_getProps.height,width=_getProps.width,buttonPaddingTop=_getProps.buttonPaddingTop,buttonPaddingBottom=_getProps.buttonPaddingBottom,buttonPaddingLeft=_getProps.buttonPaddingLeft,buttonPaddingRight=_getProps.buttonPaddingRight,focusBorderColor=_getProps.focusBorderColor,focusBackgroundColor=_getProps.focusBackgroundColor,focusRingColor=_getProps.focusRingColor,fontSize=_getProps.fontSize,hoverBorderColor=_getProps.hoverBorderColor,hoverBackgroundColor=_getProps.hoverBackgroundColor,iconColor=_getProps.iconColor,iconSize=_getProps.iconSize,iconPadding=_getProps.iconPadding,spinnerSize=_getProps.spinnerSize,lineHeight=_getProps.lineHeight,text=_getProps.text,textColor=_getProps.textColor,borderWidth=_getProps.borderWidth,borderRadius=_getProps.borderRadius,motionDuration=_getProps.motionDuration,motionEasing=_getProps.motionEasing;var renderElement=React__default.useMemo(function(){return getRenderElement(href);},[href]);var defaultRole=isLink?'link':'button';var handlePointerPressedIn=React__default.useCallback(function(){if(disabled)return;setIsPressed(true);},[disabled]);var handlePointerPressedOut=React__default.useCallback(function(){if(disabled)return;setIsPressed(false);},[disabled]);var handleKeyboardPressedIn=React__default.useCallback(function(e){if(disabled)return;if(e.key===' '||e.key==='Enter'){setIsPressed(true);}},[disabled]);var handleKeyboardPressedOut=React__default.useCallback(function(e){if(disabled)return;if(e.key===' '||e.key==='Enter'){setIsPressed(false);}},[disabled]);return jsx(StyledBaseButton,Object.assign({ref:ref,id:id,as:renderElement,href:href,target:target,rel:rel,accessibilityProps:Object.assign({},makeAccessible(Object.assign({},accessibilityProps,{role:(_accessibilityProps$r=accessibilityProps==null?void 0:accessibilityProps.role)!=null?_accessibilityProps$r:defaultRole}))),variant:variant,isLoading:isLoading,disabled:disabled,defaultBorderColor:defaultBorderColor,minHeight:minHeight,buttonPaddingTop:buttonPaddingTop,buttonPaddingBottom:buttonPaddingBottom,buttonPaddingLeft:buttonPaddingLeft,buttonPaddingRight:buttonPaddingRight,defaultBackgroundColor:defaultBackgroundColor,focusBorderColor:focusBorderColor,focusBackgroundColor:focusBackgroundColor,focusRingColor:focusRingColor,hoverBorderColor:hoverBorderColor,hoverBackgroundColor:hoverBackgroundColor,isFullWidth:(_buttonGroupProps$isF=buttonGroupProps.isFullWidth)!=null?_buttonGroupProps$isF:isFullWidth,onClick:onClick,onBlur:onBlur,onFocus:onFocus,onMouseLeave:onMouseLeave,onMouseMove:onMouseMove,tabIndex:tabIndex,onPointerDown:onPointerDown,onPointerEnter:onPointerEnter,onKeyDown:function onKeyDown(event){handleKeyboardPressedIn(event);_onKeyDown==null?void 0:_onKeyDown(event);},onTouchStart:function onTouchStart(event){handlePointerPressedIn();_onTouchStart==null?void 0:_onTouchStart(event);},onTouchEnd:function onTouchEnd(event){handlePointerPressedOut();_onTouchEnd==null?void 0:_onTouchEnd(event);},type:type,borderWidth:borderWidth,borderRadius:borderRadius,motionDuration:motionDuration,motionEasing:motionEasing,height:height,width:width,isPressed:isPressed,onMouseDown:function onMouseDown(event){handlePointerPressedIn();_onMouseDown==null?void 0:_onMouseDown(event);},onMouseUp:handlePointerPressedOut,onMouseOut:handlePointerPressedOut,onKeyUp:handleKeyboardPressedOut},metaAttribute({name:MetaConstants.Button,testID:testID}),getStyledProps(rest),makeAnalyticsAttribute(rest),{children:jsxs(AnimatedButtonContent,{motionDuration:motionDuration,motionEasing:motionEasing,isPressed:isPressed,children:[isLoading?jsx(BaseBox,{display:"flex",justifyContent:"center",alignItems:"center",position:"absolute",top:"0px",left:"0px",bottom:"0px",right:"0px",zIndex:1,children:jsx(BaseSpinner,{accessibilityLabel:"Loading",size:spinnerSize,color:color})}):null,jsxs(ButtonContent,{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"center",flex:1,isHidden:isLoading,zIndex:1,children:[Icon&&iconPosition=='left'?jsx(BaseBox,{paddingRight:iconPadding,display:"flex",justifyContent:"center",alignItems:"center",children:jsx(Icon,{size:iconSize,color:iconColor})}):null,text?isChildrenComponent?children:jsx(BaseText,{lineHeight:lineHeight,fontSize:fontSize,fontWeight:"medium",textAlign:"center",color:textColor,children:text}):null,Icon&&iconPosition=='right'?jsx(BaseBox,{paddingLeft:iconPadding,display:"flex",justifyContent:"center",alignItems:"center",children:jsx(Icon,{size:iconSize,color:iconColor})}):null]})]})}));};var BaseButton=assignWithoutSideEffects(React__default.forwardRef(_BaseButton),{displayName:'BaseButton'});
|
|
37
37
|
|
|
38
38
|
export { BaseButton as default, getBackgroundColorToken, getTextColorToken };
|
|
39
39
|
//# sourceMappingURL=BaseButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseButton.js","sources":["../../../../../../src/components/Button/BaseButton/BaseButton.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React from 'react';\nimport styled from 'styled-components';\nimport type { GestureResponderEvent } from 'react-native';\nimport StyledBaseButton from './StyledBaseButton';\nimport type { ButtonTypography } from './buttonTokens';\nimport {\n textColor,\n backgroundColor,\n buttonIconOnlySizeToIconSizeMap,\n typography as buttonTypography,\n minHeight as buttonMinHeight,\n buttonSizeToIconSizeMap,\n buttonSizeToSpinnerSizeMap,\n buttonIconPadding,\n buttonPadding,\n buttonIconOnlyHeightWidth,\n} from './buttonTokens';\nimport type { BaseButtonStyleProps, IconColor } from './types';\nimport AnimatedButtonContent from './AnimatedButtonContent';\nimport type { DotNotationToken } from '~utils/lodashButBetter/get';\nimport getIn from '~utils/lodashButBetter/get';\nimport type { BaseLinkProps } from '~components/Link/BaseLink';\nimport type { Theme } from '~components/BladeProvider';\nimport type { IconComponent } from '~components/Icons';\nimport type { Platform } from '~utils';\nimport { isReactNative } from '~utils';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { useButtonGroupContext } from '~components/ButtonGroup/ButtonGroupContext';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport { BaseText } from '~components/Typography/BaseText';\nimport { useTheme } from '~components/BladeProvider';\nimport { announce } from '~components/LiveAnnouncer';\nimport { BaseSpinner } from '~components/Spinner/BaseSpinner';\nimport type { BaseBoxProps } from '~components/Box/BaseBox';\nimport BaseBox from '~components/Box/BaseBox';\nimport type {\n BladeElementRef,\n DataAnalyticsAttribute,\n StringChildrenType,\n TestID,\n} from '~utils/types';\nimport type { BaseTextProps } from '~components/Typography/BaseText/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { usePrevious } from '~utils/usePrevious';\nimport { makeSize } from '~utils/makeSize';\nimport { makeBorderSize } from '~utils/makeBorderSize';\nimport type { AccessibilityProps } from '~utils/makeAccessible';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { makeSpace } from '~utils/makeSpace';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStringFromReactText } from '~src/utils/getStringChildren';\nimport type { BladeCommonEvents } from '~components/types';\nimport { throwBladeError } from '~utils/logger';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype BaseButtonCommonProps = {\n href?: BaseLinkProps['href'];\n target?: BaseLinkProps['target'];\n rel?: BaseLinkProps['rel'];\n size?: 'xsmall' | 'small' | 'medium' | 'large';\n id?: string;\n tabIndex?: BaseBoxProps['tabIndex'];\n iconPosition?: 'left' | 'right';\n isDisabled?: boolean;\n isFullWidth?: boolean;\n onKeyDown?: Platform.Select<{\n native: (event: GestureResponderEvent) => void;\n web: (event: React.KeyboardEvent<HTMLButtonElement>) => void;\n }>;\n onClick?: Platform.Select<{\n native: (event: GestureResponderEvent) => void;\n web: (event: React.MouseEvent<HTMLButtonElement>) => void;\n }>;\n type?: 'button' | 'reset' | 'submit';\n isLoading?: boolean;\n accessibilityProps?: Partial<AccessibilityProps>;\n variant?: 'primary' | 'secondary' | 'tertiary';\n color?: 'primary' | 'white' | 'positive' | 'negative' | 'notice' | 'information' | 'neutral';\n} & TestID &\n StyledPropsBlade &\n BladeCommonEvents;\n\n/*\nMandatory children prop when icon is not provided\n*/\ntype BaseButtonWithoutIconProps = BaseButtonCommonProps & {\n icon?: undefined;\n children: StringChildrenType;\n} & DataAnalyticsAttribute;\n\n/*\n Optional children prop when icon is provided\n*/\ntype BaseButtonWithIconProps = BaseButtonCommonProps & {\n icon: IconComponent;\n children?: StringChildrenType;\n} & DataAnalyticsAttribute;\n\n/*\n With or without icon prop. We need at least an icon or a children prop present.\n*/\nexport type BaseButtonProps = BaseButtonWithIconProps | BaseButtonWithoutIconProps;\n\ntype BaseButtonColorTokenModifiers = {\n variant: NonNullable<BaseButtonProps['variant']>;\n state: 'default' | 'hover' | 'focus' | 'disabled';\n color: BaseButtonProps['color'];\n};\n\nconst getRenderElement = (href?: string): 'a' | 'button' | undefined => {\n if (isReactNative()) {\n return undefined; // as property doesn't work with react native\n }\n\n if (href) {\n return 'a';\n }\n\n return 'button';\n};\n\nexport const getBackgroundColorToken = ({\n property,\n variant,\n state,\n color,\n}: BaseButtonColorTokenModifiers & {\n property: 'background' | 'border';\n}): DotNotationToken<Theme['colors']> => {\n const _state = state === 'focus' || state === 'hover' ? 'highlighted' : state;\n const tokens = backgroundColor(property);\n\n if (color === 'white') {\n return tokens.white[variant][_state];\n }\n\n if (color && color !== 'primary') {\n if (variant === 'tertiary') {\n throw new Error(\n `Tertiary variant can only be used with color: \"primary\" or \"white\" but received \"${color}\"`,\n );\n }\n return tokens.color(color)[variant][_state];\n }\n\n return tokens.base[variant][_state];\n};\n\nexport const getTextColorToken = ({\n property,\n variant,\n state,\n color,\n}: BaseButtonColorTokenModifiers & {\n property: 'icon' | 'text';\n}): DotNotationToken<Theme['colors']> => {\n const tokens = textColor(property);\n const _state = state === 'focus' || state === 'hover' ? 'highlighted' : state;\n\n if (color === 'white') {\n return tokens.white[variant][_state];\n }\n\n if (color && color !== 'primary') {\n if (variant === 'tertiary') {\n throw new Error(\n `Tertiary variant can only be used with color: \"primary\" or \"white\" but received \"${color}\"`,\n );\n }\n return tokens.color(color)[variant][_state];\n }\n\n return tokens.base[variant][_state];\n};\n\nconst getProps = ({\n buttonTypographyTokens,\n childrenString,\n isDisabled,\n size,\n theme,\n variant,\n color,\n hasIcon,\n}: {\n buttonTypographyTokens: ButtonTypography;\n childrenString?: string;\n isDisabled: boolean;\n hasIcon: boolean;\n theme: Theme;\n size: NonNullable<BaseButtonProps['size']>;\n variant: NonNullable<BaseButtonProps['variant']>;\n color: BaseButtonProps['color'];\n}): BaseButtonStyleProps => {\n if (variant === 'tertiary' && color !== 'primary' && color !== 'white') {\n throwBladeError({\n moduleName: 'BaseButton',\n message: `Tertiary variant can only be used with color: \"primary\" or \"white\" but received \"${color}\"`,\n });\n }\n\n const isIconOnly = hasIcon && (!childrenString || childrenString?.trim().length === 0);\n const props: BaseButtonStyleProps = {\n iconSize: isIconOnly ? buttonIconOnlySizeToIconSizeMap[size] : buttonSizeToIconSizeMap[size],\n spinnerSize: buttonSizeToSpinnerSizeMap[size],\n fontSize: buttonTypographyTokens.fonts.size[size],\n lineHeight: buttonTypographyTokens.lineHeights[size],\n minHeight: makeSize(buttonMinHeight[size]),\n height: isIconOnly ? buttonIconOnlyHeightWidth[size] : undefined,\n width: isIconOnly ? buttonIconOnlyHeightWidth[size] : undefined,\n iconPadding:\n hasIcon && childrenString?.trim() ? `spacing.${buttonIconPadding[size]}` : undefined,\n iconColor: getTextColorToken({\n property: 'icon',\n variant,\n color,\n state: 'default',\n }) as IconColor,\n textColor: getTextColorToken({\n property: 'text',\n variant,\n color,\n state: 'default',\n }) as BaseTextProps['color'],\n buttonPaddingTop: isIconOnly ? makeSpace(0) : makeSpace(theme.spacing[buttonPadding[size].top]),\n buttonPaddingBottom: isIconOnly\n ? makeSpace(0)\n : makeSpace(theme.spacing[buttonPadding[size].bottom]),\n buttonPaddingLeft: isIconOnly\n ? makeSpace(0)\n : makeSpace(theme.spacing[buttonPadding[size].left]),\n buttonPaddingRight: isIconOnly\n ? makeSpace(0)\n : makeSpace(theme.spacing[buttonPadding[size].right]),\n text: childrenString?.trim(),\n defaultBackgroundColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'background', variant, color, state: 'default' }),\n ),\n defaultBorderColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'border', variant, color, state: 'default' }),\n ),\n hoverBackgroundColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'background', variant, color, state: 'hover' }),\n ),\n hoverBorderColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'border', variant, color, state: 'hover' }),\n ),\n focusBackgroundColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'background', variant, color, state: 'focus' }),\n ),\n focusBorderColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'border', variant, color, state: 'focus' }),\n ),\n focusRingColor: getIn(theme.colors, 'surface.border.primary.muted'),\n borderWidth: variant == 'secondary' ? makeBorderSize(theme.border.width.thin) : '0px',\n borderRadius: makeBorderSize(theme.border.radius.medium),\n motionDuration: 'duration.xquick',\n motionEasing: 'easing.standard',\n };\n\n if (isDisabled) {\n const disabledBackgroundColor = getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'background', variant, color, state: 'disabled' }),\n );\n const disabledBorderColor = getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'border', variant, color, state: 'disabled' }),\n );\n props.iconColor = getTextColorToken({\n property: 'icon',\n variant,\n color,\n state: 'disabled',\n }) as IconColor;\n props.textColor = getTextColorToken({\n property: 'text',\n variant,\n color,\n state: 'disabled',\n }) as BaseTextProps['color'];\n props.defaultBackgroundColor = disabledBackgroundColor;\n props.defaultBorderColor = disabledBorderColor;\n props.hoverBackgroundColor = disabledBackgroundColor;\n props.hoverBorderColor = disabledBorderColor;\n props.focusBackgroundColor = disabledBackgroundColor;\n props.focusBorderColor = disabledBorderColor;\n }\n\n return props;\n};\n\nconst ButtonContent = styled(BaseBox)<{ isHidden: boolean }>(({ isHidden }) => ({\n opacity: isHidden ? 0 : 1,\n}));\n\nconst _BaseButton: React.ForwardRefRenderFunction<BladeElementRef, BaseButtonProps> = (\n {\n href,\n target,\n rel,\n tabIndex,\n id,\n variant = 'primary',\n color = 'primary',\n size = 'medium',\n icon: Icon,\n iconPosition = 'left',\n isDisabled = false,\n isFullWidth = false,\n isLoading = false,\n onClick,\n onBlur,\n onKeyDown,\n type = 'button',\n children,\n testID,\n onFocus,\n onMouseLeave,\n onMouseMove,\n onMouseDown,\n onPointerDown,\n onPointerEnter,\n accessibilityProps,\n onTouchEnd,\n onTouchStart,\n ...rest\n },\n ref,\n) => {\n const { theme } = useTheme();\n const buttonGroupProps = useButtonGroupContext();\n const [isPressed, setIsPressed] = React.useState(false);\n const isLink = Boolean(href);\n const childrenString = getStringFromReactText(children);\n const isChildrenComponent = React.isValidElement(children);\n\n // Button cannot be disabled when its rendered as Link\n const disabled = buttonGroupProps.isDisabled ?? (isLoading || (isDisabled && !isLink));\n\n if (__DEV__) {\n if (!Icon && !childrenString?.trim()) {\n throwBladeError({\n message: 'At least one of icon or text is required to render a button.',\n moduleName: 'BaseButton',\n });\n }\n }\n\n const prevLoading = usePrevious(isLoading);\n\n React.useEffect(() => {\n if (isLoading) announce('Started loading');\n\n if (!isLoading && prevLoading) announce('Stopped loading');\n }, [isLoading, prevLoading]);\n\n const {\n defaultBorderColor,\n defaultBackgroundColor,\n minHeight,\n height,\n width,\n buttonPaddingTop,\n buttonPaddingBottom,\n buttonPaddingLeft,\n buttonPaddingRight,\n focusBorderColor,\n focusBackgroundColor,\n focusRingColor,\n fontSize,\n hoverBorderColor,\n hoverBackgroundColor,\n iconColor,\n iconSize,\n iconPadding,\n spinnerSize,\n lineHeight,\n text,\n textColor,\n borderWidth,\n borderRadius,\n motionDuration,\n motionEasing,\n } = getProps({\n buttonTypographyTokens: buttonTypography,\n childrenString,\n isDisabled: disabled,\n size: buttonGroupProps.size ?? size,\n variant: buttonGroupProps.variant ?? variant,\n theme,\n color: buttonGroupProps.color ?? color,\n hasIcon: Boolean(Icon),\n });\n\n const renderElement = React.useMemo(() => getRenderElement(href), [href]);\n const defaultRole = isLink ? 'link' : 'button';\n\n const handlePointerPressedIn = React.useCallback(() => {\n if (disabled) return;\n setIsPressed(true);\n }, [disabled]);\n\n const handlePointerPressedOut = React.useCallback(() => {\n if (disabled) return;\n setIsPressed(false);\n }, [disabled]);\n\n const handleKeyboardPressedIn = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (disabled) return;\n if (e.key === ' ' || e.key === 'Enter') {\n setIsPressed(true);\n }\n },\n [disabled],\n );\n\n const handleKeyboardPressedOut = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (disabled) return;\n if (e.key === ' ' || e.key === 'Enter') {\n setIsPressed(false);\n }\n },\n [disabled],\n );\n\n return (\n <StyledBaseButton\n ref={ref as any}\n id={id}\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error\n // @ts-ignore: On React Native it will always be undefined but TS doesn't understand that\n as={renderElement}\n href={href}\n target={target}\n rel={rel}\n accessibilityProps={{\n ...makeAccessible({\n ...accessibilityProps,\n role: accessibilityProps?.role ?? defaultRole,\n }),\n }}\n variant={variant}\n isLoading={isLoading}\n disabled={disabled}\n defaultBorderColor={defaultBorderColor}\n minHeight={minHeight}\n buttonPaddingTop={buttonPaddingTop}\n buttonPaddingBottom={buttonPaddingBottom}\n buttonPaddingLeft={buttonPaddingLeft}\n buttonPaddingRight={buttonPaddingRight}\n defaultBackgroundColor={defaultBackgroundColor}\n focusBorderColor={focusBorderColor}\n focusBackgroundColor={focusBackgroundColor}\n focusRingColor={focusRingColor}\n hoverBorderColor={hoverBorderColor}\n hoverBackgroundColor={hoverBackgroundColor}\n isFullWidth={buttonGroupProps.isFullWidth ?? isFullWidth}\n onClick={onClick}\n onBlur={onBlur}\n onFocus={onFocus}\n onMouseLeave={onMouseLeave}\n onMouseMove={onMouseMove}\n tabIndex={tabIndex}\n onPointerDown={onPointerDown}\n onPointerEnter={onPointerEnter}\n // Setting type for web fails it on native typecheck and vice versa\n onKeyDown={(event: any) => {\n handleKeyboardPressedIn(event);\n onKeyDown?.(event);\n }}\n onTouchStart={(event: React.TouchEvent) => {\n handlePointerPressedIn();\n onTouchStart?.(event);\n }}\n onTouchEnd={(event: React.TouchEvent) => {\n handlePointerPressedOut();\n onTouchEnd?.(event);\n }}\n type={type}\n borderWidth={borderWidth}\n borderRadius={borderRadius}\n motionDuration={motionDuration}\n motionEasing={motionEasing}\n height={height}\n width={width}\n isPressed={isPressed}\n onMouseDown={(event: React.MouseEvent) => {\n handlePointerPressedIn();\n onMouseDown?.(event);\n }}\n onMouseUp={handlePointerPressedOut}\n onMouseOut={handlePointerPressedOut}\n onKeyUp={handleKeyboardPressedOut}\n {...metaAttribute({ name: MetaConstants.Button, testID })}\n {...getStyledProps(rest)}\n {...makeAnalyticsAttribute(rest)}\n >\n <AnimatedButtonContent\n motionDuration={motionDuration}\n motionEasing={motionEasing}\n isPressed={isPressed}\n >\n {isLoading ? (\n <BaseBox\n display=\"flex\"\n justifyContent=\"center\"\n alignItems=\"center\"\n position=\"absolute\"\n top=\"0px\"\n left=\"0px\"\n bottom=\"0px\"\n right=\"0px\"\n zIndex={1}\n >\n <BaseSpinner accessibilityLabel=\"Loading\" size={spinnerSize} color={color} />\n </BaseBox>\n ) : null}\n <ButtonContent\n display=\"flex\"\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n flex={1}\n isHidden={isLoading}\n zIndex={1}\n >\n {Icon && iconPosition == 'left' ? (\n <BaseBox\n paddingRight={iconPadding}\n display=\"flex\"\n justifyContent=\"center\"\n alignItems=\"center\"\n >\n <Icon size={iconSize} color={iconColor} />\n </BaseBox>\n ) : null}\n {text ? (\n isChildrenComponent ? (\n children\n ) : (\n <BaseText\n lineHeight={lineHeight}\n fontSize={fontSize}\n // figma and web have different font-smoothing properties\n // which causes web version of button text to look much bolder\n // than figma version. To fix this we are changing font-weight from 600 to 500\n // https://forum.figma.com/t/why-does-a-font-weight-in-figma-seem-lighter-than-the-same-weight-in-the-browser/2207\n fontWeight=\"medium\"\n textAlign=\"center\"\n color={textColor}\n >\n {text}\n </BaseText>\n )\n ) : null}\n {Icon && iconPosition == 'right' ? (\n <BaseBox\n paddingLeft={iconPadding}\n display=\"flex\"\n justifyContent=\"center\"\n alignItems=\"center\"\n >\n <Icon size={iconSize} color={iconColor} />\n </BaseBox>\n ) : null}\n </ButtonContent>\n </AnimatedButtonContent>\n </StyledBaseButton>\n );\n};\n\nconst BaseButton = assignWithoutSideEffects(React.forwardRef(_BaseButton), {\n displayName: 'BaseButton',\n});\n\nexport default BaseButton;\n"],"names":["getRenderElement","href","isReactNative","undefined","getBackgroundColorToken","_ref","property","variant","state","color","_state","tokens","backgroundColor","white","Error","base","getTextColorToken","_ref2","textColor","getProps","_ref3","buttonTypographyTokens","childrenString","isDisabled","size","theme","hasIcon","throwBladeError","moduleName","message","isIconOnly","trim","length","props","iconSize","buttonIconOnlySizeToIconSizeMap","buttonSizeToIconSizeMap","spinnerSize","buttonSizeToSpinnerSizeMap","fontSize","fonts","lineHeight","lineHeights","minHeight","makeSize","buttonMinHeight","height","buttonIconOnlyHeightWidth","width","iconPadding","buttonIconPadding","iconColor","buttonPaddingTop","makeSpace","spacing","buttonPadding","top","buttonPaddingBottom","bottom","buttonPaddingLeft","left","buttonPaddingRight","right","text","defaultBackgroundColor","getIn","colors","defaultBorderColor","hoverBackgroundColor","hoverBorderColor","focusBackgroundColor","focusBorderColor","focusRingColor","borderWidth","makeBorderSize","border","thin","borderRadius","radius","medium","motionDuration","motionEasing","disabledBackgroundColor","disabledBorderColor","ButtonContent","styled","BaseBox","_ref4","isHidden","opacity","_BaseButton","_ref5","ref","_buttonGroupProps$isD","_buttonGroupProps$siz","_buttonGroupProps$var","_buttonGroupProps$col","_accessibilityProps$r","_buttonGroupProps$isF","target","rel","tabIndex","id","_ref5$variant","_ref5$color","_ref5$size","Icon","icon","_ref5$iconPosition","iconPosition","_ref5$isDisabled","_ref5$isFullWidth","isFullWidth","_ref5$isLoading","isLoading","onClick","onBlur","onKeyDown","_ref5$type","type","children","testID","onFocus","onMouseLeave","onMouseMove","onMouseDown","onPointerDown","onPointerEnter","accessibilityProps","onTouchEnd","onTouchStart","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","buttonGroupProps","useButtonGroupContext","_React$useState","React","useState","_React$useState2","_slicedToArray","isPressed","setIsPressed","isLink","Boolean","getStringFromReactText","isChildrenComponent","isValidElement","disabled","__DEV__","prevLoading","usePrevious","useEffect","announce","_getProps","buttonTypography","renderElement","useMemo","defaultRole","handlePointerPressedIn","useCallback","handlePointerPressedOut","handleKeyboardPressedIn","e","key","handleKeyboardPressedOut","_jsx","StyledBaseButton","Object","assign","as","makeAccessible","role","event","onMouseUp","onMouseOut","onKeyUp","metaAttribute","name","MetaConstants","Button","getStyledProps","makeAnalyticsAttribute","_jsxs","AnimatedButtonContent","display","justifyContent","alignItems","position","zIndex","BaseSpinner","accessibilityLabel","flexDirection","flex","paddingRight","BaseText","fontWeight","textAlign","paddingLeft","BaseButton","assignWithoutSideEffects","forwardRef","displayName"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseButton.js","sources":["../../../../../../src/components/Button/BaseButton/BaseButton.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React from 'react';\nimport styled from 'styled-components';\nimport type { GestureResponderEvent } from 'react-native';\nimport StyledBaseButton from './StyledBaseButton';\nimport type { ButtonTypography } from './buttonTokens';\nimport {\n textColor,\n backgroundColor,\n buttonIconOnlySizeToIconSizeMap,\n typography as buttonTypography,\n minHeight as buttonMinHeight,\n buttonSizeToIconSizeMap,\n buttonSizeToSpinnerSizeMap,\n buttonIconPadding,\n buttonPadding,\n buttonIconOnlyHeightWidth,\n} from './buttonTokens';\nimport type { BaseButtonStyleProps, IconColor } from './types';\nimport AnimatedButtonContent from './AnimatedButtonContent';\nimport type { DotNotationToken } from '~utils/lodashButBetter/get';\nimport getIn from '~utils/lodashButBetter/get';\nimport type { BaseLinkProps } from '~components/Link/BaseLink';\nimport type { Theme } from '~components/BladeProvider';\nimport type { IconComponent } from '~components/Icons';\nimport type { Platform } from '~utils';\nimport { isReactNative } from '~utils';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { useButtonGroupContext } from '~components/ButtonGroup/ButtonGroupContext';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport { BaseText } from '~components/Typography/BaseText';\nimport { useTheme } from '~components/BladeProvider';\nimport { announce } from '~components/LiveAnnouncer';\nimport { BaseSpinner } from '~components/Spinner/BaseSpinner';\nimport type { BaseBoxProps } from '~components/Box/BaseBox';\nimport BaseBox from '~components/Box/BaseBox';\nimport type {\n BladeElementRef,\n DataAnalyticsAttribute,\n StringChildrenType,\n TestID,\n} from '~utils/types';\nimport type { BaseTextProps } from '~components/Typography/BaseText/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { usePrevious } from '~utils/usePrevious';\nimport { makeSize } from '~utils/makeSize';\nimport { makeBorderSize } from '~utils/makeBorderSize';\nimport type { AccessibilityProps } from '~utils/makeAccessible';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { makeSpace } from '~utils/makeSpace';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStringFromReactText } from '~src/utils/getStringChildren';\nimport type { BladeCommonEvents } from '~components/types';\nimport { throwBladeError } from '~utils/logger';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype BaseButtonCommonProps = {\n href?: BaseLinkProps['href'];\n target?: BaseLinkProps['target'];\n rel?: BaseLinkProps['rel'];\n size?: 'xsmall' | 'small' | 'medium' | 'large';\n id?: string;\n tabIndex?: BaseBoxProps['tabIndex'];\n iconPosition?: 'left' | 'right';\n isDisabled?: boolean;\n isFullWidth?: boolean;\n onKeyDown?: Platform.Select<{\n native: (event: GestureResponderEvent) => void;\n web: (event: React.KeyboardEvent<HTMLButtonElement>) => void;\n }>;\n onClick?: Platform.Select<{\n native: (event: GestureResponderEvent) => void;\n web: (event: React.MouseEvent<HTMLButtonElement>) => void;\n }>;\n type?: 'button' | 'reset' | 'submit';\n isLoading?: boolean;\n accessibilityProps?: Partial<AccessibilityProps>;\n variant?: 'primary' | 'secondary' | 'tertiary';\n color?: 'primary' | 'white' | 'positive' | 'negative' | 'notice' | 'information' | 'neutral';\n} & TestID &\n StyledPropsBlade &\n BladeCommonEvents;\n\n/*\nMandatory children prop when icon is not provided\n*/\ntype BaseButtonWithoutIconProps = BaseButtonCommonProps & {\n icon?: undefined;\n children: StringChildrenType;\n} & DataAnalyticsAttribute;\n\n/*\n Optional children prop when icon is provided\n*/\ntype BaseButtonWithIconProps = BaseButtonCommonProps & {\n icon: IconComponent;\n children?: StringChildrenType;\n} & DataAnalyticsAttribute;\n\n/*\n With or without icon prop. We need at least an icon or a children prop present.\n*/\nexport type BaseButtonProps = BaseButtonWithIconProps | BaseButtonWithoutIconProps;\n\ntype BaseButtonColorTokenModifiers = {\n variant: NonNullable<BaseButtonProps['variant']>;\n state: 'default' | 'hover' | 'focus' | 'disabled';\n color: BaseButtonProps['color'];\n};\n\nconst getRenderElement = (href?: string): 'a' | 'button' | undefined => {\n if (isReactNative()) {\n return undefined; // as property doesn't work with react native\n }\n\n if (href) {\n return 'a';\n }\n\n return 'button';\n};\n\nexport const getBackgroundColorToken = ({\n property,\n variant,\n state,\n color,\n}: BaseButtonColorTokenModifiers & {\n property: 'background' | 'border';\n}): DotNotationToken<Theme['colors']> => {\n const _state = state === 'focus' || state === 'hover' ? 'highlighted' : state;\n const tokens = backgroundColor(property);\n\n if (color === 'white') {\n return tokens.white[variant][_state];\n }\n\n if (color && color !== 'primary') {\n if (variant === 'tertiary') {\n throw new Error(\n `Tertiary variant can only be used with color: \"primary\" or \"white\" but received \"${color}\"`,\n );\n }\n return tokens.color(color)[variant][_state];\n }\n\n return tokens.base[variant][_state];\n};\n\nexport const getTextColorToken = ({\n property,\n variant,\n state,\n color,\n}: BaseButtonColorTokenModifiers & {\n property: 'icon' | 'text';\n}): DotNotationToken<Theme['colors']> => {\n const tokens = textColor(property);\n const _state = state === 'focus' || state === 'hover' ? 'highlighted' : state;\n\n if (color === 'white') {\n return tokens.white[variant][_state];\n }\n\n if (color && color !== 'primary') {\n if (variant === 'tertiary') {\n throw new Error(\n `Tertiary variant can only be used with color: \"primary\" or \"white\" but received \"${color}\"`,\n );\n }\n return tokens.color(color)[variant][_state];\n }\n\n return tokens.base[variant][_state];\n};\n\nconst getProps = ({\n buttonTypographyTokens,\n childrenString,\n isDisabled,\n size,\n theme,\n variant,\n color,\n hasIcon,\n}: {\n buttonTypographyTokens: ButtonTypography;\n childrenString?: string;\n isDisabled: boolean;\n hasIcon: boolean;\n theme: Theme;\n size: NonNullable<BaseButtonProps['size']>;\n variant: NonNullable<BaseButtonProps['variant']>;\n color: BaseButtonProps['color'];\n}): BaseButtonStyleProps => {\n if (variant === 'tertiary' && color !== 'primary' && color !== 'white') {\n throwBladeError({\n moduleName: 'BaseButton',\n message: `Tertiary variant can only be used with color: \"primary\" or \"white\" but received \"${color}\"`,\n });\n }\n\n const isIconOnly = hasIcon && (!childrenString || childrenString?.trim().length === 0);\n const props: BaseButtonStyleProps = {\n iconSize: isIconOnly ? buttonIconOnlySizeToIconSizeMap[size] : buttonSizeToIconSizeMap[size],\n spinnerSize: buttonSizeToSpinnerSizeMap[size],\n fontSize: buttonTypographyTokens.fonts.size[size],\n lineHeight: buttonTypographyTokens.lineHeights[size],\n minHeight: makeSize(buttonMinHeight[size]),\n height: isIconOnly ? buttonIconOnlyHeightWidth[size] : undefined,\n width: isIconOnly ? buttonIconOnlyHeightWidth[size] : undefined,\n iconPadding:\n hasIcon && childrenString?.trim() ? `spacing.${buttonIconPadding[size]}` : undefined,\n iconColor: getTextColorToken({\n property: 'icon',\n variant,\n color,\n state: 'default',\n }) as IconColor,\n textColor: getTextColorToken({\n property: 'text',\n variant,\n color,\n state: 'default',\n }) as BaseTextProps['color'],\n buttonPaddingTop: isIconOnly ? makeSpace(0) : makeSpace(theme.spacing[buttonPadding[size].top]),\n buttonPaddingBottom: isIconOnly\n ? makeSpace(0)\n : makeSpace(theme.spacing[buttonPadding[size].bottom]),\n buttonPaddingLeft: isIconOnly\n ? makeSpace(0)\n : makeSpace(theme.spacing[buttonPadding[size].left]),\n buttonPaddingRight: isIconOnly\n ? makeSpace(0)\n : makeSpace(theme.spacing[buttonPadding[size].right]),\n text: childrenString?.trim(),\n defaultBackgroundColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'background', variant, color, state: 'default' }),\n ),\n defaultBorderColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'border', variant, color, state: 'default' }),\n ),\n hoverBackgroundColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'background', variant, color, state: 'hover' }),\n ),\n hoverBorderColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'border', variant, color, state: 'hover' }),\n ),\n focusBackgroundColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'background', variant, color, state: 'focus' }),\n ),\n focusBorderColor: getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'border', variant, color, state: 'focus' }),\n ),\n focusRingColor: getIn(theme.colors, 'surface.border.primary.muted'),\n borderWidth: variant == 'secondary' ? makeBorderSize(theme.border.width.thin) : '0px',\n borderRadius: makeBorderSize(theme.border.radius.medium),\n motionDuration: 'duration.xquick',\n motionEasing: 'easing.standard',\n };\n\n if (isDisabled) {\n const disabledBackgroundColor = getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'background', variant, color, state: 'disabled' }),\n );\n const disabledBorderColor = getIn(\n theme.colors,\n getBackgroundColorToken({ property: 'border', variant, color, state: 'disabled' }),\n );\n props.iconColor = getTextColorToken({\n property: 'icon',\n variant,\n color,\n state: 'disabled',\n }) as IconColor;\n props.textColor = getTextColorToken({\n property: 'text',\n variant,\n color,\n state: 'disabled',\n }) as BaseTextProps['color'];\n props.defaultBackgroundColor = disabledBackgroundColor;\n props.defaultBorderColor = disabledBorderColor;\n props.hoverBackgroundColor = disabledBackgroundColor;\n props.hoverBorderColor = disabledBorderColor;\n props.focusBackgroundColor = disabledBackgroundColor;\n props.focusBorderColor = disabledBorderColor;\n }\n\n return props;\n};\n\nconst ButtonContent = styled(BaseBox)<{ isHidden: boolean }>(({ isHidden }) => ({\n opacity: isHidden ? 0 : 1,\n}));\n\nconst _BaseButton: React.ForwardRefRenderFunction<BladeElementRef, BaseButtonProps> = (\n {\n href,\n target,\n rel,\n tabIndex,\n id,\n variant = 'primary',\n color = 'primary',\n size = 'medium',\n icon: Icon,\n iconPosition = 'left',\n isDisabled = false,\n isFullWidth = false,\n isLoading = false,\n onClick,\n onBlur,\n onKeyDown,\n type = 'button',\n children,\n testID,\n onFocus,\n onMouseLeave,\n onMouseMove,\n onMouseDown,\n onPointerDown,\n onPointerEnter,\n accessibilityProps,\n onTouchEnd,\n onTouchStart,\n ...rest\n },\n ref,\n) => {\n const { theme } = useTheme();\n const buttonGroupProps = useButtonGroupContext();\n const [isPressed, setIsPressed] = React.useState(false);\n const isLink = Boolean(href);\n const childrenString = getStringFromReactText(children);\n const isChildrenComponent = React.isValidElement(children);\n\n // Button cannot be disabled when its rendered as Link\n // button should be allowed to be disabled in any case...\n // either through button group or we should allow to disable an individual button\n const disabled = buttonGroupProps.isDisabled || isLoading || (isDisabled && !isLink);\n\n if (__DEV__) {\n if (!Icon && !childrenString?.trim()) {\n throwBladeError({\n message: 'At least one of icon or text is required to render a button.',\n moduleName: 'BaseButton',\n });\n }\n }\n\n const prevLoading = usePrevious(isLoading);\n\n React.useEffect(() => {\n if (isLoading) announce('Started loading');\n\n if (!isLoading && prevLoading) announce('Stopped loading');\n }, [isLoading, prevLoading]);\n\n const {\n defaultBorderColor,\n defaultBackgroundColor,\n minHeight,\n height,\n width,\n buttonPaddingTop,\n buttonPaddingBottom,\n buttonPaddingLeft,\n buttonPaddingRight,\n focusBorderColor,\n focusBackgroundColor,\n focusRingColor,\n fontSize,\n hoverBorderColor,\n hoverBackgroundColor,\n iconColor,\n iconSize,\n iconPadding,\n spinnerSize,\n lineHeight,\n text,\n textColor,\n borderWidth,\n borderRadius,\n motionDuration,\n motionEasing,\n } = getProps({\n buttonTypographyTokens: buttonTypography,\n childrenString,\n isDisabled: disabled,\n size: buttonGroupProps.size ?? size,\n variant: buttonGroupProps.variant ?? variant,\n theme,\n color: buttonGroupProps.color ?? color,\n hasIcon: Boolean(Icon),\n });\n\n const renderElement = React.useMemo(() => getRenderElement(href), [href]);\n const defaultRole = isLink ? 'link' : 'button';\n\n const handlePointerPressedIn = React.useCallback(() => {\n if (disabled) return;\n setIsPressed(true);\n }, [disabled]);\n\n const handlePointerPressedOut = React.useCallback(() => {\n if (disabled) return;\n setIsPressed(false);\n }, [disabled]);\n\n const handleKeyboardPressedIn = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (disabled) return;\n if (e.key === ' ' || e.key === 'Enter') {\n setIsPressed(true);\n }\n },\n [disabled],\n );\n\n const handleKeyboardPressedOut = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (disabled) return;\n if (e.key === ' ' || e.key === 'Enter') {\n setIsPressed(false);\n }\n },\n [disabled],\n );\n\n return (\n <StyledBaseButton\n ref={ref as any}\n id={id}\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error\n // @ts-ignore: On React Native it will always be undefined but TS doesn't understand that\n as={renderElement}\n href={href}\n target={target}\n rel={rel}\n accessibilityProps={{\n ...makeAccessible({\n ...accessibilityProps,\n role: accessibilityProps?.role ?? defaultRole,\n }),\n }}\n variant={variant}\n isLoading={isLoading}\n disabled={disabled}\n defaultBorderColor={defaultBorderColor}\n minHeight={minHeight}\n buttonPaddingTop={buttonPaddingTop}\n buttonPaddingBottom={buttonPaddingBottom}\n buttonPaddingLeft={buttonPaddingLeft}\n buttonPaddingRight={buttonPaddingRight}\n defaultBackgroundColor={defaultBackgroundColor}\n focusBorderColor={focusBorderColor}\n focusBackgroundColor={focusBackgroundColor}\n focusRingColor={focusRingColor}\n hoverBorderColor={hoverBorderColor}\n hoverBackgroundColor={hoverBackgroundColor}\n isFullWidth={buttonGroupProps.isFullWidth ?? isFullWidth}\n onClick={onClick}\n onBlur={onBlur}\n onFocus={onFocus}\n onMouseLeave={onMouseLeave}\n onMouseMove={onMouseMove}\n tabIndex={tabIndex}\n onPointerDown={onPointerDown}\n onPointerEnter={onPointerEnter}\n // Setting type for web fails it on native typecheck and vice versa\n onKeyDown={(event: any) => {\n handleKeyboardPressedIn(event);\n onKeyDown?.(event);\n }}\n onTouchStart={(event: React.TouchEvent) => {\n handlePointerPressedIn();\n onTouchStart?.(event);\n }}\n onTouchEnd={(event: React.TouchEvent) => {\n handlePointerPressedOut();\n onTouchEnd?.(event);\n }}\n type={type}\n borderWidth={borderWidth}\n borderRadius={borderRadius}\n motionDuration={motionDuration}\n motionEasing={motionEasing}\n height={height}\n width={width}\n isPressed={isPressed}\n onMouseDown={(event: React.MouseEvent) => {\n handlePointerPressedIn();\n onMouseDown?.(event);\n }}\n onMouseUp={handlePointerPressedOut}\n onMouseOut={handlePointerPressedOut}\n onKeyUp={handleKeyboardPressedOut}\n {...metaAttribute({ name: MetaConstants.Button, testID })}\n {...getStyledProps(rest)}\n {...makeAnalyticsAttribute(rest)}\n >\n <AnimatedButtonContent\n motionDuration={motionDuration}\n motionEasing={motionEasing}\n isPressed={isPressed}\n >\n {isLoading ? (\n <BaseBox\n display=\"flex\"\n justifyContent=\"center\"\n alignItems=\"center\"\n position=\"absolute\"\n top=\"0px\"\n left=\"0px\"\n bottom=\"0px\"\n right=\"0px\"\n zIndex={1}\n >\n <BaseSpinner accessibilityLabel=\"Loading\" size={spinnerSize} color={color} />\n </BaseBox>\n ) : null}\n <ButtonContent\n display=\"flex\"\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n flex={1}\n isHidden={isLoading}\n zIndex={1}\n >\n {Icon && iconPosition == 'left' ? (\n <BaseBox\n paddingRight={iconPadding}\n display=\"flex\"\n justifyContent=\"center\"\n alignItems=\"center\"\n >\n <Icon size={iconSize} color={iconColor} />\n </BaseBox>\n ) : null}\n {text ? (\n isChildrenComponent ? (\n children\n ) : (\n <BaseText\n lineHeight={lineHeight}\n fontSize={fontSize}\n // figma and web have different font-smoothing properties\n // which causes web version of button text to look much bolder\n // than figma version. To fix this we are changing font-weight from 600 to 500\n // https://forum.figma.com/t/why-does-a-font-weight-in-figma-seem-lighter-than-the-same-weight-in-the-browser/2207\n fontWeight=\"medium\"\n textAlign=\"center\"\n color={textColor}\n >\n {text}\n </BaseText>\n )\n ) : null}\n {Icon && iconPosition == 'right' ? (\n <BaseBox\n paddingLeft={iconPadding}\n display=\"flex\"\n justifyContent=\"center\"\n alignItems=\"center\"\n >\n <Icon size={iconSize} color={iconColor} />\n </BaseBox>\n ) : null}\n </ButtonContent>\n </AnimatedButtonContent>\n </StyledBaseButton>\n );\n};\n\nconst BaseButton = assignWithoutSideEffects(React.forwardRef(_BaseButton), {\n displayName: 'BaseButton',\n});\n\nexport default BaseButton;\n"],"names":["getRenderElement","href","isReactNative","undefined","getBackgroundColorToken","_ref","property","variant","state","color","_state","tokens","backgroundColor","white","Error","base","getTextColorToken","_ref2","textColor","getProps","_ref3","buttonTypographyTokens","childrenString","isDisabled","size","theme","hasIcon","throwBladeError","moduleName","message","isIconOnly","trim","length","props","iconSize","buttonIconOnlySizeToIconSizeMap","buttonSizeToIconSizeMap","spinnerSize","buttonSizeToSpinnerSizeMap","fontSize","fonts","lineHeight","lineHeights","minHeight","makeSize","buttonMinHeight","height","buttonIconOnlyHeightWidth","width","iconPadding","buttonIconPadding","iconColor","buttonPaddingTop","makeSpace","spacing","buttonPadding","top","buttonPaddingBottom","bottom","buttonPaddingLeft","left","buttonPaddingRight","right","text","defaultBackgroundColor","getIn","colors","defaultBorderColor","hoverBackgroundColor","hoverBorderColor","focusBackgroundColor","focusBorderColor","focusRingColor","borderWidth","makeBorderSize","border","thin","borderRadius","radius","medium","motionDuration","motionEasing","disabledBackgroundColor","disabledBorderColor","ButtonContent","styled","BaseBox","_ref4","isHidden","opacity","_BaseButton","_ref5","ref","_buttonGroupProps$siz","_buttonGroupProps$var","_buttonGroupProps$col","_accessibilityProps$r","_buttonGroupProps$isF","target","rel","tabIndex","id","_ref5$variant","_ref5$color","_ref5$size","Icon","icon","_ref5$iconPosition","iconPosition","_ref5$isDisabled","_ref5$isFullWidth","isFullWidth","_ref5$isLoading","isLoading","onClick","onBlur","onKeyDown","_ref5$type","type","children","testID","onFocus","onMouseLeave","onMouseMove","onMouseDown","onPointerDown","onPointerEnter","accessibilityProps","onTouchEnd","onTouchStart","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","buttonGroupProps","useButtonGroupContext","_React$useState","React","useState","_React$useState2","_slicedToArray","isPressed","setIsPressed","isLink","Boolean","getStringFromReactText","isChildrenComponent","isValidElement","disabled","__DEV__","prevLoading","usePrevious","useEffect","announce","_getProps","buttonTypography","renderElement","useMemo","defaultRole","handlePointerPressedIn","useCallback","handlePointerPressedOut","handleKeyboardPressedIn","e","key","handleKeyboardPressedOut","_jsx","StyledBaseButton","Object","assign","as","makeAccessible","role","event","onMouseUp","onMouseOut","onKeyUp","metaAttribute","name","MetaConstants","Button","getStyledProps","makeAnalyticsAttribute","_jsxs","AnimatedButtonContent","display","justifyContent","alignItems","position","zIndex","BaseSpinner","accessibilityLabel","flexDirection","flex","paddingRight","BaseText","fontWeight","textAlign","paddingLeft","BaseButton","assignWithoutSideEffects","forwardRef","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,IAAA,SAAA,CAAA,CAAA,MAAA,CAAA,QAAA,CAAA,KAAA,CAAA,UAAA,CAAA,IAAA,CAAA,SAAA,CAAA,OAAA,CAAA,MAAA,CAAA,MAAA,CAAA,cAAA,CAAA,YAAA,CAAA,aAAA,CAAA,WAAA,CAAA,SAAA,CAAA,QAAA,CAAA,WAAA,CAAA,MAAA,CAAA,UAAA,CAAA,QAAA,CAAA,SAAA,CAAA,cAAA,CAAA,aAAA,CAAA,aAAA,CAAA,eAAA,CAAA,gBAAA,CAAA,oBAAA,CAAA,YAAA,CAAA,cAAA,CAAA,CA6GA,IAAMA,gBAAgB,CAAG,SAAnBA,gBAAgBA,CAAIC,IAAa,CAAiC,CACtE,GAAIC,aAAa,EAAE,CAAE,CACnB,OAAOC,SAAS,CAClB,CAEA,GAAIF,IAAI,CAAE,CACR,OAAO,GAAG,CACZ,CAEA,OAAO,QAAQ,CACjB,CAAC,CAEY,IAAAG,uBAAuB,CAAG,SAA1BA,uBAAuBA,CAAAC,IAAA,CAOK,CANvC,IAAAC,QAAQ,CAAAD,IAAA,CAARC,QAAQ,CACRC,OAAO,CAAAF,IAAA,CAAPE,OAAO,CACPC,KAAK,CAAAH,IAAA,CAALG,KAAK,CACLC,KAAK,CAAAJ,IAAA,CAALI,KAAK,CAIL,IAAMC,MAAM,CAAGF,KAAK,GAAK,OAAO,EAAIA,KAAK,GAAK,OAAO,CAAG,aAAa,CAAGA,KAAK,CAC7E,IAAMG,MAAM,CAAGC,eAAe,CAACN,QAAQ,CAAC,CAExC,GAAIG,KAAK,GAAK,OAAO,CAAE,CACrB,OAAOE,MAAM,CAACE,KAAK,CAACN,OAAO,CAAC,CAACG,MAAM,CAAC,CACtC,CAEA,GAAID,KAAK,EAAIA,KAAK,GAAK,SAAS,CAAE,CAChC,GAAIF,OAAO,GAAK,UAAU,CAAE,CAC1B,MAAM,IAAIO,KAAK,CACZ,CAAmFL,iFAAAA,EAAAA,KAAM,GAC5F,CAAC,CACH,CACA,OAAOE,MAAM,CAACF,KAAK,CAACA,KAAK,CAAC,CAACF,OAAO,CAAC,CAACG,MAAM,CAAC,CAC7C,CAEA,OAAOC,MAAM,CAACI,IAAI,CAACR,OAAO,CAAC,CAACG,MAAM,CAAC,CACrC,EAEa,IAAAM,iBAAiB,CAAG,SAApBA,iBAAiBA,CAAAC,KAAA,CAOW,CAAA,IANvCX,QAAQ,CAAAW,KAAA,CAARX,QAAQ,CACRC,OAAO,CAAAU,KAAA,CAAPV,OAAO,CACPC,KAAK,CAAAS,KAAA,CAALT,KAAK,CACLC,KAAK,CAAAQ,KAAA,CAALR,KAAK,CAIL,IAAME,MAAM,CAAGO,SAAS,CAACZ,QAAQ,CAAC,CAClC,IAAMI,MAAM,CAAGF,KAAK,GAAK,OAAO,EAAIA,KAAK,GAAK,OAAO,CAAG,aAAa,CAAGA,KAAK,CAE7E,GAAIC,KAAK,GAAK,OAAO,CAAE,CACrB,OAAOE,MAAM,CAACE,KAAK,CAACN,OAAO,CAAC,CAACG,MAAM,CAAC,CACtC,CAEA,GAAID,KAAK,EAAIA,KAAK,GAAK,SAAS,CAAE,CAChC,GAAIF,OAAO,GAAK,UAAU,CAAE,CAC1B,MAAU,IAAAO,KAAK,CACZ,oFAAmFL,KAAM,CAAA,CAAA,CAC5F,CAAC,CACH,CACA,OAAOE,MAAM,CAACF,KAAK,CAACA,KAAK,CAAC,CAACF,OAAO,CAAC,CAACG,MAAM,CAAC,CAC7C,CAEA,OAAOC,MAAM,CAACI,IAAI,CAACR,OAAO,CAAC,CAACG,MAAM,CAAC,CACrC,EAEA,IAAMS,QAAQ,CAAG,SAAXA,QAAQA,CAAAC,KAAA,CAkBc,KAjB1BC,sBAAsB,CAAAD,KAAA,CAAtBC,sBAAsB,CACtBC,cAAc,CAAAF,KAAA,CAAdE,cAAc,CACdC,UAAU,CAAAH,KAAA,CAAVG,UAAU,CACVC,IAAI,CAAAJ,KAAA,CAAJI,IAAI,CACJC,KAAK,CAAAL,KAAA,CAALK,KAAK,CACLlB,OAAO,CAAAa,KAAA,CAAPb,OAAO,CACPE,KAAK,CAAAW,KAAA,CAALX,KAAK,CACLiB,OAAO,CAAAN,KAAA,CAAPM,OAAO,CAWP,GAAInB,OAAO,GAAK,UAAU,EAAIE,KAAK,GAAK,SAAS,EAAIA,KAAK,GAAK,OAAO,CAAE,CACtEkB,eAAe,CAAC,CACdC,UAAU,CAAE,YAAY,CACxBC,OAAO,CAAG,CAAmFpB,iFAAAA,EAAAA,KAAM,CACrG,CAAA,CAAA,CAAC,CAAC,CACJ,CAEA,IAAMqB,UAAU,CAAGJ,OAAO,GAAK,CAACJ,cAAc,EAAI,CAAAA,cAAc,EAAA,IAAA,CAAA,KAAA,CAAA,CAAdA,cAAc,CAAES,IAAI,EAAE,CAACC,MAAM,IAAK,CAAC,CAAC,CACtF,IAAMC,KAA2B,CAAG,CAClCC,QAAQ,CAAEJ,UAAU,CAAGK,+BAA+B,CAACX,IAAI,CAAC,CAAGY,uBAAuB,CAACZ,IAAI,CAAC,CAC5Fa,WAAW,CAAEC,0BAA0B,CAACd,IAAI,CAAC,CAC7Ce,QAAQ,CAAElB,sBAAsB,CAACmB,KAAK,CAAChB,IAAI,CAACA,IAAI,CAAC,CACjDiB,UAAU,CAAEpB,sBAAsB,CAACqB,WAAW,CAAClB,IAAI,CAAC,CACpDmB,SAAS,CAAEC,QAAQ,CAACC,SAAe,CAACrB,IAAI,CAAC,CAAC,CAC1CsB,MAAM,CAAEhB,UAAU,CAAGiB,yBAAyB,CAACvB,IAAI,CAAC,CAAGrB,SAAS,CAChE6C,KAAK,CAAElB,UAAU,CAAGiB,yBAAyB,CAACvB,IAAI,CAAC,CAAGrB,SAAS,CAC/D8C,WAAW,CACTvB,OAAO,EAAIJ,cAAc,EAAdA,IAAAA,EAAAA,cAAc,CAAES,IAAI,EAAE,CAAI,CAAUmB,QAAAA,EAAAA,iBAAiB,CAAC1B,IAAI,CAAE,EAAC,CAAGrB,SAAS,CACtFgD,SAAS,CAAEnC,iBAAiB,CAAC,CAC3BV,QAAQ,CAAE,MAAM,CAChBC,OAAO,CAAPA,OAAO,CACPE,KAAK,CAALA,KAAK,CACLD,KAAK,CAAE,SACT,CAAC,CAAc,CACfU,SAAS,CAAEF,iBAAiB,CAAC,CAC3BV,QAAQ,CAAE,MAAM,CAChBC,OAAO,CAAPA,OAAO,CACPE,KAAK,CAALA,KAAK,CACLD,KAAK,CAAE,SACT,CAAC,CAA2B,CAC5B4C,gBAAgB,CAAEtB,UAAU,CAAGuB,SAAS,CAAC,CAAC,CAAC,CAAGA,SAAS,CAAC5B,KAAK,CAAC6B,OAAO,CAACC,aAAa,CAAC/B,IAAI,CAAC,CAACgC,GAAG,CAAC,CAAC,CAC/FC,mBAAmB,CAAE3B,UAAU,CAC3BuB,SAAS,CAAC,CAAC,CAAC,CACZA,SAAS,CAAC5B,KAAK,CAAC6B,OAAO,CAACC,aAAa,CAAC/B,IAAI,CAAC,CAACkC,MAAM,CAAC,CAAC,CACxDC,iBAAiB,CAAE7B,UAAU,CACzBuB,SAAS,CAAC,CAAC,CAAC,CACZA,SAAS,CAAC5B,KAAK,CAAC6B,OAAO,CAACC,aAAa,CAAC/B,IAAI,CAAC,CAACoC,IAAI,CAAC,CAAC,CACtDC,kBAAkB,CAAE/B,UAAU,CAC1BuB,SAAS,CAAC,CAAC,CAAC,CACZA,SAAS,CAAC5B,KAAK,CAAC6B,OAAO,CAACC,aAAa,CAAC/B,IAAI,CAAC,CAACsC,KAAK,CAAC,CAAC,CACvDC,IAAI,CAAEzC,cAAc,EAAA,IAAA,CAAA,KAAA,CAAA,CAAdA,cAAc,CAAES,IAAI,EAAE,CAC5BiC,sBAAsB,CAAEC,KAAK,CAC3BxC,KAAK,CAACyC,MAAM,CACZ9D,uBAAuB,CAAC,CAAEE,QAAQ,CAAE,YAAY,CAAEC,OAAO,CAAPA,OAAO,CAAEE,KAAK,CAALA,KAAK,CAAED,KAAK,CAAE,SAAU,CAAC,CACtF,CAAC,CACD2D,kBAAkB,CAAEF,KAAK,CACvBxC,KAAK,CAACyC,MAAM,CACZ9D,uBAAuB,CAAC,CAAEE,QAAQ,CAAE,QAAQ,CAAEC,OAAO,CAAPA,OAAO,CAAEE,KAAK,CAALA,KAAK,CAAED,KAAK,CAAE,SAAU,CAAC,CAClF,CAAC,CACD4D,oBAAoB,CAAEH,KAAK,CACzBxC,KAAK,CAACyC,MAAM,CACZ9D,uBAAuB,CAAC,CAAEE,QAAQ,CAAE,YAAY,CAAEC,OAAO,CAAPA,OAAO,CAAEE,KAAK,CAALA,KAAK,CAAED,KAAK,CAAE,OAAQ,CAAC,CACpF,CAAC,CACD6D,gBAAgB,CAAEJ,KAAK,CACrBxC,KAAK,CAACyC,MAAM,CACZ9D,uBAAuB,CAAC,CAAEE,QAAQ,CAAE,QAAQ,CAAEC,OAAO,CAAPA,OAAO,CAAEE,KAAK,CAALA,KAAK,CAAED,KAAK,CAAE,OAAQ,CAAC,CAChF,CAAC,CACD8D,oBAAoB,CAAEL,KAAK,CACzBxC,KAAK,CAACyC,MAAM,CACZ9D,uBAAuB,CAAC,CAAEE,QAAQ,CAAE,YAAY,CAAEC,OAAO,CAAPA,OAAO,CAAEE,KAAK,CAALA,KAAK,CAAED,KAAK,CAAE,OAAQ,CAAC,CACpF,CAAC,CACD+D,gBAAgB,CAAEN,KAAK,CACrBxC,KAAK,CAACyC,MAAM,CACZ9D,uBAAuB,CAAC,CAAEE,QAAQ,CAAE,QAAQ,CAAEC,OAAO,CAAPA,OAAO,CAAEE,KAAK,CAALA,KAAK,CAAED,KAAK,CAAE,OAAQ,CAAC,CAChF,CAAC,CACDgE,cAAc,CAAEP,KAAK,CAACxC,KAAK,CAACyC,MAAM,CAAE,8BAA8B,CAAC,CACnEO,WAAW,CAAElE,OAAO,EAAI,WAAW,CAAGmE,cAAc,CAACjD,KAAK,CAACkD,MAAM,CAAC3B,KAAK,CAAC4B,IAAI,CAAC,CAAG,KAAK,CACrFC,YAAY,CAAEH,cAAc,CAACjD,KAAK,CAACkD,MAAM,CAACG,MAAM,CAACC,MAAM,CAAC,CACxDC,cAAc,CAAE,iBAAiB,CACjCC,YAAY,CAAE,iBAChB,CAAC,CAED,GAAI1D,UAAU,CAAE,CACd,IAAM2D,uBAAuB,CAAGjB,KAAK,CACnCxC,KAAK,CAACyC,MAAM,CACZ9D,uBAAuB,CAAC,CAAEE,QAAQ,CAAE,YAAY,CAAEC,OAAO,CAAPA,OAAO,CAAEE,KAAK,CAALA,KAAK,CAAED,KAAK,CAAE,UAAW,CAAC,CACvF,CAAC,CACD,IAAM2E,mBAAmB,CAAGlB,KAAK,CAC/BxC,KAAK,CAACyC,MAAM,CACZ9D,uBAAuB,CAAC,CAAEE,QAAQ,CAAE,QAAQ,CAAEC,OAAO,CAAPA,OAAO,CAAEE,KAAK,CAALA,KAAK,CAAED,KAAK,CAAE,UAAW,CAAC,CACnF,CAAC,CACDyB,KAAK,CAACkB,SAAS,CAAGnC,iBAAiB,CAAC,CAClCV,QAAQ,CAAE,MAAM,CAChBC,OAAO,CAAPA,OAAO,CACPE,KAAK,CAALA,KAAK,CACLD,KAAK,CAAE,UACT,CAAC,CAAc,CACfyB,KAAK,CAACf,SAAS,CAAGF,iBAAiB,CAAC,CAClCV,QAAQ,CAAE,MAAM,CAChBC,OAAO,CAAPA,OAAO,CACPE,KAAK,CAALA,KAAK,CACLD,KAAK,CAAE,UACT,CAAC,CAA2B,CAC5ByB,KAAK,CAAC+B,sBAAsB,CAAGkB,uBAAuB,CACtDjD,KAAK,CAACkC,kBAAkB,CAAGgB,mBAAmB,CAC9ClD,KAAK,CAACmC,oBAAoB,CAAGc,uBAAuB,CACpDjD,KAAK,CAACoC,gBAAgB,CAAGc,mBAAmB,CAC5ClD,KAAK,CAACqC,oBAAoB,CAAGY,uBAAuB,CACpDjD,KAAK,CAACsC,gBAAgB,CAAGY,mBAAmB,CAC9C,CAEA,OAAOlD,KAAK,CACd,CAAC,CAED,IAAMmD,aAAa,CAAGC,MAAM,CAACC,OAAO,CAAC,CAAwB,SAAAC,KAAA,CAAA,CAAA,IAAGC,QAAQ,CAAAD,KAAA,CAARC,QAAQ,CAAA,OAAQ,CAC9EC,OAAO,CAAED,QAAQ,CAAG,CAAC,CAAG,CAC1B,CAAC,CAAA,CAAC,CAAC,CAEH,IAAME,WAA6E,CAAG,SAAhFA,WAA6EA,CAAAC,KAAA,CAgCjFC,GAAG,CACA,CAAA,IAAAC,qBAAA,CAAAC,qBAAA,CAAAC,qBAAA,CAAAC,qBAAA,CAAAC,qBAAA,CA/BD,IAAAhG,IAAI,CAAA0F,KAAA,CAAJ1F,IAAI,CACJiG,MAAM,CAAAP,KAAA,CAANO,MAAM,CACNC,GAAG,CAAAR,KAAA,CAAHQ,GAAG,CACHC,QAAQ,CAAAT,KAAA,CAARS,QAAQ,CACRC,EAAE,CAAAV,KAAA,CAAFU,EAAE,CAAAC,aAAA,CAAAX,KAAA,CACFpF,OAAO,CAAPA,OAAO,CAAA+F,aAAA,GAAG,KAAA,CAAA,CAAA,SAAS,CAAAA,aAAA,CAAAC,WAAA,CAAAZ,KAAA,CACnBlF,KAAK,CAALA,KAAK,CAAA8F,WAAA,GAAA,KAAA,CAAA,CAAG,SAAS,CAAAA,WAAA,CAAAC,UAAA,CAAAb,KAAA,CACjBnE,IAAI,CAAJA,IAAI,CAAAgF,UAAA,UAAG,QAAQ,CAAAA,UAAA,CACTC,IAAI,CAAAd,KAAA,CAAVe,IAAI,CAAAC,kBAAA,CAAAhB,KAAA,CACJiB,YAAY,CAAZA,YAAY,CAAAD,kBAAA,GAAA,KAAA,CAAA,CAAG,MAAM,CAAAA,kBAAA,CAAAE,gBAAA,CAAAlB,KAAA,CACrBpE,UAAU,CAAVA,UAAU,CAAAsF,gBAAA,GAAG,KAAA,CAAA,CAAA,KAAK,CAAAA,gBAAA,CAAAC,iBAAA,CAAAnB,KAAA,CAClBoB,WAAW,CAAXA,WAAW,CAAAD,iBAAA,GAAA,KAAA,CAAA,CAAG,KAAK,CAAAA,iBAAA,CAAAE,eAAA,CAAArB,KAAA,CACnBsB,SAAS,CAATA,SAAS,CAAAD,eAAA,UAAG,KAAK,CAAAA,eAAA,CACjBE,OAAO,CAAAvB,KAAA,CAAPuB,OAAO,CACPC,MAAM,CAAAxB,KAAA,CAANwB,MAAM,CACNC,UAAS,CAAAzB,KAAA,CAATyB,SAAS,CAAAC,UAAA,CAAA1B,KAAA,CACT2B,IAAI,CAAJA,IAAI,CAAAD,UAAA,GAAG,KAAA,CAAA,CAAA,QAAQ,CAAAA,UAAA,CACfE,QAAQ,CAAA5B,KAAA,CAAR4B,QAAQ,CACRC,MAAM,CAAA7B,KAAA,CAAN6B,MAAM,CACNC,OAAO,CAAA9B,KAAA,CAAP8B,OAAO,CACPC,YAAY,CAAA/B,KAAA,CAAZ+B,YAAY,CACZC,WAAW,CAAAhC,KAAA,CAAXgC,WAAW,CACXC,YAAW,CAAAjC,KAAA,CAAXiC,WAAW,CACXC,aAAa,CAAAlC,KAAA,CAAbkC,aAAa,CACbC,cAAc,CAAAnC,KAAA,CAAdmC,cAAc,CACdC,kBAAkB,CAAApC,KAAA,CAAlBoC,kBAAkB,CAClBC,WAAU,CAAArC,KAAA,CAAVqC,UAAU,CACVC,aAAY,CAAAtC,KAAA,CAAZsC,YAAY,CACTC,IAAI,CAAAC,wBAAA,CAAAxC,KAAA,CAAAyC,SAAA,EAIT,IAAAC,SAAA,CAAkBC,QAAQ,EAAE,CAApB7G,KAAK,CAAA4G,SAAA,CAAL5G,KAAK,CACb,IAAM8G,gBAAgB,CAAGC,qBAAqB,EAAE,CAChD,IAAAC,eAAA,CAAkCC,cAAK,CAACC,QAAQ,CAAC,KAAK,CAAC,CAAAC,gBAAA,CAAAC,cAAA,CAAAJ,eAAA,CAAA,CAAA,CAAA,CAAhDK,SAAS,CAAAF,gBAAA,IAAEG,YAAY,CAAAH,gBAAA,CAC9B,CAAA,CAAA,CAAA,IAAMI,MAAM,CAAGC,OAAO,CAAChJ,IAAI,CAAC,CAC5B,IAAMqB,cAAc,CAAG4H,sBAAsB,CAAC3B,QAAQ,CAAC,CACvD,IAAM4B,mBAAmB,CAAGT,cAAK,CAACU,cAAc,CAAC7B,QAAQ,CAAC,CAK1D,IAAM8B,QAAQ,CAAGd,gBAAgB,CAAChH,UAAU,EAAI0F,SAAS,EAAK1F,UAAU,EAAI,CAACyH,MAAO,CAEpF,GAAIM,OAAO,CAAE,CACX,GAAI,CAAC7C,IAAI,EAAI,EAACnF,cAAc,QAAdA,cAAc,CAAES,IAAI,EAAE,CAAE,CAAA,CACpCJ,eAAe,CAAC,CACdE,OAAO,CAAE,8DAA8D,CACvED,UAAU,CAAE,YACd,CAAC,CAAC,CACJ,CACF,CAEA,IAAM2H,WAAW,CAAGC,WAAW,CAACvC,SAAS,CAAC,CAE1CyB,cAAK,CAACe,SAAS,CAAC,UAAM,CACpB,GAAIxC,SAAS,CAAEyC,QAAQ,CAAC,iBAAiB,CAAC,CAE1C,GAAI,CAACzC,SAAS,EAAIsC,WAAW,CAAEG,QAAQ,CAAC,iBAAiB,CAAC,CAC5D,CAAC,CAAE,CAACzC,SAAS,CAAEsC,WAAW,CAAC,CAAC,CAE5B,IAAAI,SAAA,CA2BIxI,QAAQ,CAAC,CACXE,sBAAsB,CAAEuI,UAAgB,CACxCtI,cAAc,CAAdA,cAAc,CACdC,UAAU,CAAE8H,QAAQ,CACpB7H,IAAI,CAAA,CAAAqE,qBAAA,CAAE0C,gBAAgB,CAAC/G,IAAI,GAAAqE,IAAAA,CAAAA,qBAAA,CAAIrE,IAAI,CACnCjB,OAAO,CAAA,CAAAuF,qBAAA,CAAEyC,gBAAgB,CAAChI,OAAO,QAAAuF,qBAAA,CAAIvF,OAAO,CAC5CkB,KAAK,CAALA,KAAK,CACLhB,KAAK,CAAA,CAAAsF,qBAAA,CAAEwC,gBAAgB,CAAC9H,KAAK,QAAAsF,qBAAA,CAAItF,KAAK,CACtCiB,OAAO,CAAEuH,OAAO,CAACxC,IAAI,CACvB,CAAC,CAAC,CAnCAtC,kBAAkB,CAAAwF,SAAA,CAAlBxF,kBAAkB,CAClBH,sBAAsB,CAAA2F,SAAA,CAAtB3F,sBAAsB,CACtBrB,SAAS,CAAAgH,SAAA,CAAThH,SAAS,CACTG,MAAM,CAAA6G,SAAA,CAAN7G,MAAM,CACNE,KAAK,CAAA2G,SAAA,CAAL3G,KAAK,CACLI,gBAAgB,CAAAuG,SAAA,CAAhBvG,gBAAgB,CAChBK,mBAAmB,CAAAkG,SAAA,CAAnBlG,mBAAmB,CACnBE,iBAAiB,CAAAgG,SAAA,CAAjBhG,iBAAiB,CACjBE,kBAAkB,CAAA8F,SAAA,CAAlB9F,kBAAkB,CAClBU,gBAAgB,CAAAoF,SAAA,CAAhBpF,gBAAgB,CAChBD,oBAAoB,CAAAqF,SAAA,CAApBrF,oBAAoB,CACpBE,cAAc,CAAAmF,SAAA,CAAdnF,cAAc,CACdjC,QAAQ,CAAAoH,SAAA,CAARpH,QAAQ,CACR8B,gBAAgB,CAAAsF,SAAA,CAAhBtF,gBAAgB,CAChBD,oBAAoB,CAAAuF,SAAA,CAApBvF,oBAAoB,CACpBjB,SAAS,CAAAwG,SAAA,CAATxG,SAAS,CACTjB,QAAQ,CAAAyH,SAAA,CAARzH,QAAQ,CACRe,WAAW,CAAA0G,SAAA,CAAX1G,WAAW,CACXZ,WAAW,CAAAsH,SAAA,CAAXtH,WAAW,CACXI,UAAU,CAAAkH,SAAA,CAAVlH,UAAU,CACVsB,IAAI,CAAA4F,SAAA,CAAJ5F,IAAI,CACJ7C,SAAS,CAAAyI,SAAA,CAATzI,SAAS,CACTuD,WAAW,CAAAkF,SAAA,CAAXlF,WAAW,CACXI,YAAY,CAAA8E,SAAA,CAAZ9E,YAAY,CACZG,cAAc,CAAA2E,SAAA,CAAd3E,cAAc,CACdC,YAAY,CAAA0E,SAAA,CAAZ1E,YAAY,CAYd,IAAM4E,aAAa,CAAGnB,cAAK,CAACoB,OAAO,CAAC,UAAA,CAAA,OAAM9J,gBAAgB,CAACC,IAAI,CAAC,GAAE,CAACA,IAAI,CAAC,CAAC,CACzE,IAAM8J,WAAW,CAAGf,MAAM,CAAG,MAAM,CAAG,QAAQ,CAE9C,IAAMgB,sBAAsB,CAAGtB,cAAK,CAACuB,WAAW,CAAC,UAAM,CACrD,GAAIZ,QAAQ,CAAE,OACdN,YAAY,CAAC,IAAI,CAAC,CACpB,CAAC,CAAE,CAACM,QAAQ,CAAC,CAAC,CAEd,IAAMa,uBAAuB,CAAGxB,cAAK,CAACuB,WAAW,CAAC,UAAM,CACtD,GAAIZ,QAAQ,CAAE,OACdN,YAAY,CAAC,KAAK,CAAC,CACrB,CAAC,CAAE,CAACM,QAAQ,CAAC,CAAC,CAEd,IAAMc,uBAAuB,CAAGzB,cAAK,CAACuB,WAAW,CAC/C,SAACG,CAAsB,CAAK,CAC1B,GAAIf,QAAQ,CAAE,OACd,GAAIe,CAAC,CAACC,GAAG,GAAK,GAAG,EAAID,CAAC,CAACC,GAAG,GAAK,OAAO,CAAE,CACtCtB,YAAY,CAAC,IAAI,CAAC,CACpB,CACF,CAAC,CACD,CAACM,QAAQ,CACX,CAAC,CAED,IAAMiB,wBAAwB,CAAG5B,cAAK,CAACuB,WAAW,CAChD,SAACG,CAAsB,CAAK,CAC1B,GAAIf,QAAQ,CAAE,OACd,GAAIe,CAAC,CAACC,GAAG,GAAK,GAAG,EAAID,CAAC,CAACC,GAAG,GAAK,OAAO,CAAE,CACtCtB,YAAY,CAAC,KAAK,CAAC,CACrB,CACF,CAAC,CACD,CAACM,QAAQ,CACX,CAAC,CAED,OACEkB,GAAA,CAACC,gBAAgB,CAAAC,MAAA,CAAAC,MAAA,CACf9E,CAAAA,GAAG,CAAEA,GAAW,CAChBS,EAAE,CAAEA,EAAG,CAGPsE,EAAE,CAAEd,aAAc,CAClB5J,IAAI,CAAEA,IAAK,CACXiG,MAAM,CAAEA,MAAO,CACfC,GAAG,CAAEA,GAAI,CACT4B,kBAAkB,CAAA0C,MAAA,CAAAC,MAAA,CAAA,EAAA,CACbE,cAAc,CAAAH,MAAA,CAAAC,MAAA,CACZ3C,EAAAA,CAAAA,kBAAkB,EACrB8C,IAAI,CAAA,CAAA7E,qBAAA,CAAE+B,kBAAkB,EAAlBA,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,kBAAkB,CAAE8C,IAAI,QAAA7E,qBAAA,CAAI+D,WAAW,CAC9C,CAAA,CAAC,CACF,CACFxJ,OAAO,CAAEA,OAAQ,CACjB0G,SAAS,CAAEA,SAAU,CACrBoC,QAAQ,CAAEA,QAAS,CACnBlF,kBAAkB,CAAEA,kBAAmB,CACvCxB,SAAS,CAAEA,SAAU,CACrBS,gBAAgB,CAAEA,gBAAiB,CACnCK,mBAAmB,CAAEA,mBAAoB,CACzCE,iBAAiB,CAAEA,iBAAkB,CACrCE,kBAAkB,CAAEA,kBAAmB,CACvCG,sBAAsB,CAAEA,sBAAuB,CAC/CO,gBAAgB,CAAEA,gBAAiB,CACnCD,oBAAoB,CAAEA,oBAAqB,CAC3CE,cAAc,CAAEA,cAAe,CAC/BH,gBAAgB,CAAEA,gBAAiB,CACnCD,oBAAoB,CAAEA,oBAAqB,CAC3C2C,WAAW,CAAA,CAAAd,qBAAA,CAAEsC,gBAAgB,CAACxB,WAAW,GAAAd,IAAAA,CAAAA,qBAAA,CAAIc,WAAY,CACzDG,OAAO,CAAEA,OAAQ,CACjBC,MAAM,CAAEA,MAAO,CACfM,OAAO,CAAEA,OAAQ,CACjBC,YAAY,CAAEA,YAAa,CAC3BC,WAAW,CAAEA,WAAY,CACzBvB,QAAQ,CAAEA,QAAS,CACnByB,aAAa,CAAEA,aAAc,CAC7BC,cAAc,CAAEA,cAAe,CAE/BV,SAAS,CAAE,SAAAA,SAAAA,CAAC0D,KAAU,CAAK,CACzBX,uBAAuB,CAACW,KAAK,CAAC,CAC9B1D,UAAS,EAAA,IAAA,CAAA,KAAA,CAAA,CAATA,UAAS,CAAG0D,KAAK,CAAC,CACpB,CAAE,CACF7C,YAAY,CAAE,SAAAA,YAAAA,CAAC6C,KAAuB,CAAK,CACzCd,sBAAsB,EAAE,CACxB/B,aAAY,EAAZA,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,aAAY,CAAG6C,KAAK,CAAC,CACvB,CAAE,CACF9C,UAAU,CAAE,SAAAA,UAAAA,CAAC8C,KAAuB,CAAK,CACvCZ,uBAAuB,EAAE,CACzBlC,WAAU,EAAVA,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,WAAU,CAAG8C,KAAK,CAAC,CACrB,CAAE,CACFxD,IAAI,CAAEA,IAAK,CACX7C,WAAW,CAAEA,WAAY,CACzBI,YAAY,CAAEA,YAAa,CAC3BG,cAAc,CAAEA,cAAe,CAC/BC,YAAY,CAAEA,YAAa,CAC3BnC,MAAM,CAAEA,MAAO,CACfE,KAAK,CAAEA,KAAM,CACb8F,SAAS,CAAEA,SAAU,CACrBlB,WAAW,CAAE,SAAAA,WAAAA,CAACkD,KAAuB,CAAK,CACxCd,sBAAsB,EAAE,CACxBpC,YAAW,cAAXA,YAAW,CAAGkD,KAAK,CAAC,CACtB,CAAE,CACFC,SAAS,CAAEb,uBAAwB,CACnCc,UAAU,CAAEd,uBAAwB,CACpCe,OAAO,CAAEX,wBAAyB,CAAA,CAC9BY,aAAa,CAAC,CAAEC,IAAI,CAAEC,aAAa,CAACC,MAAM,CAAE7D,MAAM,CAANA,MAAO,CAAC,CAAC,CACrD8D,cAAc,CAACpD,IAAI,CAAC,CACpBqD,sBAAsB,CAACrD,IAAI,CAAC,CAAAX,CAAAA,QAAA,CAEhCiE,IAAA,CAACC,qBAAqB,CAAA,CACpBzG,cAAc,CAAEA,cAAe,CAC/BC,YAAY,CAAEA,YAAa,CAC3B6D,SAAS,CAAEA,SAAU,CAAAvB,QAAA,CAEpBN,CAAAA,SAAS,CACRsD,GAAA,CAACjF,OAAO,CAAA,CACNoG,OAAO,CAAC,MAAM,CACdC,cAAc,CAAC,QAAQ,CACvBC,UAAU,CAAC,QAAQ,CACnBC,QAAQ,CAAC,UAAU,CACnBrI,GAAG,CAAC,KAAK,CACTI,IAAI,CAAC,KAAK,CACVF,MAAM,CAAC,KAAK,CACZI,KAAK,CAAC,KAAK,CACXgI,MAAM,CAAE,CAAE,CAAAvE,QAAA,CAEVgD,GAAA,CAACwB,WAAW,EAACC,kBAAkB,CAAC,SAAS,CAACxK,IAAI,CAAEa,WAAY,CAAC5B,KAAK,CAAEA,KAAM,CAAE,CAAC,CACtE,CAAC,CACR,IAAI,CACR+K,IAAA,CAACpG,aAAa,CACZsG,CAAAA,OAAO,CAAC,MAAM,CACdO,aAAa,CAAC,KAAK,CACnBL,UAAU,CAAC,QAAQ,CACnBD,cAAc,CAAC,QAAQ,CACvBO,IAAI,CAAE,CAAE,CACR1G,QAAQ,CAAEyB,SAAU,CACpB6E,MAAM,CAAE,CAAE,CAAAvE,QAAA,EAETd,IAAI,EAAIG,YAAY,EAAI,MAAM,CAC7B2D,GAAA,CAACjF,OAAO,EACN6G,YAAY,CAAElJ,WAAY,CAC1ByI,OAAO,CAAC,MAAM,CACdC,cAAc,CAAC,QAAQ,CACvBC,UAAU,CAAC,QAAQ,CAAArE,QAAA,CAEnBgD,GAAA,CAAC9D,IAAI,CAAA,CAACjF,IAAI,CAAEU,QAAS,CAACzB,KAAK,CAAE0C,SAAU,CAAE,CAAC,CACnC,CAAC,CACR,IAAI,CACPY,IAAI,CACHoF,mBAAmB,CACjB5B,QAAQ,CAERgD,GAAA,CAAC6B,QAAQ,EACP3J,UAAU,CAAEA,UAAW,CACvBF,QAAQ,CAAEA,QAAS,CAKnB8J,UAAU,CAAC,QAAQ,CACnBC,SAAS,CAAC,QAAQ,CAClB7L,KAAK,CAAES,SAAU,CAAAqG,QAAA,CAEhBxD,IAAI,CACG,CACX,CACC,IAAI,CACP0C,IAAI,EAAIG,YAAY,EAAI,OAAO,CAC9B2D,GAAA,CAACjF,OAAO,CAAA,CACNiH,WAAW,CAAEtJ,WAAY,CACzByI,OAAO,CAAC,MAAM,CACdC,cAAc,CAAC,QAAQ,CACvBC,UAAU,CAAC,QAAQ,CAAArE,QAAA,CAEnBgD,GAAA,CAAC9D,IAAI,CAACjF,CAAAA,IAAI,CAAEU,QAAS,CAACzB,KAAK,CAAE0C,SAAU,CAAE,CAAC,CACnC,CAAC,CACR,IAAI,CAAA,CACK,CAAC,CAAA,CACK,CAAC,CACR,CAAA,CAAC,CAEvB,CAAC,CAEK,IAAAqJ,UAAU,CAAGC,wBAAwB,CAAC/D,cAAK,CAACgE,UAAU,CAAChH,WAAW,CAAC,CAAE,CACzEiH,WAAW,CAAE,YACf,CAAC;;;;"}
|
|
@@ -35,7 +35,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
|
|
|
35
35
|
import { getOuterMotionRef, getInnerMotionRef } from '../../utils/getMotionRefs.js';
|
|
36
36
|
import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
|
|
37
37
|
|
|
38
|
-
var _excluded=["isDisabled","value","children","icon","color","testID","_motionMeta"];var _Chip=function _Chip(_ref,ref){var _groupProps$state,_groupProps$defaultVa,_ref2;var isDisabled=_ref.isDisabled,value=_ref.value,children=_ref.children,Icon=_ref.icon,color=_ref.color,testID=_ref.testID,_motionMeta=_ref._motionMeta,rest=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;var groupProps=useChipGroupContext();var isInsideGroup=!isEmpty(groupProps);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isPressed=_React$useState2[0],setIsPressed=_React$useState2[1];if(__DEV__){if(!isInsideGroup){throwBladeError({moduleName:'Chip',message:'<Chip /> component should only be used within the context of a <ChipGroup /> component'});}}var hasError=(groupProps==null?void 0:groupProps.validationState)==='error';var _isDisabled=isDisabled!=null?isDisabled:groupProps==null?void 0:groupProps.isDisabled;var _isRequired=(groupProps==null?void 0:groupProps.isRequired)||(groupProps==null?void 0:groupProps.necessityIndicator)==='required';var _name=groupProps==null?void 0:groupProps.name;var _isChecked=groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var defaultChecked=typeof(groupProps==null?void 0:groupProps.defaultValue)==='undefined'?undefined:groupProps==null?void 0:(_groupProps$defaultVa=groupProps.defaultValue)==null?void 0:_groupProps$defaultVa.includes(value);var useChip=(groupProps==null?void 0:groupProps.selectionType)==='single'?useRadio:useCheckbox;var _size=(groupProps==null?void 0:groupProps.size)||'small';var chipColor=(_ref2=color!=null?color:groupProps==null?void 0:groupProps.color)!=null?_ref2:'primary';var handleChange=function handleChange(_ref3){var isChecked=_ref3.isChecked,value=_ref3.value;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.addValue(value);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue(value);}};var _useChip=useChip({defaultChecked:defaultChecked,isChecked:_isChecked,isDisabled:_isDisabled,isRequired:_isRequired,hasError:hasError,name:_name,value:value,onChange:handleChange}),state=_useChip.state,inputProps=_useChip.inputProps;var handlePointerPressedIn=React__default.useCallback(function(){if(_isDisabled)return;setIsPressed(true);},[_isDisabled]);var handlePointerPressedOut=React__default.useCallback(function(){if(_isDisabled)return;setIsPressed(false);},[_isDisabled]);var handleKeyboardPressedIn=React__default.useCallback(function(e){if(_isDisabled)return;if(e.key===' '){setIsPressed(true);}},[_isDisabled]);var handleKeyboardPressedOut=React__default.useCallback(function(e){if(_isDisabled)return;if(e.key===' '){setIsPressed(false);}},[_isDisabled]);var textVariant='unchecked';if(_isChecked&&chipColor){textVariant=chipColor;}if(_isDisabled){textVariant='disabled';}var chipTextColor=chipColorTokens.text[textVariant];var chipIconColor=chipColorTokens.icon[textVariant];var colorVariant='unchecked';var stateVariant=_isDisabled?'disabled':'default';if(_isChecked&&chipColor){colorVariant=chipColor;}var chipBackgroundColor=chipColorTokens.background[colorVariant][stateVariant];var chipBorderColor=chipColorTokens.border[colorVariant][stateVariant];return jsx(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.Chip,testID:testID}),getStyledProps(rest),makeAnalyticsAttribute(rest),{display:isReactNative()?'flex':'inline-flex',ref:getOuterMotionRef({_motionMeta:_motionMeta,ref:ref}),children:jsx(SelectorLabel,{componentName:MetaConstants.ChipLabel,onTouchStart:handlePointerPressedIn,onTouchEnd:handlePointerPressedOut,onMouseDown:handlePointerPressedIn,onMouseUp:handlePointerPressedOut,onMouseOut:handlePointerPressedOut,onKeyDown:handleKeyboardPressedIn,onKeyUp:handleKeyboardPressedOut,inputProps:isReactNative()?inputProps:{},style:{cursor:_isDisabled?'not-allowed':'pointer'},children:jsx(BaseBox,{display:"flex",flexDirection:"column",children:jsxs(BaseBox,{display:"flex",alignItems:"center",flexDirection:"row",children:[jsx(SelectorInput,{hoverTokens:getChipInputHoverTokens(chipColor),isChecked:state.isChecked,isDisabled:_isDisabled,inputProps:inputProps,hasError:hasError,ref:getInnerMotionRef({_motionMeta:_motionMeta,ref:ref})}),jsx(AnimatedChip,{borderColor:chipBorderColor,isDisabled:_isDisabled,isPressed:isPressed,isDesktop:matchedDeviceType==='desktop',children:jsxs(StyledChipWrapper,{borderColor:chipBorderColor,isChecked:_isChecked,isDisabled:_isDisabled,color:chipColor,display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center",overflow:"hidden",backgroundColor:chipBackgroundColor,borderRadius:"max",borderWidth:['xsmall','small'].includes(_size)?'thinner':'thin',paddingLeft:chipHorizontalPaddingTokens[Boolean(Icon)?'withIcon':'withoutIcon'].left[_size],paddingRight:chipHorizontalPaddingTokens[Boolean(Icon)?'withIcon':'withoutIcon'].right[_size],height:makeSize(chipHeightTokens[_size]),gap:"spacing.3",children:[Icon?jsx(BaseBox,{display:"flex",children:jsx(Icon,{color:chipIconColor,size:chipIconSizes[_size]})}):null,children?jsx(Text,Object.assign({},chipTextSizes[_size],{truncateAfterLines:1,color:chipTextColor,children:children})):null]})})]})})})}));};var Chip=assignWithoutSideEffects(React__default.forwardRef(_Chip),{displayName:'Chip'});
|
|
38
|
+
var _excluded=["isDisabled","value","children","icon","color","testID","_motionMeta","width","maxWidth","minWidth"];var _Chip=function _Chip(_ref,ref){var _groupProps$state,_groupProps$defaultVa,_ref2;var isDisabled=_ref.isDisabled,value=_ref.value,children=_ref.children,Icon=_ref.icon,color=_ref.color,testID=_ref.testID,_motionMeta=_ref._motionMeta,width=_ref.width,maxWidth=_ref.maxWidth,minWidth=_ref.minWidth,rest=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;var groupProps=useChipGroupContext();var isInsideGroup=!isEmpty(groupProps);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isPressed=_React$useState2[0],setIsPressed=_React$useState2[1];if(__DEV__){if(!isInsideGroup){throwBladeError({moduleName:'Chip',message:'<Chip /> component should only be used within the context of a <ChipGroup /> component'});}}var hasError=(groupProps==null?void 0:groupProps.validationState)==='error';var _isDisabled=isDisabled!=null?isDisabled:groupProps==null?void 0:groupProps.isDisabled;var _isRequired=(groupProps==null?void 0:groupProps.isRequired)||(groupProps==null?void 0:groupProps.necessityIndicator)==='required';var _name=groupProps==null?void 0:groupProps.name;var _isChecked=groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var defaultChecked=typeof(groupProps==null?void 0:groupProps.defaultValue)==='undefined'?undefined:groupProps==null?void 0:(_groupProps$defaultVa=groupProps.defaultValue)==null?void 0:_groupProps$defaultVa.includes(value);var useChip=(groupProps==null?void 0:groupProps.selectionType)==='single'?useRadio:useCheckbox;var _size=(groupProps==null?void 0:groupProps.size)||'small';var chipColor=(_ref2=color!=null?color:groupProps==null?void 0:groupProps.color)!=null?_ref2:'primary';var handleChange=function handleChange(_ref3){var isChecked=_ref3.isChecked,value=_ref3.value;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.addValue(value);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue(value);}};var _useChip=useChip({defaultChecked:defaultChecked,isChecked:_isChecked,isDisabled:_isDisabled,isRequired:_isRequired,hasError:hasError,name:_name,value:value,onChange:handleChange}),state=_useChip.state,inputProps=_useChip.inputProps;var handlePointerPressedIn=React__default.useCallback(function(){if(_isDisabled)return;setIsPressed(true);},[_isDisabled]);var handlePointerPressedOut=React__default.useCallback(function(){if(_isDisabled)return;setIsPressed(false);},[_isDisabled]);var handleKeyboardPressedIn=React__default.useCallback(function(e){if(_isDisabled)return;if(e.key===' '){setIsPressed(true);}},[_isDisabled]);var handleKeyboardPressedOut=React__default.useCallback(function(e){if(_isDisabled)return;if(e.key===' '){setIsPressed(false);}},[_isDisabled]);var textVariant='unchecked';if(_isChecked&&chipColor){textVariant=chipColor;}if(_isDisabled){textVariant='disabled';}var chipTextColor=chipColorTokens.text[textVariant];var chipIconColor=chipColorTokens.icon[textVariant];var colorVariant='unchecked';var stateVariant=_isDisabled?'disabled':'default';if(_isChecked&&chipColor){colorVariant=chipColor;}var chipBackgroundColor=chipColorTokens.background[colorVariant][stateVariant];var chipBorderColor=chipColorTokens.border[colorVariant][stateVariant];return jsx(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.Chip,testID:testID}),getStyledProps(rest),makeAnalyticsAttribute(rest),{display:isReactNative()?'flex':'inline-flex',ref:getOuterMotionRef({_motionMeta:_motionMeta,ref:ref}),width:width,maxWidth:maxWidth,minWidth:minWidth,children:jsx(SelectorLabel,{componentName:MetaConstants.ChipLabel,onTouchStart:handlePointerPressedIn,onTouchEnd:handlePointerPressedOut,onMouseDown:handlePointerPressedIn,onMouseUp:handlePointerPressedOut,onMouseOut:handlePointerPressedOut,onKeyDown:handleKeyboardPressedIn,onKeyUp:handleKeyboardPressedOut,inputProps:isReactNative()?inputProps:{},style:{cursor:_isDisabled?'not-allowed':'pointer',width:'100%'},children:jsx(BaseBox,{display:"flex",flexDirection:"column",width:"100%",children:jsxs(BaseBox,{display:"flex",alignItems:"center",flexDirection:"row",children:[jsx(SelectorInput,{hoverTokens:getChipInputHoverTokens(chipColor),isChecked:state.isChecked,isDisabled:_isDisabled,inputProps:inputProps,hasError:hasError,ref:getInnerMotionRef({_motionMeta:_motionMeta,ref:ref})}),jsx(AnimatedChip,{borderColor:chipBorderColor,isDisabled:_isDisabled,isPressed:isPressed,isDesktop:matchedDeviceType==='desktop',children:jsxs(StyledChipWrapper,{borderColor:chipBorderColor,isChecked:_isChecked,isDisabled:_isDisabled,color:chipColor,display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center",overflow:"hidden",backgroundColor:chipBackgroundColor,borderRadius:"max",borderWidth:['xsmall','small'].includes(_size)?'thinner':'thin',paddingLeft:chipHorizontalPaddingTokens[Boolean(Icon)?'withIcon':'withoutIcon'].left[_size],paddingRight:chipHorizontalPaddingTokens[Boolean(Icon)?'withIcon':'withoutIcon'].right[_size],height:makeSize(chipHeightTokens[_size]),gap:"spacing.3",width:"100%",children:[Icon?jsx(BaseBox,{display:"flex",children:jsx(Icon,{color:chipIconColor,size:chipIconSizes[_size]})}):null,children?jsx(Text,Object.assign({},chipTextSizes[_size],{truncateAfterLines:1,color:chipTextColor,children:children})):null]})})]})})})}));};var Chip=assignWithoutSideEffects(React__default.forwardRef(_Chip),{displayName:'Chip'});
|
|
39
39
|
|
|
40
40
|
export { Chip };
|
|
41
41
|
//# sourceMappingURL=Chip.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chip.js","sources":["../../../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import React from 'react';\nimport { useChipGroupContext } from './ChipGroupContext';\nimport {\n chipIconSizes,\n chipTextSizes,\n chipColorTokens,\n getChipInputHoverTokens,\n chipHeightTokens,\n chipHorizontalPaddingTokens,\n} from './chipTokens';\nimport type { ChipProps } from './types';\nimport { AnimatedChip } from './AnimatedChip';\nimport { StyledChipWrapper } from './StyledChipWrapper';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport type { BladeElementRef } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport { useCheckbox } from '~components/Checkbox/useCheckbox';\nimport { useRadio } from '~components/Radio/useRadio';\nimport { isReactNative, makeSize, useBreakpoint } from '~utils';\nimport { Text } from '~components/Typography';\nimport { useTheme } from '~components/BladeProvider';\nimport { getInnerMotionRef, getOuterMotionRef } from '~utils/getMotionRefs';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype OnChange = ({\n isChecked,\n event,\n value,\n}: {\n isChecked: boolean;\n event?: React.ChangeEvent;\n value?: string;\n}) => void;\n\nconst _Chip: React.ForwardRefRenderFunction<BladeElementRef, ChipProps> = (\n { isDisabled, value, children, icon: Icon, color, testID, _motionMeta, ...rest },\n ref,\n) => {\n const { theme } = useTheme();\n const { matchedDeviceType } = useBreakpoint({ breakpoints: theme.breakpoints });\n const groupProps = useChipGroupContext();\n const isInsideGroup = !isEmpty(groupProps);\n const [isPressed, setIsPressed] = React.useState(false);\n\n if (__DEV__) {\n if (!isInsideGroup) {\n throwBladeError({\n moduleName: 'Chip',\n message:\n '<Chip /> component should only be used within the context of a <ChipGroup /> component',\n });\n }\n }\n\n const hasError = groupProps?.validationState === 'error';\n const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n const _isRequired = groupProps?.isRequired || groupProps?.necessityIndicator === 'required';\n const _name = groupProps?.name;\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion\n const _isChecked = groupProps?.state?.isChecked(value!);\n // Check if the defaultValue property of groupProps is undefined\n const defaultChecked =\n typeof groupProps?.defaultValue === 'undefined'\n ? undefined // If undefined, defaultChecked is also undefined\n : groupProps?.defaultValue?.includes(value as string); // If multiple selection, check if value is in defaultValue array\n const useChip = groupProps?.selectionType === 'single' ? useRadio : useCheckbox;\n const _size = groupProps?.size || 'small';\n const chipColor = color ?? groupProps?.color ?? 'primary';\n\n const handleChange: OnChange = ({ isChecked, value }) => {\n if (isChecked) {\n groupProps?.state?.addValue(value!);\n } else {\n groupProps?.state?.removeValue(value!);\n }\n };\n\n const { state, inputProps } = useChip({\n defaultChecked,\n isChecked: _isChecked,\n isDisabled: _isDisabled,\n isRequired: _isRequired,\n hasError,\n name: _name,\n value,\n onChange: handleChange,\n });\n\n const handlePointerPressedIn = React.useCallback(() => {\n if (_isDisabled) return;\n setIsPressed(true);\n }, [_isDisabled]);\n\n const handlePointerPressedOut = React.useCallback(() => {\n if (_isDisabled) return;\n setIsPressed(false);\n }, [_isDisabled]);\n\n const handleKeyboardPressedIn = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (_isDisabled) return;\n if (e.key === ' ') {\n setIsPressed(true);\n }\n },\n [_isDisabled],\n );\n\n const handleKeyboardPressedOut = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (_isDisabled) return;\n if (e.key === ' ') {\n setIsPressed(false);\n }\n },\n [_isDisabled],\n );\n\n let textVariant = 'unchecked';\n if (_isChecked && chipColor) {\n textVariant = chipColor;\n }\n if (_isDisabled) {\n textVariant = 'disabled';\n }\n const chipTextColor = chipColorTokens.text[textVariant];\n const chipIconColor = chipColorTokens.icon[textVariant];\n\n let colorVariant = 'unchecked';\n const stateVariant = _isDisabled ? 'disabled' : 'default';\n if (_isChecked && chipColor) {\n colorVariant = chipColor;\n }\n const chipBackgroundColor = chipColorTokens.background[colorVariant][stateVariant];\n const chipBorderColor = chipColorTokens.border[colorVariant][stateVariant];\n\n return (\n <BaseBox\n {...metaAttribute({ name: MetaConstants.Chip, testID })}\n {...getStyledProps(rest)}\n {...makeAnalyticsAttribute(rest)}\n display={(isReactNative() ? 'flex' : 'inline-flex') as never}\n ref={getOuterMotionRef({ _motionMeta, ref })}\n >\n <SelectorLabel\n componentName={MetaConstants.ChipLabel}\n onTouchStart={handlePointerPressedIn}\n onTouchEnd={handlePointerPressedOut}\n onMouseDown={handlePointerPressedIn}\n onMouseUp={handlePointerPressedOut}\n onMouseOut={handlePointerPressedOut}\n onKeyDown={handleKeyboardPressedIn}\n onKeyUp={handleKeyboardPressedOut}\n inputProps={isReactNative() ? inputProps : {}}\n style={{ cursor: _isDisabled ? 'not-allowed' : 'pointer' }}\n >\n <BaseBox display=\"flex\" flexDirection=\"column\">\n <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n <SelectorInput\n hoverTokens={getChipInputHoverTokens(chipColor)}\n isChecked={state.isChecked}\n isDisabled={_isDisabled}\n inputProps={inputProps}\n hasError={hasError}\n ref={getInnerMotionRef({ _motionMeta, ref })}\n />\n <AnimatedChip\n borderColor={chipBorderColor}\n isDisabled={_isDisabled}\n isPressed={isPressed}\n isDesktop={matchedDeviceType === 'desktop'}\n >\n <StyledChipWrapper\n borderColor={chipBorderColor}\n isChecked={_isChecked}\n isDisabled={_isDisabled}\n color={chipColor}\n display=\"flex\"\n flexDirection=\"row\"\n justifyContent=\"center\"\n alignItems=\"center\"\n overflow=\"hidden\"\n backgroundColor={chipBackgroundColor}\n borderRadius=\"max\"\n borderWidth={['xsmall', 'small'].includes(_size) ? 'thinner' : 'thin'}\n paddingLeft={\n chipHorizontalPaddingTokens[Boolean(Icon) ? 'withIcon' : 'withoutIcon'].left[\n _size\n ]\n }\n paddingRight={\n chipHorizontalPaddingTokens[Boolean(Icon) ? 'withIcon' : 'withoutIcon'].right[\n _size\n ]\n }\n height={makeSize(chipHeightTokens[_size])}\n gap=\"spacing.3\"\n >\n {Icon ? (\n <BaseBox display=\"flex\">\n <Icon color={chipIconColor} size={chipIconSizes[_size]} />\n </BaseBox>\n ) : null}\n {children ? (\n <Text {...chipTextSizes[_size]} truncateAfterLines={1} color={chipTextColor}>\n {children}\n </Text>\n ) : null}\n </StyledChipWrapper>\n </AnimatedChip>\n </BaseBox>\n </BaseBox>\n </SelectorLabel>\n </BaseBox>\n );\n};\n\nconst Chip = assignWithoutSideEffects(React.forwardRef(_Chip), {\n displayName: 'Chip',\n});\n\nexport { Chip };\nexport type { ChipProps };\n"],"names":["_Chip","_ref","ref","_groupProps$state","_groupProps$defaultVa","_ref2","isDisabled","value","children","Icon","icon","color","testID","_motionMeta","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","_useBreakpoint","useBreakpoint","breakpoints","matchedDeviceType","groupProps","useChipGroupContext","isInsideGroup","isEmpty","_React$useState","React","useState","_React$useState2","_slicedToArray","isPressed","setIsPressed","__DEV__","throwBladeError","moduleName","message","hasError","validationState","_isDisabled","_isRequired","isRequired","necessityIndicator","_name","name","_isChecked","state","isChecked","defaultChecked","defaultValue","undefined","includes","useChip","selectionType","useRadio","useCheckbox","_size","size","chipColor","handleChange","_ref3","_groupProps$state2","addValue","_groupProps$state3","removeValue","_useChip","onChange","inputProps","handlePointerPressedIn","useCallback","handlePointerPressedOut","handleKeyboardPressedIn","e","key","handleKeyboardPressedOut","textVariant","chipTextColor","chipColorTokens","text","chipIconColor","colorVariant","stateVariant","chipBackgroundColor","background","chipBorderColor","border","_jsx","BaseBox","Object","assign","metaAttribute","MetaConstants","Chip","getStyledProps","makeAnalyticsAttribute","display","isReactNative","getOuterMotionRef","SelectorLabel","componentName","ChipLabel","onTouchStart","onTouchEnd","onMouseDown","onMouseUp","onMouseOut","onKeyDown","onKeyUp","style","cursor","flexDirection","_jsxs","alignItems","SelectorInput","hoverTokens","getChipInputHoverTokens","getInnerMotionRef","AnimatedChip","borderColor","isDesktop","StyledChipWrapper","justifyContent","overflow","backgroundColor","borderRadius","borderWidth","paddingLeft","chipHorizontalPaddingTokens","Boolean","left","paddingRight","right","height","makeSize","chipHeightTokens","gap","chipIconSizes","Text","chipTextSizes","truncateAfterLines","assignWithoutSideEffects","forwardRef","displayName"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Chip.js","sources":["../../../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import React from 'react';\nimport { useChipGroupContext } from './ChipGroupContext';\nimport {\n chipIconSizes,\n chipTextSizes,\n chipColorTokens,\n getChipInputHoverTokens,\n chipHeightTokens,\n chipHorizontalPaddingTokens,\n} from './chipTokens';\nimport type { ChipProps } from './types';\nimport { AnimatedChip } from './AnimatedChip';\nimport { StyledChipWrapper } from './StyledChipWrapper';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport type { BladeElementRef } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport { useCheckbox } from '~components/Checkbox/useCheckbox';\nimport { useRadio } from '~components/Radio/useRadio';\nimport { isReactNative, makeSize, useBreakpoint } from '~utils';\nimport { Text } from '~components/Typography';\nimport { useTheme } from '~components/BladeProvider';\nimport { getInnerMotionRef, getOuterMotionRef } from '~utils/getMotionRefs';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype OnChange = ({\n isChecked,\n event,\n value,\n}: {\n isChecked: boolean;\n event?: React.ChangeEvent;\n value?: string;\n}) => void;\n\nconst _Chip: React.ForwardRefRenderFunction<BladeElementRef, ChipProps> = (\n {\n isDisabled,\n value,\n children,\n icon: Icon,\n color,\n testID,\n _motionMeta,\n width,\n maxWidth,\n minWidth,\n ...rest\n },\n ref,\n) => {\n const { theme } = useTheme();\n const { matchedDeviceType } = useBreakpoint({ breakpoints: theme.breakpoints });\n const groupProps = useChipGroupContext();\n const isInsideGroup = !isEmpty(groupProps);\n const [isPressed, setIsPressed] = React.useState(false);\n\n if (__DEV__) {\n if (!isInsideGroup) {\n throwBladeError({\n moduleName: 'Chip',\n message:\n '<Chip /> component should only be used within the context of a <ChipGroup /> component',\n });\n }\n }\n\n const hasError = groupProps?.validationState === 'error';\n const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n const _isRequired = groupProps?.isRequired || groupProps?.necessityIndicator === 'required';\n const _name = groupProps?.name;\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion\n const _isChecked = groupProps?.state?.isChecked(value!);\n // Check if the defaultValue property of groupProps is undefined\n const defaultChecked =\n typeof groupProps?.defaultValue === 'undefined'\n ? undefined // If undefined, defaultChecked is also undefined\n : groupProps?.defaultValue?.includes(value as string); // If multiple selection, check if value is in defaultValue array\n const useChip = groupProps?.selectionType === 'single' ? useRadio : useCheckbox;\n const _size = groupProps?.size || 'small';\n const chipColor = color ?? groupProps?.color ?? 'primary';\n const handleChange: OnChange = ({ isChecked, value }) => {\n if (isChecked) {\n groupProps?.state?.addValue(value!);\n } else {\n groupProps?.state?.removeValue(value!);\n }\n };\n\n const { state, inputProps } = useChip({\n defaultChecked,\n isChecked: _isChecked,\n isDisabled: _isDisabled,\n isRequired: _isRequired,\n hasError,\n name: _name,\n value,\n onChange: handleChange,\n });\n\n const handlePointerPressedIn = React.useCallback(() => {\n if (_isDisabled) return;\n setIsPressed(true);\n }, [_isDisabled]);\n\n const handlePointerPressedOut = React.useCallback(() => {\n if (_isDisabled) return;\n setIsPressed(false);\n }, [_isDisabled]);\n\n const handleKeyboardPressedIn = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (_isDisabled) return;\n if (e.key === ' ') {\n setIsPressed(true);\n }\n },\n [_isDisabled],\n );\n\n const handleKeyboardPressedOut = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (_isDisabled) return;\n if (e.key === ' ') {\n setIsPressed(false);\n }\n },\n [_isDisabled],\n );\n\n let textVariant = 'unchecked';\n if (_isChecked && chipColor) {\n textVariant = chipColor;\n }\n if (_isDisabled) {\n textVariant = 'disabled';\n }\n const chipTextColor = chipColorTokens.text[textVariant];\n const chipIconColor = chipColorTokens.icon[textVariant];\n\n let colorVariant = 'unchecked';\n const stateVariant = _isDisabled ? 'disabled' : 'default';\n if (_isChecked && chipColor) {\n colorVariant = chipColor;\n }\n const chipBackgroundColor = chipColorTokens.background[colorVariant][stateVariant];\n const chipBorderColor = chipColorTokens.border[colorVariant][stateVariant];\n\n return (\n <BaseBox\n {...metaAttribute({ name: MetaConstants.Chip, testID })}\n {...getStyledProps(rest)}\n {...makeAnalyticsAttribute(rest)}\n display={(isReactNative() ? 'flex' : 'inline-flex') as never}\n ref={getOuterMotionRef({ _motionMeta, ref })}\n width={width}\n maxWidth={maxWidth}\n minWidth={minWidth}\n >\n <SelectorLabel\n componentName={MetaConstants.ChipLabel}\n onTouchStart={handlePointerPressedIn}\n onTouchEnd={handlePointerPressedOut}\n onMouseDown={handlePointerPressedIn}\n onMouseUp={handlePointerPressedOut}\n onMouseOut={handlePointerPressedOut}\n onKeyDown={handleKeyboardPressedIn}\n onKeyUp={handleKeyboardPressedOut}\n inputProps={isReactNative() ? inputProps : {}}\n style={{\n cursor: _isDisabled ? 'not-allowed' : 'pointer',\n width: '100%',\n }}\n >\n <BaseBox display=\"flex\" flexDirection=\"column\" width=\"100%\">\n <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n <SelectorInput\n hoverTokens={getChipInputHoverTokens(chipColor)}\n isChecked={state.isChecked}\n isDisabled={_isDisabled}\n inputProps={inputProps}\n hasError={hasError}\n ref={getInnerMotionRef({ _motionMeta, ref })}\n />\n <AnimatedChip\n borderColor={chipBorderColor}\n isDisabled={_isDisabled}\n isPressed={isPressed}\n isDesktop={matchedDeviceType === 'desktop'}\n >\n <StyledChipWrapper\n borderColor={chipBorderColor}\n isChecked={_isChecked}\n isDisabled={_isDisabled}\n color={chipColor}\n display=\"flex\"\n flexDirection=\"row\"\n justifyContent=\"center\"\n alignItems=\"center\"\n overflow=\"hidden\"\n backgroundColor={chipBackgroundColor}\n borderRadius=\"max\"\n borderWidth={['xsmall', 'small'].includes(_size) ? 'thinner' : 'thin'}\n paddingLeft={\n chipHorizontalPaddingTokens[Boolean(Icon) ? 'withIcon' : 'withoutIcon'].left[\n _size\n ]\n }\n paddingRight={\n chipHorizontalPaddingTokens[Boolean(Icon) ? 'withIcon' : 'withoutIcon'].right[\n _size\n ]\n }\n height={makeSize(chipHeightTokens[_size])}\n gap=\"spacing.3\"\n width=\"100%\"\n >\n {Icon ? (\n <BaseBox display=\"flex\">\n <Icon color={chipIconColor} size={chipIconSizes[_size]} />\n </BaseBox>\n ) : null}\n {children ? (\n <Text {...chipTextSizes[_size]} truncateAfterLines={1} color={chipTextColor}>\n {children}\n </Text>\n ) : null}\n </StyledChipWrapper>\n </AnimatedChip>\n </BaseBox>\n </BaseBox>\n </SelectorLabel>\n </BaseBox>\n );\n};\n\nconst Chip = assignWithoutSideEffects(React.forwardRef(_Chip), {\n displayName: 'Chip',\n});\n\nexport { Chip };\nexport type { ChipProps };\n"],"names":["_Chip","_ref","ref","_groupProps$state","_groupProps$defaultVa","_ref2","isDisabled","value","children","Icon","icon","color","testID","_motionMeta","width","maxWidth","minWidth","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","_useBreakpoint","useBreakpoint","breakpoints","matchedDeviceType","groupProps","useChipGroupContext","isInsideGroup","isEmpty","_React$useState","React","useState","_React$useState2","_slicedToArray","isPressed","setIsPressed","__DEV__","throwBladeError","moduleName","message","hasError","validationState","_isDisabled","_isRequired","isRequired","necessityIndicator","_name","name","_isChecked","state","isChecked","defaultChecked","defaultValue","undefined","includes","useChip","selectionType","useRadio","useCheckbox","_size","size","chipColor","handleChange","_ref3","_groupProps$state2","addValue","_groupProps$state3","removeValue","_useChip","onChange","inputProps","handlePointerPressedIn","useCallback","handlePointerPressedOut","handleKeyboardPressedIn","e","key","handleKeyboardPressedOut","textVariant","chipTextColor","chipColorTokens","text","chipIconColor","colorVariant","stateVariant","chipBackgroundColor","background","chipBorderColor","border","_jsx","BaseBox","Object","assign","metaAttribute","MetaConstants","Chip","getStyledProps","makeAnalyticsAttribute","display","isReactNative","getOuterMotionRef","SelectorLabel","componentName","ChipLabel","onTouchStart","onTouchEnd","onMouseDown","onMouseUp","onMouseOut","onKeyDown","onKeyUp","style","cursor","flexDirection","_jsxs","alignItems","SelectorInput","hoverTokens","getChipInputHoverTokens","getInnerMotionRef","AnimatedChip","borderColor","isDesktop","StyledChipWrapper","justifyContent","overflow","backgroundColor","borderRadius","borderWidth","paddingLeft","chipHorizontalPaddingTokens","Boolean","left","paddingRight","right","height","makeSize","chipHeightTokens","gap","chipIconSizes","Text","chipTextSizes","truncateAfterLines","assignWithoutSideEffects","forwardRef","displayName"],"mappings":"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"}
|
|
@@ -22,7 +22,7 @@ import '../Typography/Display/Display.js';
|
|
|
22
22
|
import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
|
|
23
23
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
24
24
|
|
|
25
|
-
var _excluded=["accessibilityLabel","label","labelPosition","necessityIndicator","validationState","errorText","helpText","isRequired","children","isDisabled","name","defaultValue","onChange","value","size","color","testID","selectionType"];var _ChipGroup=function _ChipGroup(_ref,ref){var accessibilityLabel=_ref.accessibilityLabel,label=_ref.label,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,_ref$necessityIndicat=_ref.necessityIndicator,necessityIndicator=_ref$necessityIndicat===void 0?'none':_ref$necessityIndicat,_ref$validationState=_ref.validationState,validationState=_ref$validationState===void 0?'none':_ref$validationState,errorText=_ref.errorText,helpText=_ref.helpText,_ref$isRequired=_ref.isRequired,isRequired=_ref$isRequired===void 0?false:_ref$isRequired,children=_ref.children,_ref$isDisabled=_ref.isDisabled,isDisabled=_ref$isDisabled===void 0?false:_ref$isDisabled,name=_ref.name,defaultValue=_ref.defaultValue,onChange=_ref.onChange,value=_ref.value,_ref$size=_ref.size,size=_ref$size===void 0?'small':_ref$size,_ref$color=_ref.color,color=_ref$color===void 0?'primary':_ref$color,testID=_ref.testID,_ref$selectionType=_ref.selectionType,selectionType=_ref$selectionType===void 0?'single':_ref$selectionType,rest=_objectWithoutProperties(_ref,_excluded);var _useChipGroup=useChipGroup({defaultValue:defaultValue,onChange:onChange,value:value,isDisabled:isDisabled,name:name,size:size,color:color,selectionType:selectionType,isRequired:isRequired,validationState:validationState,necessityIndicator:necessityIndicator}),contextValue=_useChipGroup.contextValue,ids=_useChipGroup.ids;var showError=validationState==='error'&&errorText;var showHelpText=!showError&&helpText;var accessibilityText=`${showError?errorText:''} ${showHelpText?helpText:''}`.trim();if(__DEV__){if(selectionType==='single'&&Array.isArray(defaultValue)){throwBladeError({moduleName:'ChipGroup',message:`When "selectionType" is "single", the "defaultValue" prop must be a string value, but an array was provided.`});}if(selectionType==='single'&&Array.isArray(value)){throwBladeError({moduleName:'ChipGroup',message:`When "selectionType" is "single", the "value" prop must be a string value, but an array was provided.`});}}return jsx(ChipGroupProvider,{value:contextValue,children:jsx(BaseBox,Object.assign({ref:ref},getStyledProps(rest),{children:jsxs(SelectorGroupField,Object.assign({position:labelPosition,accessibilityRole:selectionType==='single'?'radiogroup':'group',labelledBy:ids.labelId,componentName:"chip-group",testID:testID},makeAnalyticsAttribute(rest),{children:[label?jsx(FormLabel,{as:"span",necessityIndicator:necessityIndicator,position:labelPosition,id:ids.labelId,accessibilityText:accessibilityText&&`,${accessibilityText}`,size:chipGroupLabelSizeTokens[size],children:label}):null,jsxs(BaseBox,{children:[jsx(VisuallyHidden,{children:jsx(Text,{children:accessibilityLabel})}),jsx(BaseBox,{display:"flex",flexDirection:"row",flexWrap:"wrap",
|
|
25
|
+
var _excluded=["accessibilityLabel","label","labelPosition","necessityIndicator","validationState","errorText","helpText","isRequired","children","isDisabled","name","defaultValue","onChange","value","size","color","testID","selectionType"];var _ChipGroup=function _ChipGroup(_ref,ref){var accessibilityLabel=_ref.accessibilityLabel,label=_ref.label,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,_ref$necessityIndicat=_ref.necessityIndicator,necessityIndicator=_ref$necessityIndicat===void 0?'none':_ref$necessityIndicat,_ref$validationState=_ref.validationState,validationState=_ref$validationState===void 0?'none':_ref$validationState,errorText=_ref.errorText,helpText=_ref.helpText,_ref$isRequired=_ref.isRequired,isRequired=_ref$isRequired===void 0?false:_ref$isRequired,children=_ref.children,_ref$isDisabled=_ref.isDisabled,isDisabled=_ref$isDisabled===void 0?false:_ref$isDisabled,name=_ref.name,defaultValue=_ref.defaultValue,onChange=_ref.onChange,value=_ref.value,_ref$size=_ref.size,size=_ref$size===void 0?'small':_ref$size,_ref$color=_ref.color,color=_ref$color===void 0?'primary':_ref$color,testID=_ref.testID,_ref$selectionType=_ref.selectionType,selectionType=_ref$selectionType===void 0?'single':_ref$selectionType,rest=_objectWithoutProperties(_ref,_excluded);var _useChipGroup=useChipGroup({defaultValue:defaultValue,onChange:onChange,value:value,isDisabled:isDisabled,name:name,size:size,color:color,selectionType:selectionType,isRequired:isRequired,validationState:validationState,necessityIndicator:necessityIndicator}),contextValue=_useChipGroup.contextValue,ids=_useChipGroup.ids;var showError=validationState==='error'&&errorText;var showHelpText=!showError&&helpText;var accessibilityText=`${showError?errorText:''} ${showHelpText?helpText:''}`.trim();if(__DEV__){if(selectionType==='single'&&Array.isArray(defaultValue)){throwBladeError({moduleName:'ChipGroup',message:`When "selectionType" is "single", the "defaultValue" prop must be a string value, but an array was provided.`});}if(selectionType==='single'&&Array.isArray(value)){throwBladeError({moduleName:'ChipGroup',message:`When "selectionType" is "single", the "value" prop must be a string value, but an array was provided.`});}}return jsx(ChipGroupProvider,{value:contextValue,children:jsx(BaseBox,Object.assign({ref:ref},getStyledProps(rest),{children:jsxs(SelectorGroupField,Object.assign({position:labelPosition,accessibilityRole:selectionType==='single'?'radiogroup':'group',labelledBy:ids.labelId,componentName:"chip-group",testID:testID},makeAnalyticsAttribute(rest),{children:[label?jsx(FormLabel,{as:"span",necessityIndicator:necessityIndicator,position:labelPosition,id:ids.labelId,accessibilityText:accessibilityText&&`,${accessibilityText}`,size:chipGroupLabelSizeTokens[size],children:label}):null,jsxs(BaseBox,{children:[jsx(VisuallyHidden,{children:jsx(Text,{children:accessibilityLabel})}),jsx(BaseBox,{display:"flex",flexDirection:"row",flexWrap:"wrap",rowGap:chipGroupGapTokens[size].bottom,columnGap:chipGroupGapTokens[size].right,marginBottom:chipGroupGapTokens[size].bottom,children:children}),jsx(FormHint,{size:chipGroupLabelSizeTokens[size],type:validationState==='error'?'error':'help',errorText:errorText,helpText:helpText})]})]}))}))});};var ChipGroup=React__default.forwardRef(_ChipGroup);
|
|
26
26
|
|
|
27
27
|
export { ChipGroup };
|
|
28
28
|
//# sourceMappingURL=ChipGroup.js.map
|