| 1 | {"version":3,"file":"StackUtils.js","sourceRoot":"../src/","sources":["components/Stack/StackUtils.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Functions used by Stack components to simplify style-related computations\n */\n\nimport { ITheme } from '../../Styling';\nimport { IStackProps } from './Stack.types';\n\n// Helper function that converts a themed spacing key (if given) to the corresponding themed spacing value.\nconst _getThemedSpacing = (space: string, theme: ITheme): string => {\n if (theme.spacing.hasOwnProperty(space)) {\n return theme.spacing[space as keyof typeof theme.spacing];\n }\n return space;\n};\n\n// Helper function that takes a gap as a string and converts it into a { value, unit } representation.\nconst _getValueUnitGap = (gap: string): { value: number; unit: string } => {\n const numericalPart = parseFloat(gap);\n const numericalValue = isNaN(numericalPart) ? 0 : numericalPart;\n const numericalString = isNaN(numericalPart) ? '' : numericalPart.toString();\n\n const unitPart = gap.substring(numericalString.toString().length);\n\n return {\n value: numericalValue,\n unit: unitPart || 'px',\n };\n};\n\n/**\n * Takes in a gap size in either a CSS-style format (e.g. 10 or \"10px\")\n * or a key of a themed spacing value (e.g. \"s1\").\n * Returns the separate numerical value of the padding (e.g. 10)\n * and the CSS unit (e.g. \"px\").\n */\nexport const parseGap = (\n gap: IStackProps['gap'],\n theme: ITheme,\n): { rowGap: { value: number; unit: string }; columnGap: { value: number; unit: string } } => {\n if (gap === undefined || gap === '') {\n return {\n rowGap: {\n value: 0,\n unit: 'px',\n },\n columnGap: {\n value: 0,\n unit: 'px',\n },\n };\n }\n\n if (typeof gap === 'number') {\n return {\n rowGap: {\n value: gap,\n unit: 'px',\n },\n columnGap: {\n value: gap,\n unit: 'px',\n },\n };\n }\n\n const splitGap = gap.split(' ');\n\n // If the array has more than two values, then return 0px.\n if (splitGap.length > 2) {\n return {\n rowGap: {\n value: 0,\n unit: 'px',\n },\n columnGap: {\n value: 0,\n unit: 'px',\n },\n };\n }\n\n // If the array has two values, then parse each one.\n if (splitGap.length === 2) {\n return {\n rowGap: _getValueUnitGap(_getThemedSpacing(splitGap[0], theme)),\n columnGap: _getValueUnitGap(_getThemedSpacing(splitGap[1], theme)),\n };\n }\n\n // Else, parse the numerical value and pass it as both the vertical and horizontal gap.\n const calculatedGap = _getValueUnitGap(_getThemedSpacing(gap, theme));\n\n return {\n rowGap: calculatedGap,\n columnGap: calculatedGap,\n };\n};\n\n/**\n * Takes in a padding in a CSS-style format (e.g. 10, \"10px\", \"10px 10px\", etc.)\n * where the separate padding values can also be the key of a themed spacing value\n * (e.g. \"s1 m\", \"10px l1 20px l2\", etc.).\n * Returns a CSS-style padding.\n */\nexport const parsePadding = (padding: number | string | undefined, theme: ITheme): number | string | undefined => {\n if (padding === undefined || typeof padding === 'number' || padding === '') {\n return padding;\n }\n\n const paddingValues = padding.split(' ');\n if (paddingValues.length < 2) {\n return _getThemedSpacing(padding, theme);\n }\n\n return paddingValues.reduce((padding1: string, padding2: string) => {\n return _getThemedSpacing(padding1, theme) + ' ' + _getThemedSpacing(padding2, theme);\n });\n};\n"]} |