@razorpay/blade 12.63.0 → 12.65.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/Badge/Badge.js +1 -1
- package/build/lib/native/components/Badge/Badge.js.map +1 -1
- package/build/lib/native/components/Badge/badgeTokens.js +1 -1
- package/build/lib/native/components/Badge/badgeTokens.js.map +1 -1
- package/build/lib/native/components/Charts/CommonChartComponents/CommonChartComponentsContext.js +6 -0
- package/build/lib/native/components/Charts/CommonChartComponents/CommonChartComponentsContext.js.map +1 -0
- package/build/lib/native/components/Charts/CommonChartComponents/tokens.js +4 -0
- package/build/lib/native/components/Charts/CommonChartComponents/tokens.js.map +1 -0
- package/build/lib/native/components/Form/CharacterCounter/CharacterCounter.js.map +1 -1
- package/build/lib/native/components/Input/BaseInput/BaseInput.js.map +1 -1
- package/build/lib/native/components/Input/BaseInput/BaseInputVisuals.js +1 -1
- package/build/lib/native/components/Input/BaseInput/BaseInputVisuals.js.map +1 -1
- package/build/lib/native/components/Input/BaseInput/baseInputTokens.js +1 -1
- package/build/lib/native/components/Input/BaseInput/baseInputTokens.js.map +1 -1
- package/build/lib/native/components/QuickFilters/QuickFilter.js +1 -1
- package/build/lib/native/components/QuickFilters/QuickFilter.js.map +1 -1
- package/build/lib/native/components/Radio/Radio.js +1 -1
- package/build/lib/native/components/Radio/Radio.js.map +1 -1
- package/build/lib/native/components/Table/TableContext.js +1 -1
- package/build/lib/native/components/Table/TableContext.js.map +1 -1
- package/build/lib/native/components/Table/tokens.js +1 -1
- package/build/lib/native/components/Table/tokens.js.map +1 -1
- package/build/lib/native/components/index.js +2 -0
- package/build/lib/native/components/index.js.map +1 -1
- package/build/lib/native/tokens/global/colors.js +1 -1
- package/build/lib/native/tokens/global/colors.js.map +1 -1
- package/build/lib/native/tokens/global/size.js +1 -1
- package/build/lib/native/tokens/global/size.js.map +1 -1
- package/build/lib/native/tokens/theme/bladeTheme.js +1 -1
- package/build/lib/native/tokens/theme/bladeTheme.js.map +1 -1
- package/build/lib/native/tokens/theme/theme.js.map +1 -1
- package/build/lib/web/development/components/Badge/Badge.js +4 -0
- package/build/lib/web/development/components/Badge/Badge.js.map +1 -1
- package/build/lib/web/development/components/Badge/badgeTokens.js +4 -0
- package/build/lib/web/development/components/Badge/badgeTokens.js.map +1 -1
- package/build/lib/web/development/components/Charts/AreaChart/AreaChart.web.js +140 -38
- package/build/lib/web/development/components/Charts/AreaChart/AreaChart.web.js.map +1 -1
- package/build/lib/web/development/components/Charts/BarChart/BarChart.web.js +121 -57
- package/build/lib/web/development/components/Charts/BarChart/BarChart.web.js.map +1 -1
- package/build/lib/web/development/components/Charts/CommonChartComponents/CommonChartComponents.web.js +145 -92
- package/build/lib/web/development/components/Charts/CommonChartComponents/CommonChartComponents.web.js.map +1 -1
- package/build/lib/web/development/components/Charts/CommonChartComponents/CommonChartComponentsContext.js +15 -0
- package/build/lib/web/development/components/Charts/CommonChartComponents/CommonChartComponentsContext.js.map +1 -0
- package/build/lib/web/development/components/Charts/CommonChartComponents/index.js +2 -0
- package/build/lib/web/development/components/Charts/CommonChartComponents/index.js.map +1 -1
- package/build/lib/web/development/components/Charts/CommonChartComponents/tokens.js +2 -1
- package/build/lib/web/development/components/Charts/CommonChartComponents/tokens.js.map +1 -1
- package/build/lib/web/development/components/Charts/DonutChart/DonutChart.web.js +202 -69
- package/build/lib/web/development/components/Charts/DonutChart/DonutChart.web.js.map +1 -1
- package/build/lib/web/development/components/Charts/LineChart/LineChart.web.js +84 -32
- package/build/lib/web/development/components/Charts/LineChart/LineChart.web.js.map +1 -1
- package/build/lib/web/development/components/Charts/utils/assignDataColorMapping/assignDataColorMapping.js +33 -0
- package/build/lib/web/development/components/Charts/utils/assignDataColorMapping/assignDataColorMapping.js.map +1 -0
- package/build/lib/web/development/components/Charts/utils/assignDataColorMapping/index.js +2 -0
- package/build/lib/web/development/components/Charts/utils/assignDataColorMapping/index.js.map +1 -0
- package/build/lib/web/development/components/Charts/utils/getHighestColorInRange.js +53 -0
- package/build/lib/web/development/components/Charts/utils/getHighestColorInRange.js.map +1 -0
- package/build/lib/web/development/components/Charts/utils/index.js +5 -0
- package/build/lib/web/development/components/Charts/utils/index.js.map +1 -1
- package/build/lib/web/development/components/Charts/utils/isSequentialColor.js +35 -0
- package/build/lib/web/development/components/Charts/utils/isSequentialColor.js.map +1 -0
- package/build/lib/web/development/components/Charts/utils/sanitizeString/index.js +2 -0
- package/build/lib/web/development/components/Charts/utils/sanitizeString/index.js.map +1 -0
- package/build/lib/web/development/components/Charts/utils/sanitizeString/sanitizeString.js +30 -0
- package/build/lib/web/development/components/Charts/utils/sanitizeString/sanitizeString.js.map +1 -0
- package/build/lib/web/development/components/Charts/utils/tokens.js +7 -0
- package/build/lib/web/development/components/Charts/utils/tokens.js.map +1 -0
- package/build/lib/web/development/components/Charts/utils/useColorTheme.js +32 -11
- package/build/lib/web/development/components/Charts/utils/useColorTheme.js.map +1 -1
- package/build/lib/web/development/components/Dropdown/FilterChipGroup.web.js +3 -1
- package/build/lib/web/development/components/Dropdown/FilterChipGroup.web.js.map +1 -1
- package/build/lib/web/development/components/FilterChip/BaseFilterChip.web.js +8 -9
- package/build/lib/web/development/components/FilterChip/BaseFilterChip.web.js.map +1 -1
- package/build/lib/web/development/components/FilterChip/tokens.js +1 -1
- package/build/lib/web/development/components/FilterChip/tokens.js.map +1 -1
- package/build/lib/web/development/components/Form/CharacterCounter/CharacterCounter.js.map +1 -1
- package/build/lib/web/development/components/Input/BaseInput/BaseInput.js.map +1 -1
- package/build/lib/web/development/components/Input/BaseInput/BaseInputVisuals.js +2 -0
- package/build/lib/web/development/components/Input/BaseInput/BaseInputVisuals.js.map +1 -1
- package/build/lib/web/development/components/Input/BaseInput/baseInputTokens.js +11 -0
- package/build/lib/web/development/components/Input/BaseInput/baseInputTokens.js.map +1 -1
- package/build/lib/web/development/components/Input/PhoneNumberInput/CountrySelector.web.js +1 -0
- package/build/lib/web/development/components/Input/PhoneNumberInput/CountrySelector.web.js.map +1 -1
- package/build/lib/web/development/components/ListView/ListViewFilters.web.js +13 -102
- package/build/lib/web/development/components/ListView/ListViewFilters.web.js.map +1 -1
- package/build/lib/web/development/components/QuickFilters/QuickFilter.js +2 -1
- package/build/lib/web/development/components/QuickFilters/QuickFilter.js.map +1 -1
- package/build/lib/web/development/components/Radio/Radio.js +4 -2
- package/build/lib/web/development/components/Radio/Radio.js.map +1 -1
- package/build/lib/web/development/components/Table/Table.web.js +3 -1
- package/build/lib/web/development/components/Table/Table.web.js.map +1 -1
- package/build/lib/web/development/components/Table/TableBody.web.js +2 -1
- package/build/lib/web/development/components/Table/TableBody.web.js.map +1 -1
- package/build/lib/web/development/components/Table/TableContext.js +2 -1
- package/build/lib/web/development/components/Table/TableContext.js.map +1 -1
- package/build/lib/web/development/components/Table/TableFooter.web.js +2 -1
- package/build/lib/web/development/components/Table/TableFooter.web.js.map +1 -1
- package/build/lib/web/development/components/Table/TableHeader.web.js +78 -68
- package/build/lib/web/development/components/Table/TableHeader.web.js.map +1 -1
- package/build/lib/web/development/components/Table/TablePagination.web.js +5 -2
- package/build/lib/web/development/components/Table/TablePagination.web.js.map +1 -1
- package/build/lib/web/development/components/Table/TableToolbar.web.js +15 -13
- package/build/lib/web/development/components/Table/TableToolbar.web.js.map +1 -1
- package/build/lib/web/development/components/Table/tokens.js +11 -8
- package/build/lib/web/development/components/Table/tokens.js.map +1 -1
- package/build/lib/web/development/components/index.js +2 -0
- package/build/lib/web/development/components/index.js.map +1 -1
- package/build/lib/web/development/tokens/global/colors.js +48 -48
- package/build/lib/web/development/tokens/global/colors.js.map +1 -1
- package/build/lib/web/development/tokens/global/size.js +2 -0
- package/build/lib/web/development/tokens/global/size.js.map +1 -1
- package/build/lib/web/development/tokens/theme/bladeTheme.js +139 -111
- package/build/lib/web/development/tokens/theme/bladeTheme.js.map +1 -1
- package/build/lib/web/development/tokens/theme/theme.js.map +1 -1
- package/build/lib/web/production/components/Badge/Badge.js +4 -0
- package/build/lib/web/production/components/Badge/Badge.js.map +1 -1
- package/build/lib/web/production/components/Badge/badgeTokens.js +4 -0
- package/build/lib/web/production/components/Badge/badgeTokens.js.map +1 -1
- package/build/lib/web/production/components/Charts/AreaChart/AreaChart.web.js +140 -38
- package/build/lib/web/production/components/Charts/AreaChart/AreaChart.web.js.map +1 -1
- package/build/lib/web/production/components/Charts/BarChart/BarChart.web.js +121 -57
- package/build/lib/web/production/components/Charts/BarChart/BarChart.web.js.map +1 -1
- package/build/lib/web/production/components/Charts/CommonChartComponents/CommonChartComponents.web.js +145 -92
- package/build/lib/web/production/components/Charts/CommonChartComponents/CommonChartComponents.web.js.map +1 -1
- package/build/lib/web/production/components/Charts/CommonChartComponents/CommonChartComponentsContext.js +15 -0
- package/build/lib/web/production/components/Charts/CommonChartComponents/CommonChartComponentsContext.js.map +1 -0
- package/build/lib/web/production/components/Charts/CommonChartComponents/index.js +2 -0
- package/build/lib/web/production/components/Charts/CommonChartComponents/index.js.map +1 -1
- package/build/lib/web/production/components/Charts/CommonChartComponents/tokens.js +2 -1
- package/build/lib/web/production/components/Charts/CommonChartComponents/tokens.js.map +1 -1
- package/build/lib/web/production/components/Charts/DonutChart/DonutChart.web.js +202 -69
- package/build/lib/web/production/components/Charts/DonutChart/DonutChart.web.js.map +1 -1
- package/build/lib/web/production/components/Charts/LineChart/LineChart.web.js +84 -32
- package/build/lib/web/production/components/Charts/LineChart/LineChart.web.js.map +1 -1
- package/build/lib/web/production/components/Charts/utils/assignDataColorMapping/assignDataColorMapping.js +33 -0
- package/build/lib/web/production/components/Charts/utils/assignDataColorMapping/assignDataColorMapping.js.map +1 -0
- package/build/lib/web/production/components/Charts/utils/assignDataColorMapping/index.js +2 -0
- package/build/lib/web/production/components/Charts/utils/assignDataColorMapping/index.js.map +1 -0
- package/build/lib/web/production/components/Charts/utils/getHighestColorInRange.js +53 -0
- package/build/lib/web/production/components/Charts/utils/getHighestColorInRange.js.map +1 -0
- package/build/lib/web/production/components/Charts/utils/index.js +5 -0
- package/build/lib/web/production/components/Charts/utils/index.js.map +1 -1
- package/build/lib/web/production/components/Charts/utils/isSequentialColor.js +35 -0
- package/build/lib/web/production/components/Charts/utils/isSequentialColor.js.map +1 -0
- package/build/lib/web/production/components/Charts/utils/sanitizeString/index.js +2 -0
- package/build/lib/web/production/components/Charts/utils/sanitizeString/index.js.map +1 -0
- package/build/lib/web/production/components/Charts/utils/sanitizeString/sanitizeString.js +30 -0
- package/build/lib/web/production/components/Charts/utils/sanitizeString/sanitizeString.js.map +1 -0
- package/build/lib/web/production/components/Charts/utils/tokens.js +7 -0
- package/build/lib/web/production/components/Charts/utils/tokens.js.map +1 -0
- package/build/lib/web/production/components/Charts/utils/useColorTheme.js +32 -11
- package/build/lib/web/production/components/Charts/utils/useColorTheme.js.map +1 -1
- package/build/lib/web/production/components/Dropdown/FilterChipGroup.web.js +3 -1
- package/build/lib/web/production/components/Dropdown/FilterChipGroup.web.js.map +1 -1
- package/build/lib/web/production/components/FilterChip/BaseFilterChip.web.js +8 -9
- package/build/lib/web/production/components/FilterChip/BaseFilterChip.web.js.map +1 -1
- package/build/lib/web/production/components/FilterChip/tokens.js +1 -1
- package/build/lib/web/production/components/FilterChip/tokens.js.map +1 -1
- package/build/lib/web/production/components/Form/CharacterCounter/CharacterCounter.js.map +1 -1
- package/build/lib/web/production/components/Input/BaseInput/BaseInput.js.map +1 -1
- package/build/lib/web/production/components/Input/BaseInput/BaseInputVisuals.js +2 -0
- package/build/lib/web/production/components/Input/BaseInput/BaseInputVisuals.js.map +1 -1
- package/build/lib/web/production/components/Input/BaseInput/baseInputTokens.js +11 -0
- package/build/lib/web/production/components/Input/BaseInput/baseInputTokens.js.map +1 -1
- package/build/lib/web/production/components/Input/PhoneNumberInput/CountrySelector.web.js +1 -0
- package/build/lib/web/production/components/Input/PhoneNumberInput/CountrySelector.web.js.map +1 -1
- package/build/lib/web/production/components/ListView/ListViewFilters.web.js +13 -102
- package/build/lib/web/production/components/ListView/ListViewFilters.web.js.map +1 -1
- package/build/lib/web/production/components/QuickFilters/QuickFilter.js +2 -1
- package/build/lib/web/production/components/QuickFilters/QuickFilter.js.map +1 -1
- package/build/lib/web/production/components/Radio/Radio.js +4 -2
- package/build/lib/web/production/components/Radio/Radio.js.map +1 -1
- package/build/lib/web/production/components/Table/Table.web.js +3 -1
- package/build/lib/web/production/components/Table/Table.web.js.map +1 -1
- package/build/lib/web/production/components/Table/TableBody.web.js +2 -1
- package/build/lib/web/production/components/Table/TableBody.web.js.map +1 -1
- package/build/lib/web/production/components/Table/TableContext.js +2 -1
- package/build/lib/web/production/components/Table/TableContext.js.map +1 -1
- package/build/lib/web/production/components/Table/TableFooter.web.js +2 -1
- package/build/lib/web/production/components/Table/TableFooter.web.js.map +1 -1
- package/build/lib/web/production/components/Table/TableHeader.web.js +78 -68
- package/build/lib/web/production/components/Table/TableHeader.web.js.map +1 -1
- package/build/lib/web/production/components/Table/TablePagination.web.js +5 -2
- package/build/lib/web/production/components/Table/TablePagination.web.js.map +1 -1
- package/build/lib/web/production/components/Table/TableToolbar.web.js +15 -13
- package/build/lib/web/production/components/Table/TableToolbar.web.js.map +1 -1
- package/build/lib/web/production/components/Table/tokens.js +11 -8
- package/build/lib/web/production/components/Table/tokens.js.map +1 -1
- package/build/lib/web/production/components/index.js +2 -0
- package/build/lib/web/production/components/index.js.map +1 -1
- package/build/lib/web/production/tokens/global/colors.js +48 -48
- package/build/lib/web/production/tokens/global/colors.js.map +1 -1
- package/build/lib/web/production/tokens/global/size.js +2 -0
- package/build/lib/web/production/tokens/global/size.js.map +1 -1
- package/build/lib/web/production/tokens/theme/bladeTheme.js +139 -111
- package/build/lib/web/production/tokens/theme/bladeTheme.js.map +1 -1
- package/build/lib/web/production/tokens/theme/theme.js.map +1 -1
- package/build/types/components/index.d.ts +109 -23
- package/build/types/components/index.native.d.ts +106 -20
- package/build/types/tokens/index.d.ts +8 -6
- package/build/types/tokens/index.native.d.ts +8 -6
- package/build/types/utils/index.d.ts +29 -6
- package/build/types/utils/index.native.d.ts +29 -6
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseInputVisuals.js","sources":["../../../../../../src/components/Input/BaseInput/BaseInputVisuals.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport React from 'react';\nimport type { ReactElement } from 'react';\nimport type { BaseInputProps } from './BaseInput';\nimport BaseBox from '~components/Box/BaseBox';\nimport { Text } from '~components/Typography';\nimport type { BaseBoxProps, SpacingValueType } from '~components/Box/BaseBox';\nimport type { IconColors } from '~components/Icons';\nimport { isValidAllowedChildren } from '~utils/isValidAllowedChildren';\nimport { throwBladeError } from '~utils/logger';\nimport { Tooltip } from '~components/Tooltip';\nimport { Box } from '~components/Box';\nimport { isReactNative } from '~utils';\n\ntype InputVisuals = Pick<\n BaseInputProps,\n | 'leadingIcon'\n | 'prefix'\n | 'trailingInteractionElement'\n | 'onTrailingInteractionElementClick'\n | 'leadingInteractionElement'\n | 'leadingDropDown'\n | 'trailingDropDown'\n | 'suffix'\n | 'trailingIcon'\n | 'isDisabled'\n | 'validationState'\n | 'size'\n | 'trailingButton'\n | 'showHintsAsTooltip'\n | 'errorText'\n | 'successText'\n> & {\n size: NonNullable<BaseInputProps['size']>;\n};\n\nconst getVisualContainerStyles = ({\n shouldStretchTrailingBox,\n}: {\n shouldStretchTrailingBox?: boolean;\n} = {}): Pick<BaseBoxProps, 'display' | 'flexDirection' | 'alignItems' | 'alignSelf'> => ({\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n alignSelf: shouldStretchTrailingBox ? 'stretch' : 'center',\n});\n\nconst trailingIconColor: Record<NonNullable<InputVisuals['validationState']>, IconColors> = {\n none: 'surface.icon.gray.subtle',\n error: 'feedback.icon.negative.intense',\n success: 'feedback.icon.positive.intense',\n};\n\nconst iconSize = {\n xsmall: 'small',\n medium: 'medium',\n large: 'large',\n} as const;\n\nconst textSize = {\n xsmall: 'small',\n medium: 'medium',\n large: 'large',\n} as const;\n\nconst getPrefixStyles = ({\n hasLeadingIcon,\n hasPrefix,\n}: {\n hasLeadingIcon: boolean;\n hasPrefix: boolean;\n}): Pick<BaseBoxProps, 'paddingLeft'> => {\n if (hasPrefix && hasLeadingIcon) {\n return {\n paddingLeft: 'spacing.3',\n };\n }\n\n if (hasPrefix && !hasLeadingIcon) {\n return {\n paddingLeft: 'spacing.4',\n };\n }\n\n return {\n paddingLeft: 'spacing.0',\n };\n};\n\nconst getInteractionElementStyles = ({\n hasTrailingIcon,\n hasLeadingInteractionElement,\n hasLeadingDropDown,\n hasTrailingInteractionElement,\n hasSuffix,\n hasTrailingButton,\n hasTrailingDropDown,\n}: {\n hasTrailingIcon: boolean;\n hasLeadingInteractionElement?: boolean;\n hasLeadingDropDown?: boolean;\n hasTrailingInteractionElement?: boolean;\n hasSuffix: boolean;\n hasTrailingButton: boolean;\n hasTrailingDropDown?: boolean;\n}): SpacingValueType => {\n if (hasTrailingInteractionElement && (hasSuffix || hasTrailingIcon || hasTrailingButton)) {\n return 'spacing.2';\n }\n\n if (hasLeadingDropDown || hasTrailingDropDown) {\n return 'spacing.2';\n }\n\n if (hasTrailingInteractionElement && !hasSuffix && !hasTrailingIcon && !hasTrailingButton) {\n return 'spacing.4';\n }\n\n if (hasLeadingInteractionElement) {\n return 'spacing.3';\n }\n\n return 'spacing.0';\n};\n\nconst getSuffixStyles = ({\n hasTrailingIcon,\n hasSuffix,\n hasTrailingButton,\n}: {\n hasTrailingIcon: boolean;\n hasSuffix: boolean;\n hasTrailingButton: boolean;\n}): Pick<BaseBoxProps, 'paddingRight'> => {\n if (hasSuffix && (hasTrailingIcon || hasTrailingButton)) {\n return {\n paddingRight: 'spacing.3',\n };\n }\n\n if (hasSuffix && !hasTrailingIcon && !hasTrailingButton) {\n return {\n paddingRight: 'spacing.4',\n };\n }\n\n return {\n paddingRight: 'spacing.0',\n };\n};\n\nconst getTrailingIconStyles = ({\n hasTrailingIcon,\n hasTrailingButton,\n}: {\n hasTrailingIcon: boolean;\n hasTrailingButton: boolean;\n}): Pick<BaseBoxProps, 'paddingRight'> => {\n if (hasTrailingIcon && hasTrailingButton) {\n return {\n paddingRight: 'spacing.3',\n };\n }\n\n if (hasTrailingIcon && !hasTrailingButton) {\n return {\n paddingRight: 'spacing.4',\n };\n }\n\n return {\n paddingRight: 'spacing.0',\n };\n};\n\nexport const getInputVisualsToBeRendered = ({\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n trailingButton,\n leadingDropDown,\n trailingDropDown,\n}: InputVisuals) => ({\n hasLeadingIcon: Boolean(leadingIcon),\n hasPrefix: Boolean(prefix),\n hasTrailingInteractionElement: Boolean(trailingInteractionElement),\n hasLeadingInteractionElement: Boolean(leadingInteractionElement),\n hasSuffix: Boolean(suffix),\n hasTrailingIcon: Boolean(trailingIcon),\n hasTrailingButton: Boolean(trailingButton),\n hasLeadingDropDown: Boolean(leadingDropDown),\n hasTrailingDropDown: Boolean(trailingDropDown),\n});\n\nconst getTooltipContent = ({\n validationState,\n errorText,\n successText,\n}: {\n validationState: BaseInputProps['validationState'];\n errorText: BaseInputProps['errorText'];\n successText: BaseInputProps['errorText'];\n}): string => {\n if (validationState === 'error' && errorText) {\n return errorText;\n }\n\n if (validationState === 'success' && successText) {\n return successText;\n }\n\n return '';\n};\n\nconst ValidationIconTooltip = ({\n children,\n validationState,\n errorText,\n successText,\n showHintsAsTooltip,\n}: {\n children: ReactElement;\n validationState: BaseInputProps['validationState'];\n errorText: BaseInputProps['errorText'];\n successText: BaseInputProps['errorText'];\n showHintsAsTooltip: BaseInputProps['showHintsAsTooltip'];\n}) => {\n if (\n (showHintsAsTooltip && validationState === 'error' && errorText) ||\n (validationState === 'success' && successText)\n ) {\n return (\n <Tooltip content={getTooltipContent({ validationState, errorText, successText })}>\n <Box display=\"flex\" justifyContent=\"center\" alignItems=\"center\">\n {children}\n </Box>\n </Tooltip>\n );\n }\n\n return children;\n};\n\nexport const BaseInputVisuals = ({\n leadingIcon: LeadingIcon,\n prefix,\n trailingInteractionElement,\n onTrailingInteractionElementClick,\n leadingDropDown,\n trailingDropDown,\n leadingInteractionElement,\n suffix,\n trailingIcon: TrailingIcon,\n isDisabled,\n validationState = 'none',\n size,\n showHintsAsTooltip,\n errorText,\n successText,\n trailingButton: TrailingButton,\n}: InputVisuals): ReactElement | null => {\n const {\n hasLeadingIcon,\n hasPrefix,\n hasSuffix,\n hasTrailingInteractionElement,\n hasLeadingInteractionElement,\n hasTrailingIcon,\n hasTrailingButton,\n hasLeadingDropDown,\n hasTrailingDropDown,\n } = getInputVisualsToBeRendered({\n leadingIcon: LeadingIcon,\n prefix,\n leadingInteractionElement,\n trailingInteractionElement,\n suffix,\n trailingIcon: TrailingIcon,\n trailingButton: TrailingButton,\n leadingDropDown,\n trailingDropDown,\n size,\n });\n\n const hasLeadingVisuals =\n hasLeadingInteractionElement || hasLeadingIcon || hasPrefix || hasLeadingDropDown;\n const hasTrailingVisuals =\n hasTrailingInteractionElement ||\n hasSuffix ||\n hasTrailingIcon ||\n hasTrailingButton ||\n hasTrailingDropDown;\n\n if (__DEV__) {\n if (hasTrailingButton && !isValidAllowedChildren(TrailingButton, 'Link')) {\n throwBladeError({\n message: 'trailingButton must be a valid Blade Link component',\n moduleName: 'BaseInput',\n });\n }\n }\n\n if (hasLeadingVisuals) {\n return (\n <BaseBox {...getVisualContainerStyles()}>\n {hasLeadingInteractionElement ? (\n <BaseBox\n paddingLeft={getInteractionElementStyles({\n hasTrailingIcon,\n hasLeadingInteractionElement,\n hasSuffix,\n hasTrailingButton,\n })}\n display=\"flex\"\n alignItems=\"stretch\"\n alignSelf=\"stretch\"\n >\n {leadingInteractionElement}\n </BaseBox>\n ) : null}\n {LeadingIcon ? (\n <BaseBox paddingLeft=\"spacing.4\" display=\"flex\">\n <LeadingIcon\n size={iconSize[size]}\n color={isDisabled ? 'surface.icon.gray.disabled' : 'surface.icon.gray.muted'}\n />\n </BaseBox>\n ) : null}\n {hasPrefix ? (\n <BaseBox {...getPrefixStyles({ hasLeadingIcon, hasPrefix })}>\n <Text\n size={textSize[size]}\n variant=\"body\"\n weight=\"regular\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.muted'}\n >\n {prefix}\n </Text>\n </BaseBox>\n ) : null}\n {leadingDropDown ? (\n <BaseBox paddingLeft=\"spacing.2\" display=\"flex\">\n {leadingDropDown}\n </BaseBox>\n ) : null}\n </BaseBox>\n );\n }\n\n if (hasTrailingVisuals) {\n return (\n <BaseBox\n {...getVisualContainerStyles({\n shouldStretchTrailingBox:\n hasTrailingInteractionElement && Boolean(onTrailingInteractionElementClick),\n })}\n >\n {hasTrailingInteractionElement ? (\n <BaseBox\n {...getVisualContainerStyles({\n shouldStretchTrailingBox:\n hasTrailingInteractionElement && Boolean(onTrailingInteractionElementClick),\n })}\n >\n <BaseBox\n paddingRight={getInteractionElementStyles({\n hasTrailingIcon,\n hasTrailingInteractionElement,\n hasSuffix,\n hasTrailingButton,\n hasTrailingDropDown,\n })}\n display=\"flex\"\n alignItems=\"stretch\"\n alignSelf=\"stretch\"\n {...(!isReactNative() && { onClick: onTrailingInteractionElementClick })}\n >\n {trailingInteractionElement}\n </BaseBox>\n </BaseBox>\n ) : null}\n {hasSuffix ? (\n <BaseBox {...getSuffixStyles({ hasTrailingIcon, hasSuffix, hasTrailingButton })}>\n <Text\n size={textSize[size]}\n variant=\"body\"\n weight=\"regular\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.subtle'}\n >\n {suffix}\n </Text>\n </BaseBox>\n ) : null}\n {TrailingIcon ? (\n <BaseBox\n display=\"flex\"\n justifyContent=\"center\"\n alignItems=\"center\"\n {...getTrailingIconStyles({ hasTrailingIcon, hasTrailingButton })}\n >\n <ValidationIconTooltip\n showHintsAsTooltip={showHintsAsTooltip}\n errorText={errorText}\n successText={successText}\n validationState={validationState}\n >\n <TrailingIcon\n size={iconSize[size]}\n color={\n isDisabled ? 'interactive.icon.gray.disabled' : trailingIconColor[validationState]\n }\n />\n </ValidationIconTooltip>\n </BaseBox>\n ) : null}\n {TrailingButton ? (\n <BaseBox paddingRight=\"spacing.4\" display=\"flex\">\n {React.cloneElement(TrailingButton, {\n size,\n variant: 'button',\n isDisabled,\n })}\n </BaseBox>\n ) : null}\n {hasTrailingDropDown ? (\n <BaseBox paddingRight=\"spacing.2\" display=\"flex\">\n {trailingDropDown}\n </BaseBox>\n ) : null}\n </BaseBox>\n );\n }\n\n return null;\n};\n"],"names":["getVisualContainerStyles","_ref","arguments","length","undefined","shouldStretchTrailingBox","display","flexDirection","alignItems","alignSelf","trailingIconColor","none","error","success","iconSize","xsmall","medium","large","textSize","getPrefixStyles","_ref2","hasLeadingIcon","hasPrefix","paddingLeft","getInteractionElementStyles","_ref3","hasTrailingIcon","hasLeadingInteractionElement","hasLeadingDropDown","hasTrailingInteractionElement","hasSuffix","hasTrailingButton","hasTrailingDropDown","getSuffixStyles","_ref4","paddingRight","getTrailingIconStyles","_ref5","getInputVisualsToBeRendered","_ref6","leadingIcon","prefix","trailingInteractionElement","leadingInteractionElement","suffix","trailingIcon","trailingButton","leadingDropDown","trailingDropDown","Boolean","getTooltipContent","_ref7","validationState","errorText","successText","ValidationIconTooltip","_ref8","children","showHintsAsTooltip","_jsx","Tooltip","content","Box","justifyContent","BaseInputVisuals","_ref9","LeadingIcon","onTrailingInteractionElementClick","TrailingIcon","isDisabled","_ref9$validationState","size","TrailingButton","_getInputVisualsToBeR","hasLeadingVisuals","hasTrailingVisuals","__DEV__","isValidAllowedChildren","throwBladeError","message","moduleName","_jsxs","BaseBox","Object","assign","color","Text","variant","weight","isReactNative","onClick","React","cloneElement"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseInputVisuals.js","sources":["../../../../../../src/components/Input/BaseInput/BaseInputVisuals.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport React from 'react';\nimport type { ReactElement } from 'react';\nimport type { BaseInputProps } from './BaseInput';\nimport BaseBox from '~components/Box/BaseBox';\nimport { Text } from '~components/Typography';\nimport type { BaseBoxProps, SpacingValueType } from '~components/Box/BaseBox';\nimport type { IconColors } from '~components/Icons';\nimport { isValidAllowedChildren } from '~utils/isValidAllowedChildren';\nimport { throwBladeError } from '~utils/logger';\nimport { Tooltip } from '~components/Tooltip';\nimport { Box } from '~components/Box';\nimport { isReactNative } from '~utils';\n\ntype InputVisuals = Pick<\n BaseInputProps,\n | 'leadingIcon'\n | 'prefix'\n | 'trailingInteractionElement'\n | 'onTrailingInteractionElementClick'\n | 'leadingInteractionElement'\n | 'leadingDropDown'\n | 'trailingDropDown'\n | 'suffix'\n | 'trailingIcon'\n | 'isDisabled'\n | 'validationState'\n | 'size'\n | 'trailingButton'\n | 'showHintsAsTooltip'\n | 'errorText'\n | 'successText'\n> & {\n size: NonNullable<BaseInputProps['size']>;\n};\n\nconst getVisualContainerStyles = ({\n shouldStretchTrailingBox,\n}: {\n shouldStretchTrailingBox?: boolean;\n} = {}): Pick<BaseBoxProps, 'display' | 'flexDirection' | 'alignItems' | 'alignSelf'> => ({\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n alignSelf: shouldStretchTrailingBox ? 'stretch' : 'center',\n});\n\nconst trailingIconColor: Record<NonNullable<InputVisuals['validationState']>, IconColors> = {\n none: 'surface.icon.gray.subtle',\n error: 'feedback.icon.negative.intense',\n success: 'feedback.icon.positive.intense',\n};\n\nconst iconSize = {\n xsmall: 'small',\n small: 'small',\n medium: 'medium',\n large: 'large',\n} as const;\n\nconst textSize = {\n xsmall: 'small',\n small: 'small',\n medium: 'medium',\n large: 'large',\n} as const;\n\nconst getPrefixStyles = ({\n hasLeadingIcon,\n hasPrefix,\n}: {\n hasLeadingIcon: boolean;\n hasPrefix: boolean;\n}): Pick<BaseBoxProps, 'paddingLeft'> => {\n if (hasPrefix && hasLeadingIcon) {\n return {\n paddingLeft: 'spacing.3',\n };\n }\n\n if (hasPrefix && !hasLeadingIcon) {\n return {\n paddingLeft: 'spacing.4',\n };\n }\n\n return {\n paddingLeft: 'spacing.0',\n };\n};\n\nconst getInteractionElementStyles = ({\n hasTrailingIcon,\n hasLeadingInteractionElement,\n hasLeadingDropDown,\n hasTrailingInteractionElement,\n hasSuffix,\n hasTrailingButton,\n hasTrailingDropDown,\n}: {\n hasTrailingIcon: boolean;\n hasLeadingInteractionElement?: boolean;\n hasLeadingDropDown?: boolean;\n hasTrailingInteractionElement?: boolean;\n hasSuffix: boolean;\n hasTrailingButton: boolean;\n hasTrailingDropDown?: boolean;\n}): SpacingValueType => {\n if (hasTrailingInteractionElement && (hasSuffix || hasTrailingIcon || hasTrailingButton)) {\n return 'spacing.2';\n }\n\n if (hasLeadingDropDown || hasTrailingDropDown) {\n return 'spacing.2';\n }\n\n if (hasTrailingInteractionElement && !hasSuffix && !hasTrailingIcon && !hasTrailingButton) {\n return 'spacing.4';\n }\n\n if (hasLeadingInteractionElement) {\n return 'spacing.3';\n }\n\n return 'spacing.0';\n};\n\nconst getSuffixStyles = ({\n hasTrailingIcon,\n hasSuffix,\n hasTrailingButton,\n}: {\n hasTrailingIcon: boolean;\n hasSuffix: boolean;\n hasTrailingButton: boolean;\n}): Pick<BaseBoxProps, 'paddingRight'> => {\n if (hasSuffix && (hasTrailingIcon || hasTrailingButton)) {\n return {\n paddingRight: 'spacing.3',\n };\n }\n\n if (hasSuffix && !hasTrailingIcon && !hasTrailingButton) {\n return {\n paddingRight: 'spacing.4',\n };\n }\n\n return {\n paddingRight: 'spacing.0',\n };\n};\n\nconst getTrailingIconStyles = ({\n hasTrailingIcon,\n hasTrailingButton,\n}: {\n hasTrailingIcon: boolean;\n hasTrailingButton: boolean;\n}): Pick<BaseBoxProps, 'paddingRight'> => {\n if (hasTrailingIcon && hasTrailingButton) {\n return {\n paddingRight: 'spacing.3',\n };\n }\n\n if (hasTrailingIcon && !hasTrailingButton) {\n return {\n paddingRight: 'spacing.4',\n };\n }\n\n return {\n paddingRight: 'spacing.0',\n };\n};\n\nexport const getInputVisualsToBeRendered = ({\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n trailingButton,\n leadingDropDown,\n trailingDropDown,\n}: InputVisuals) => ({\n hasLeadingIcon: Boolean(leadingIcon),\n hasPrefix: Boolean(prefix),\n hasTrailingInteractionElement: Boolean(trailingInteractionElement),\n hasLeadingInteractionElement: Boolean(leadingInteractionElement),\n hasSuffix: Boolean(suffix),\n hasTrailingIcon: Boolean(trailingIcon),\n hasTrailingButton: Boolean(trailingButton),\n hasLeadingDropDown: Boolean(leadingDropDown),\n hasTrailingDropDown: Boolean(trailingDropDown),\n});\n\nconst getTooltipContent = ({\n validationState,\n errorText,\n successText,\n}: {\n validationState: BaseInputProps['validationState'];\n errorText: BaseInputProps['errorText'];\n successText: BaseInputProps['errorText'];\n}): string => {\n if (validationState === 'error' && errorText) {\n return errorText;\n }\n\n if (validationState === 'success' && successText) {\n return successText;\n }\n\n return '';\n};\n\nconst ValidationIconTooltip = ({\n children,\n validationState,\n errorText,\n successText,\n showHintsAsTooltip,\n}: {\n children: ReactElement;\n validationState: BaseInputProps['validationState'];\n errorText: BaseInputProps['errorText'];\n successText: BaseInputProps['errorText'];\n showHintsAsTooltip: BaseInputProps['showHintsAsTooltip'];\n}) => {\n if (\n (showHintsAsTooltip && validationState === 'error' && errorText) ||\n (validationState === 'success' && successText)\n ) {\n return (\n <Tooltip content={getTooltipContent({ validationState, errorText, successText })}>\n <Box display=\"flex\" justifyContent=\"center\" alignItems=\"center\">\n {children}\n </Box>\n </Tooltip>\n );\n }\n\n return children;\n};\n\nexport const BaseInputVisuals = ({\n leadingIcon: LeadingIcon,\n prefix,\n trailingInteractionElement,\n onTrailingInteractionElementClick,\n leadingDropDown,\n trailingDropDown,\n leadingInteractionElement,\n suffix,\n trailingIcon: TrailingIcon,\n isDisabled,\n validationState = 'none',\n size,\n showHintsAsTooltip,\n errorText,\n successText,\n trailingButton: TrailingButton,\n}: InputVisuals): ReactElement | null => {\n const {\n hasLeadingIcon,\n hasPrefix,\n hasSuffix,\n hasTrailingInteractionElement,\n hasLeadingInteractionElement,\n hasTrailingIcon,\n hasTrailingButton,\n hasLeadingDropDown,\n hasTrailingDropDown,\n } = getInputVisualsToBeRendered({\n leadingIcon: LeadingIcon,\n prefix,\n leadingInteractionElement,\n trailingInteractionElement,\n suffix,\n trailingIcon: TrailingIcon,\n trailingButton: TrailingButton,\n leadingDropDown,\n trailingDropDown,\n size,\n });\n\n const hasLeadingVisuals =\n hasLeadingInteractionElement || hasLeadingIcon || hasPrefix || hasLeadingDropDown;\n const hasTrailingVisuals =\n hasTrailingInteractionElement ||\n hasSuffix ||\n hasTrailingIcon ||\n hasTrailingButton ||\n hasTrailingDropDown;\n\n if (__DEV__) {\n if (hasTrailingButton && !isValidAllowedChildren(TrailingButton, 'Link')) {\n throwBladeError({\n message: 'trailingButton must be a valid Blade Link component',\n moduleName: 'BaseInput',\n });\n }\n }\n\n if (hasLeadingVisuals) {\n return (\n <BaseBox {...getVisualContainerStyles()}>\n {hasLeadingInteractionElement ? (\n <BaseBox\n paddingLeft={getInteractionElementStyles({\n hasTrailingIcon,\n hasLeadingInteractionElement,\n hasSuffix,\n hasTrailingButton,\n })}\n display=\"flex\"\n alignItems=\"stretch\"\n alignSelf=\"stretch\"\n >\n {leadingInteractionElement}\n </BaseBox>\n ) : null}\n {LeadingIcon ? (\n <BaseBox paddingLeft=\"spacing.4\" display=\"flex\">\n <LeadingIcon\n size={iconSize[size]}\n color={isDisabled ? 'surface.icon.gray.disabled' : 'surface.icon.gray.muted'}\n />\n </BaseBox>\n ) : null}\n {hasPrefix ? (\n <BaseBox {...getPrefixStyles({ hasLeadingIcon, hasPrefix })}>\n <Text\n size={textSize[size]}\n variant=\"body\"\n weight=\"regular\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.muted'}\n >\n {prefix}\n </Text>\n </BaseBox>\n ) : null}\n {leadingDropDown ? (\n <BaseBox paddingLeft=\"spacing.2\" display=\"flex\">\n {leadingDropDown}\n </BaseBox>\n ) : null}\n </BaseBox>\n );\n }\n\n if (hasTrailingVisuals) {\n return (\n <BaseBox\n {...getVisualContainerStyles({\n shouldStretchTrailingBox:\n hasTrailingInteractionElement && Boolean(onTrailingInteractionElementClick),\n })}\n >\n {hasTrailingInteractionElement ? (\n <BaseBox\n {...getVisualContainerStyles({\n shouldStretchTrailingBox:\n hasTrailingInteractionElement && Boolean(onTrailingInteractionElementClick),\n })}\n >\n <BaseBox\n paddingRight={getInteractionElementStyles({\n hasTrailingIcon,\n hasTrailingInteractionElement,\n hasSuffix,\n hasTrailingButton,\n hasTrailingDropDown,\n })}\n display=\"flex\"\n alignItems=\"stretch\"\n alignSelf=\"stretch\"\n {...(!isReactNative() && { onClick: onTrailingInteractionElementClick })}\n >\n {trailingInteractionElement}\n </BaseBox>\n </BaseBox>\n ) : null}\n {hasSuffix ? (\n <BaseBox {...getSuffixStyles({ hasTrailingIcon, hasSuffix, hasTrailingButton })}>\n <Text\n size={textSize[size]}\n variant=\"body\"\n weight=\"regular\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.subtle'}\n >\n {suffix}\n </Text>\n </BaseBox>\n ) : null}\n {TrailingIcon ? (\n <BaseBox\n display=\"flex\"\n justifyContent=\"center\"\n alignItems=\"center\"\n {...getTrailingIconStyles({ hasTrailingIcon, hasTrailingButton })}\n >\n <ValidationIconTooltip\n showHintsAsTooltip={showHintsAsTooltip}\n errorText={errorText}\n successText={successText}\n validationState={validationState}\n >\n <TrailingIcon\n size={iconSize[size]}\n color={\n isDisabled ? 'interactive.icon.gray.disabled' : trailingIconColor[validationState]\n }\n />\n </ValidationIconTooltip>\n </BaseBox>\n ) : null}\n {TrailingButton ? (\n <BaseBox paddingRight=\"spacing.4\" display=\"flex\">\n {React.cloneElement(TrailingButton, {\n size,\n variant: 'button',\n isDisabled,\n })}\n </BaseBox>\n ) : null}\n {hasTrailingDropDown ? (\n <BaseBox paddingRight=\"spacing.2\" display=\"flex\">\n {trailingDropDown}\n </BaseBox>\n ) : null}\n </BaseBox>\n );\n }\n\n return null;\n};\n"],"names":["getVisualContainerStyles","_ref","arguments","length","undefined","shouldStretchTrailingBox","display","flexDirection","alignItems","alignSelf","trailingIconColor","none","error","success","iconSize","xsmall","small","medium","large","textSize","getPrefixStyles","_ref2","hasLeadingIcon","hasPrefix","paddingLeft","getInteractionElementStyles","_ref3","hasTrailingIcon","hasLeadingInteractionElement","hasLeadingDropDown","hasTrailingInteractionElement","hasSuffix","hasTrailingButton","hasTrailingDropDown","getSuffixStyles","_ref4","paddingRight","getTrailingIconStyles","_ref5","getInputVisualsToBeRendered","_ref6","leadingIcon","prefix","trailingInteractionElement","leadingInteractionElement","suffix","trailingIcon","trailingButton","leadingDropDown","trailingDropDown","Boolean","getTooltipContent","_ref7","validationState","errorText","successText","ValidationIconTooltip","_ref8","children","showHintsAsTooltip","_jsx","Tooltip","content","Box","justifyContent","BaseInputVisuals","_ref9","LeadingIcon","onTrailingInteractionElementClick","TrailingIcon","isDisabled","_ref9$validationState","size","TrailingButton","_getInputVisualsToBeR","hasLeadingVisuals","hasTrailingVisuals","__DEV__","isValidAllowedChildren","throwBladeError","message","moduleName","_jsxs","BaseBox","Object","assign","color","Text","variant","weight","isReactNative","onClick","React","cloneElement"],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@ import '../../../tokens/global/typography.js';
|
|
|
2
2
|
import '../../../tokens/global/motion.js';
|
|
3
3
|
import { size } from '../../../tokens/global/size.js';
|
|
4
4
|
|
|
5
|
-
var BASEINPUT_MAX_ROWS=4;var baseInputHeight={xsmall:size['26'],medium:size['36'],large:size['48']};var baseInputWrapperMaxHeight={xsmall:baseInputHeight.xsmall*BASEINPUT_MAX_ROWS,medium:baseInputHeight.medium*BASEINPUT_MAX_ROWS,large:baseInputHeight.large*BASEINPUT_MAX_ROWS};var baseInputBorderColor={default:'interactive.border.gray.default',hovered:'interactive.border.gray.highlighted',focused:'interactive.border.primary.default',disabled:'interactive.border.gray.disabled',error:'interactive.border.negative.default',success:'interactive.border.positive.default'};var baseInputBackgroundColor={default:'surface.background.gray.intense',hovered:'surface.background.gray.moderate',focused:'surface.background.gray.moderate',disabled:'surface.background.gray.subtle',error:'surface.background.gray.intense',success:'surface.background.gray.intense'};var baseInputBorderlessBackgroundColor={default:'transparent',hovered:'surface.background.gray.moderate',focused:'surface.background.gray.moderate',disabled:'surface.background.gray.intense',error:'feedback.background.negative.subtle',success:'feedback.background.positive.subtle'};var baseInputBorderWidth={default:'thin',hovered:'thin',disabled:'thin',focused:'thick',error:'thick',success:'thick'};var baseInputBorderBackgroundMotion={enter:{duration:'xgentle',easing:'emphasized'},exit:{duration:'gentle',easing:'standard'}};var baseInputPaddingTokens={top:{xsmall:2,medium:3,large:4},bottom:{xsmall:2,medium:3,large:4},left:{xsmall:3,medium:4,large:4},right:{xsmall:3,medium:4,large:4}};var formHintLeftLabelMarginLeft={xsmall:136,medium:136,large:192};var baseInputCounterInputPaddingTokens={top:{xsmall:2,medium:2,large:2},bottom:{xsmall:2,medium:2,large:2},left:{xsmall:2,medium:2,large:2},right:{xsmall:2,medium:2,large:2}};
|
|
5
|
+
var BASEINPUT_MAX_ROWS=4;var baseInputHeight={xsmall:size['26'],small:size['30'],medium:size['36'],large:size['48']};var baseInputWrapperMaxHeight={xsmall:baseInputHeight.xsmall*BASEINPUT_MAX_ROWS,small:baseInputHeight.small*BASEINPUT_MAX_ROWS,medium:baseInputHeight.medium*BASEINPUT_MAX_ROWS,large:baseInputHeight.large*BASEINPUT_MAX_ROWS};var baseInputBorderColor={default:'interactive.border.gray.default',hovered:'interactive.border.gray.highlighted',focused:'interactive.border.primary.default',disabled:'interactive.border.gray.disabled',error:'interactive.border.negative.default',success:'interactive.border.positive.default'};var baseInputBackgroundColor={default:'surface.background.gray.intense',hovered:'surface.background.gray.moderate',focused:'surface.background.gray.moderate',disabled:'surface.background.gray.subtle',error:'surface.background.gray.intense',success:'surface.background.gray.intense'};var baseInputBorderlessBackgroundColor={default:'transparent',hovered:'surface.background.gray.moderate',focused:'surface.background.gray.moderate',disabled:'surface.background.gray.intense',error:'feedback.background.negative.subtle',success:'feedback.background.positive.subtle'};var baseInputBorderWidth={default:'thin',hovered:'thin',disabled:'thin',focused:'thick',error:'thick',success:'thick'};var baseInputBorderBackgroundMotion={enter:{duration:'xgentle',easing:'emphasized'},exit:{duration:'gentle',easing:'standard'}};var baseInputPaddingTokens={top:{xsmall:2,small:2,medium:3,large:4},bottom:{xsmall:2,small:2,medium:3,large:4},left:{xsmall:3,small:3,medium:4,large:4},right:{xsmall:3,small:3,medium:4,large:4}};var formHintLeftLabelMarginLeft={xsmall:136,small:136,medium:136,large:192};var baseInputCounterInputPaddingTokens={top:{xsmall:2,small:2,medium:2,large:2},bottom:{xsmall:2,small:2,medium:2,large:2},left:{xsmall:2,small:2,medium:2,large:2},right:{xsmall:2,small:2,medium:2,large:2}};
|
|
6
6
|
|
|
7
7
|
export { BASEINPUT_MAX_ROWS, baseInputBackgroundColor, baseInputBorderBackgroundMotion, baseInputBorderColor, baseInputBorderWidth, baseInputBorderlessBackgroundColor, baseInputCounterInputPaddingTokens, baseInputHeight, baseInputPaddingTokens, baseInputWrapperMaxHeight, formHintLeftLabelMarginLeft };
|
|
8
8
|
//# sourceMappingURL=baseInputTokens.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"baseInputTokens.js","sources":["../../../../../../src/components/Input/BaseInput/baseInputTokens.ts"],"sourcesContent":["import type { BaseInputProps } from './BaseInput';\nimport { size, spacing } from '~tokens/global';\n\nexport const BASEINPUT_MAX_ROWS = 4;\n\nexport const TAG_HEIGHT = size['20'];\nexport const TAG_GAP = spacing['3'];\n\n/**\n * 36px\n */\nexport const baseInputHeight: Record<\n NonNullable<BaseInputProps['size']>,\n typeof size[keyof typeof size]\n> = {\n xsmall: size['26'],\n medium: size['36'],\n large: size['48'],\n};\n\n/**\n * medium - 144px (36px height * 4 rows)\n * large - 192px (48px height * 4 rows)\n */\n// we don't want exact number but rough number to be able to animate correctly in height.\nexport const baseInputWrapperMaxHeight = {\n xsmall: baseInputHeight.xsmall * BASEINPUT_MAX_ROWS,\n medium: baseInputHeight.medium * BASEINPUT_MAX_ROWS,\n large: baseInputHeight.large * BASEINPUT_MAX_ROWS,\n} as const;\n\nexport const baseInputBorderColor = {\n default: 'interactive.border.gray.default',\n hovered: 'interactive.border.gray.highlighted',\n focused: 'interactive.border.primary.default',\n disabled: 'interactive.border.gray.disabled',\n error: 'interactive.border.negative.default',\n success: 'interactive.border.positive.default',\n} as const;\n\nexport const baseInputBackgroundColor = {\n default: 'surface.background.gray.intense',\n hovered: 'surface.background.gray.moderate',\n focused: 'surface.background.gray.moderate',\n disabled: 'surface.background.gray.subtle',\n error: 'surface.background.gray.intense',\n success: 'surface.background.gray.intense',\n} as const;\n\nexport const baseInputBorderlessBackgroundColor = {\n default: 'transparent',\n hovered: 'surface.background.gray.moderate',\n focused: 'surface.background.gray.moderate',\n disabled: 'surface.background.gray.intense',\n error: 'feedback.background.negative.subtle',\n success: 'feedback.background.positive.subtle',\n} as const;\n\nexport const baseInputBorderWidth = {\n default: 'thin',\n hovered: 'thin',\n disabled: 'thin',\n focused: 'thick',\n error: 'thick',\n success: 'thick',\n} as const;\n\nexport const baseInputBorderBackgroundMotion = {\n enter: { duration: 'xgentle', easing: 'emphasized' },\n exit: { duration: 'gentle', easing: 'standard' },\n} as const;\n\nexport const baseInputPaddingTokens = {\n top: {\n xsmall: 2,\n medium: 3,\n large: 4,\n },\n bottom: {\n xsmall: 2,\n medium: 3,\n large: 4,\n },\n left: {\n xsmall: 3,\n medium: 4,\n large: 4,\n },\n right: {\n xsmall: 3,\n medium: 4,\n large: 4,\n },\n} as const;\n\n/* the magic number 192 is basically max-width of label \ni.e 176 and then right margin \ni.e 16 which is the spacing between label and input field */\nexport const formHintLeftLabelMarginLeft = {\n xsmall: 136,\n medium: 136,\n large: 192,\n} as const;\n\nexport const baseInputCounterInputPaddingTokens = {\n top: {\n xsmall: 2,\n medium: 2,\n large: 2,\n },\n bottom: {\n xsmall: 2,\n medium: 2,\n large: 2,\n },\n left: {\n xsmall: 2,\n medium: 2,\n large: 2,\n },\n right: {\n xsmall: 2,\n medium: 2,\n large: 2,\n },\n} as const;\n"],"names":["BASEINPUT_MAX_ROWS","baseInputHeight","xsmall","size","medium","large","baseInputWrapperMaxHeight","baseInputBorderColor","default","hovered","focused","disabled","error","success","baseInputBackgroundColor","baseInputBorderlessBackgroundColor","baseInputBorderWidth","baseInputBorderBackgroundMotion","enter","duration","easing","exit","baseInputPaddingTokens","top","bottom","left","right","formHintLeftLabelMarginLeft","baseInputCounterInputPaddingTokens"],"mappings":";;;;AAGa,IAAAA,kBAAkB,CAAG,EAQrB,IAAAC,eAGZ,CAAG,CACFC,MAAM,CAAEC,IAAI,CAAC,IAAI,CAAC,CAClBC,
|
|
1
|
+
{"version":3,"file":"baseInputTokens.js","sources":["../../../../../../src/components/Input/BaseInput/baseInputTokens.ts"],"sourcesContent":["import type { BaseInputProps } from './BaseInput';\nimport { size, spacing } from '~tokens/global';\n\nexport const BASEINPUT_MAX_ROWS = 4;\n\nexport const TAG_HEIGHT = size['20'];\nexport const TAG_GAP = spacing['3'];\n\n/**\n * 36px\n */\nexport const baseInputHeight: Record<\n NonNullable<BaseInputProps['size']>,\n typeof size[keyof typeof size]\n> = {\n xsmall: size['26'],\n small: size['30'],\n medium: size['36'],\n large: size['48'],\n};\n\n/**\n * medium - 144px (36px height * 4 rows)\n * large - 192px (48px height * 4 rows)\n */\n// we don't want exact number but rough number to be able to animate correctly in height.\nexport const baseInputWrapperMaxHeight = {\n xsmall: baseInputHeight.xsmall * BASEINPUT_MAX_ROWS,\n small: baseInputHeight.small * BASEINPUT_MAX_ROWS,\n medium: baseInputHeight.medium * BASEINPUT_MAX_ROWS,\n large: baseInputHeight.large * BASEINPUT_MAX_ROWS,\n} as const;\n\nexport const baseInputBorderColor = {\n default: 'interactive.border.gray.default',\n hovered: 'interactive.border.gray.highlighted',\n focused: 'interactive.border.primary.default',\n disabled: 'interactive.border.gray.disabled',\n error: 'interactive.border.negative.default',\n success: 'interactive.border.positive.default',\n} as const;\n\nexport const baseInputBackgroundColor = {\n default: 'surface.background.gray.intense',\n hovered: 'surface.background.gray.moderate',\n focused: 'surface.background.gray.moderate',\n disabled: 'surface.background.gray.subtle',\n error: 'surface.background.gray.intense',\n success: 'surface.background.gray.intense',\n} as const;\n\nexport const baseInputBorderlessBackgroundColor = {\n default: 'transparent',\n hovered: 'surface.background.gray.moderate',\n focused: 'surface.background.gray.moderate',\n disabled: 'surface.background.gray.intense',\n error: 'feedback.background.negative.subtle',\n success: 'feedback.background.positive.subtle',\n} as const;\n\nexport const baseInputBorderWidth = {\n default: 'thin',\n hovered: 'thin',\n disabled: 'thin',\n focused: 'thick',\n error: 'thick',\n success: 'thick',\n} as const;\n\nexport const baseInputBorderBackgroundMotion = {\n enter: { duration: 'xgentle', easing: 'emphasized' },\n exit: { duration: 'gentle', easing: 'standard' },\n} as const;\n\nexport const baseInputPaddingTokens = {\n top: {\n xsmall: 2,\n small: 2,\n medium: 3,\n large: 4,\n },\n bottom: {\n xsmall: 2,\n small: 2,\n medium: 3,\n large: 4,\n },\n left: {\n xsmall: 3,\n small: 3,\n medium: 4,\n large: 4,\n },\n right: {\n xsmall: 3,\n small: 3,\n medium: 4,\n large: 4,\n },\n} as const;\n\n/* the magic number 192 is basically max-width of label \ni.e 176 and then right margin \ni.e 16 which is the spacing between label and input field */\nexport const formHintLeftLabelMarginLeft = {\n xsmall: 136,\n small: 136,\n medium: 136,\n large: 192,\n} as const;\n\nexport const baseInputCounterInputPaddingTokens = {\n top: {\n xsmall: 2,\n small: 2,\n medium: 2,\n large: 2,\n },\n bottom: {\n xsmall: 2,\n small: 2,\n medium: 2,\n large: 2,\n },\n left: {\n xsmall: 2,\n small: 2,\n medium: 2,\n large: 2,\n },\n right: {\n xsmall: 2,\n small: 2,\n medium: 2,\n large: 2,\n },\n} as const;\n"],"names":["BASEINPUT_MAX_ROWS","baseInputHeight","xsmall","size","small","medium","large","baseInputWrapperMaxHeight","baseInputBorderColor","default","hovered","focused","disabled","error","success","baseInputBackgroundColor","baseInputBorderlessBackgroundColor","baseInputBorderWidth","baseInputBorderBackgroundMotion","enter","duration","easing","exit","baseInputPaddingTokens","top","bottom","left","right","formHintLeftLabelMarginLeft","baseInputCounterInputPaddingTokens"],"mappings":"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"}
|
|
@@ -470,7 +470,7 @@ import { Card, CardBody } from '../Card/Card.js';
|
|
|
470
470
|
import '../Card/CardHeader.js';
|
|
471
471
|
import '../Card/CardFooter.js';
|
|
472
472
|
|
|
473
|
-
var _excluded=["value","title","trailing","selectionType","isSelected"],_excluded2=["title","value","trailing","testID"];var QuickFilterContent=function QuickFilterContent(_ref){var value=_ref.value,title=_ref.title,trailing=_ref.trailing,_ref$selectionType=_ref.selectionType,selectionType=_ref$selectionType===void 0?'single':_ref$selectionType,_ref$isSelected=_ref.isSelected,isSelected=_ref$isSelected===void 0?false:_ref$isSelected,rest=_objectWithoutProperties(_ref,_excluded);return jsxs(BaseBox,{display:"flex",flexDirection:"row",gap:"spacing.3",width:"fit-content",justifyContent:"center",alignItems:"center",paddingY:"spacing.3",paddingLeft:"spacing.3",paddingRight:"spacing.4",children:[jsxs(Box,{display:"flex",flexDirection:"row",gap:"spacing.2",justifyContent:"center",alignItems:"center",children:[selectionType==='single'?jsx(Radio,Object.assign({value:value},makeAnalyticsAttribute(rest))):jsx(Checkbox,Object.assign({value:value},makeAnalyticsAttribute(rest))),jsx(Text,{variant:"body",size:"medium",color:isSelected?'interactive.text.primary.subtle':'interactive.text.gray.subtle',weight:"medium",children:title})]}),trailing]});};var QuickFilter=forwardRef(function(_ref2,ref){var title=_ref2.title,value=_ref2.value,trailing=_ref2.trailing,testID=_ref2.testID,rest=_objectWithoutProperties(_ref2,_excluded2);var _useQuickFilterGroupC=useQuickFilterGroupContext(),selectedQuickFilters=_useQuickFilterGroupC.selectedQuickFilters,selectionType=_useQuickFilterGroupC.selectionType;var isQuickFilterSelected=selectedQuickFilters.includes(value);return jsx(Card,Object.assign({padding:"spacing.0",as:"label",accessibilityLabel:title,borderRadius:"medium",elevation:"none",isSelected:isQuickFilterSelected,ref:ref,marginRight:"spacing.1"},makeAnalyticsAttribute(rest),metaAttribute({testID:testID}),{children:jsx(CardBody,{children:jsx(QuickFilterContent,Object.assign({value:value,title:title,trailing:trailing,selectionType:selectionType,isSelected:isQuickFilterSelected},rest))})}));});
|
|
473
|
+
var _excluded=["value","title","trailing","selectionType","isSelected"],_excluded2=["title","value","trailing","testID"];var QuickFilterContent=function QuickFilterContent(_ref){var value=_ref.value,title=_ref.title,trailing=_ref.trailing,_ref$selectionType=_ref.selectionType,selectionType=_ref$selectionType===void 0?'single':_ref$selectionType,_ref$isSelected=_ref.isSelected,isSelected=_ref$isSelected===void 0?false:_ref$isSelected,rest=_objectWithoutProperties(_ref,_excluded);return jsxs(BaseBox,{display:"flex",flexDirection:"row",gap:"spacing.3",width:"fit-content",justifyContent:"center",alignItems:"center",paddingY:"spacing.3",paddingLeft:"spacing.3",paddingRight:"spacing.4",children:[jsxs(Box,{display:"flex",flexDirection:"row",gap:"spacing.2",justifyContent:"center",alignItems:"center",children:[selectionType==='single'?jsx(Radio,Object.assign({value:value,_hideRadioIcon:true},makeAnalyticsAttribute(rest))):jsx(Checkbox,Object.assign({value:value},makeAnalyticsAttribute(rest))),jsx(Text,{variant:"body",size:"medium",color:isSelected?'interactive.text.primary.subtle':'interactive.text.gray.subtle',weight:"medium",children:title})]}),trailing]});};var QuickFilter=forwardRef(function(_ref2,ref){var title=_ref2.title,value=_ref2.value,trailing=_ref2.trailing,testID=_ref2.testID,rest=_objectWithoutProperties(_ref2,_excluded2);var _useQuickFilterGroupC=useQuickFilterGroupContext(),selectedQuickFilters=_useQuickFilterGroupC.selectedQuickFilters,selectionType=_useQuickFilterGroupC.selectionType;var isQuickFilterSelected=selectedQuickFilters.includes(value);return jsx(Card,Object.assign({padding:"spacing.0",as:"label",accessibilityLabel:title,borderRadius:"medium",elevation:"none",isSelected:isQuickFilterSelected,ref:ref,marginRight:"spacing.1"},makeAnalyticsAttribute(rest),metaAttribute({testID:testID}),{children:jsx(CardBody,{children:jsx(QuickFilterContent,Object.assign({value:value,title:title,trailing:trailing,selectionType:selectionType,isSelected:isQuickFilterSelected},rest))})}));});
|
|
474
474
|
|
|
475
475
|
export { QuickFilter };
|
|
476
476
|
//# sourceMappingURL=QuickFilter.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QuickFilter.js","sources":["../../../../../src/components/QuickFilters/QuickFilter.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport type { QuickFilterProps, QuickFilterContentProps } from './types';\nimport { useQuickFilterGroupContext } from './QuickFilterGroup';\nimport { Card, CardBody } from '~components/Card';\nimport { Box } from '~components/Box';\nimport { Text } from '~components/Typography';\nimport { Radio } from '~components/Radio';\nimport { Checkbox } from '~components/Checkbox';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\nimport { metaAttribute } from '~utils/metaAttribute';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { BladeElementRef } from '~utils/types';\n\nconst QuickFilterContent = ({\n value,\n title,\n trailing,\n selectionType = 'single',\n isSelected = false,\n ...rest\n}: QuickFilterContentProps): React.ReactElement => {\n return (\n <BaseBox\n display=\"flex\"\n flexDirection=\"row\"\n gap=\"spacing.3\"\n width=\"fit-content\"\n justifyContent=\"center\"\n alignItems=\"center\"\n paddingY=\"spacing.3\"\n paddingLeft=\"spacing.3\"\n paddingRight=\"spacing.4\"\n >\n <Box\n display=\"flex\"\n flexDirection=\"row\"\n gap=\"spacing.2\"\n justifyContent=\"center\"\n alignItems=\"center\"\n >\n {selectionType === 'single' ? (\n <Radio value={value} {...makeAnalyticsAttribute(rest)} />\n ) : (\n <Checkbox value={value} {...makeAnalyticsAttribute(rest)} />\n )}\n <Text\n variant=\"body\"\n size=\"medium\"\n color={isSelected ? 'interactive.text.primary.subtle' : 'interactive.text.gray.subtle'}\n weight=\"medium\"\n >\n {title}\n </Text>\n </Box>\n\n {trailing}\n </BaseBox>\n );\n};\n\nconst QuickFilter = forwardRef<BladeElementRef, QuickFilterProps>(\n ({ title, value, trailing, testID, ...rest }, ref): React.ReactElement => {\n const { selectedQuickFilters, selectionType } = useQuickFilterGroupContext();\n\n const isQuickFilterSelected = selectedQuickFilters.includes(value);\n return (\n <Card\n padding=\"spacing.0\"\n as=\"label\"\n accessibilityLabel={title}\n borderRadius=\"medium\"\n elevation=\"none\"\n isSelected={isQuickFilterSelected}\n ref={ref}\n // Add margin to accommodate the box shadow that appears when selected, preventing visual cutoff\n marginRight=\"spacing.1\"\n {...makeAnalyticsAttribute(rest)}\n {...metaAttribute({ testID })}\n >\n <CardBody>\n <QuickFilterContent\n value={value}\n title={title}\n trailing={trailing}\n selectionType={selectionType}\n isSelected={isQuickFilterSelected}\n {...rest}\n />\n </CardBody>\n </Card>\n );\n },\n);\nexport { QuickFilter };\n"],"names":["QuickFilterContent","_ref","value","title","trailing","_ref$selectionType","selectionType","_ref$isSelected","isSelected","rest","_objectWithoutProperties","_excluded","_jsxs","BaseBox","display","flexDirection","gap","width","justifyContent","alignItems","paddingY","paddingLeft","paddingRight","children","Box","_jsx","Radio","Object","assign","makeAnalyticsAttribute","Checkbox","Text","variant","size","color","weight","QuickFilter","forwardRef","_ref2","ref","testID","_excluded2","_useQuickFilterGroupC","useQuickFilterGroupContext","selectedQuickFilters","isQuickFilterSelected","includes","Card","padding","as","accessibilityLabel","borderRadius","elevation","marginRight","metaAttribute","CardBody"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yHAaA,IAAMA,kBAAkB,CAAG,SAArBA,kBAAkBA,CAAAC,IAAA,CAO2B,CANjD,IAAAC,KAAK,CAAAD,IAAA,CAALC,KAAK,CACLC,KAAK,CAAAF,IAAA,CAALE,KAAK,CACLC,QAAQ,CAAAH,IAAA,CAARG,QAAQ,CAAAC,kBAAA,CAAAJ,IAAA,CACRK,aAAa,CAAbA,aAAa,CAAAD,kBAAA,GAAA,KAAA,CAAA,CAAG,QAAQ,CAAAA,kBAAA,CAAAE,eAAA,CAAAN,IAAA,CACxBO,UAAU,CAAVA,UAAU,CAAAD,eAAA,GAAA,KAAA,CAAA,CAAG,KAAK,CAAAA,eAAA,CACfE,IAAI,CAAAC,wBAAA,CAAAT,IAAA,CAAAU,SAAA,CAAA,CAEP,OACEC,IAAA,CAACC,OAAO,
|
|
1
|
+
{"version":3,"file":"QuickFilter.js","sources":["../../../../../src/components/QuickFilters/QuickFilter.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport type { QuickFilterProps, QuickFilterContentProps } from './types';\nimport { useQuickFilterGroupContext } from './QuickFilterGroup';\nimport { Card, CardBody } from '~components/Card';\nimport { Box } from '~components/Box';\nimport { Text } from '~components/Typography';\nimport { Radio } from '~components/Radio';\nimport { Checkbox } from '~components/Checkbox';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\nimport { metaAttribute } from '~utils/metaAttribute';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { BladeElementRef } from '~utils/types';\n\nconst QuickFilterContent = ({\n value,\n title,\n trailing,\n selectionType = 'single',\n isSelected = false,\n ...rest\n}: QuickFilterContentProps): React.ReactElement => {\n return (\n <BaseBox\n display=\"flex\"\n flexDirection=\"row\"\n gap=\"spacing.3\"\n width=\"fit-content\"\n justifyContent=\"center\"\n alignItems=\"center\"\n paddingY=\"spacing.3\"\n paddingLeft=\"spacing.3\"\n paddingRight=\"spacing.4\"\n >\n <Box\n display=\"flex\"\n flexDirection=\"row\"\n gap=\"spacing.2\"\n justifyContent=\"center\"\n alignItems=\"center\"\n >\n {selectionType === 'single' ? (\n <Radio value={value} _hideRadioIcon {...makeAnalyticsAttribute(rest)} />\n ) : (\n <Checkbox value={value} {...makeAnalyticsAttribute(rest)} />\n )}\n <Text\n variant=\"body\"\n size=\"medium\"\n color={isSelected ? 'interactive.text.primary.subtle' : 'interactive.text.gray.subtle'}\n weight=\"medium\"\n >\n {title}\n </Text>\n </Box>\n\n {trailing}\n </BaseBox>\n );\n};\n\nconst QuickFilter = forwardRef<BladeElementRef, QuickFilterProps>(\n ({ title, value, trailing, testID, ...rest }, ref): React.ReactElement => {\n const { selectedQuickFilters, selectionType } = useQuickFilterGroupContext();\n\n const isQuickFilterSelected = selectedQuickFilters.includes(value);\n return (\n <Card\n padding=\"spacing.0\"\n as=\"label\"\n accessibilityLabel={title}\n borderRadius=\"medium\"\n elevation=\"none\"\n isSelected={isQuickFilterSelected}\n ref={ref}\n // Add margin to accommodate the box shadow that appears when selected, preventing visual cutoff\n marginRight=\"spacing.1\"\n {...makeAnalyticsAttribute(rest)}\n {...metaAttribute({ testID })}\n >\n <CardBody>\n <QuickFilterContent\n value={value}\n title={title}\n trailing={trailing}\n selectionType={selectionType}\n isSelected={isQuickFilterSelected}\n {...rest}\n />\n </CardBody>\n </Card>\n );\n },\n);\nexport { QuickFilter };\n"],"names":["QuickFilterContent","_ref","value","title","trailing","_ref$selectionType","selectionType","_ref$isSelected","isSelected","rest","_objectWithoutProperties","_excluded","_jsxs","BaseBox","display","flexDirection","gap","width","justifyContent","alignItems","paddingY","paddingLeft","paddingRight","children","Box","_jsx","Radio","Object","assign","_hideRadioIcon","makeAnalyticsAttribute","Checkbox","Text","variant","size","color","weight","QuickFilter","forwardRef","_ref2","ref","testID","_excluded2","_useQuickFilterGroupC","useQuickFilterGroupContext","selectedQuickFilters","isQuickFilterSelected","includes","Card","padding","as","accessibilityLabel","borderRadius","elevation","marginRight","metaAttribute","CardBody"],"mappings":"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"}
|
|
@@ -26,7 +26,7 @@ import { getOuterMotionRef, getInnerMotionRef } from '../../utils/getMotionRefs.
|
|
|
26
26
|
import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
|
|
27
27
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
28
28
|
|
|
29
|
-
var _excluded=["value","children","helpText","isDisabled","size","testID","_motionMeta"];var _Radio=function _Radio(_ref,ref){var _groupProps$state,_groupProps$size;var value=_ref.value,children=_ref.children,helpText=_ref.helpText,isDisabled=_ref.isDisabled,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,testID=_ref.testID,_motionMeta=_ref._motionMeta,rest=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var groupProps=useRadioGroupContext();var isInsideGroup=!isEmpty(groupProps);if(__DEV__){if(!isInsideGroup){throwBladeError({moduleName:'Radio',message:'Cannot use <Radio /> outside of <RadioGroup />'});}}var isChecked=groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var defaultChecked=(groupProps==null?void 0:groupProps.defaultValue)===undefined?undefined:(groupProps==null?void 0:groupProps.defaultValue)===value;var validationState=groupProps==null?void 0:groupProps.validationState;var hasError=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 showHelpText=helpText;var isReactNative=getPlatformType()==='react-native';var _size=(_groupProps$size=groupProps.size)!=null?_groupProps$size:size;var handleChange=function handleChange(_ref2){var isChecked=_ref2.isChecked,value=_ref2.value,event=_ref2.event;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.setValue(value,event);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue();}};var _useRadio=useRadio({defaultChecked:defaultChecked,isChecked:isChecked,hasError:hasError,isDisabled:_isDisabled,isRequired:_isRequired,name:name,value:value,onChange:handleChange}),state=_useRadio.state,ids=_useRadio.ids,inputProps=_useRadio.inputProps;var helpTextLeftSpacing=makeSize(radioSizes.icon[size].width+theme.spacing[3]);return jsx(BaseBox,Object.assign({ref:getOuterMotionRef({_motionMeta:_motionMeta,ref:ref})},getStyledProps(rest),{children:jsx(SelectorLabel,{componentName:MetaConstants.RadioLabel,inputProps:isReactNative?inputProps:{},testID:testID,children:jsxs(BaseBox,{display:"flex",flexDirection:"column",children:[jsxs(BaseBox,{display:"flex",alignItems:"center",flexDirection:"row",children:[jsx(SelectorInput,Object.assign({hoverTokens:radioHoverTokens,isChecked:state.isChecked,isDisabled:_isDisabled,hasError:hasError,inputProps:inputProps,ref:getInnerMotionRef({_motionMeta:_motionMeta,ref:ref})},makeAnalyticsAttribute(rest)))
|
|
29
|
+
var _excluded=["value","children","helpText","isDisabled","size","_hideRadioIcon","testID","_motionMeta"];var _Radio=function _Radio(_ref,ref){var _groupProps$state,_groupProps$size;var value=_ref.value,children=_ref.children,helpText=_ref.helpText,isDisabled=_ref.isDisabled,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,_ref$_hideRadioIcon=_ref._hideRadioIcon,_hideRadioIcon=_ref$_hideRadioIcon===void 0?false:_ref$_hideRadioIcon,testID=_ref.testID,_motionMeta=_ref._motionMeta,rest=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var groupProps=useRadioGroupContext();var isInsideGroup=!isEmpty(groupProps);if(__DEV__){if(!isInsideGroup){throwBladeError({moduleName:'Radio',message:'Cannot use <Radio /> outside of <RadioGroup />'});}}var isChecked=groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var defaultChecked=(groupProps==null?void 0:groupProps.defaultValue)===undefined?undefined:(groupProps==null?void 0:groupProps.defaultValue)===value;var validationState=groupProps==null?void 0:groupProps.validationState;var hasError=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 showHelpText=helpText;var isReactNative=getPlatformType()==='react-native';var _size=(_groupProps$size=groupProps.size)!=null?_groupProps$size:size;var handleChange=function handleChange(_ref2){var isChecked=_ref2.isChecked,value=_ref2.value,event=_ref2.event;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.setValue(value,event);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue();}};var _useRadio=useRadio({defaultChecked:defaultChecked,isChecked:isChecked,hasError:hasError,isDisabled:_isDisabled,isRequired:_isRequired,name:name,value:value,onChange:handleChange}),state=_useRadio.state,ids=_useRadio.ids,inputProps=_useRadio.inputProps;var helpTextLeftSpacing=makeSize(radioSizes.icon[size].width+theme.spacing[3]);return jsx(BaseBox,Object.assign({ref:getOuterMotionRef({_motionMeta:_motionMeta,ref:ref})},getStyledProps(rest),{children:jsx(SelectorLabel,{componentName:MetaConstants.RadioLabel,inputProps:isReactNative?inputProps:{},testID:testID,children:jsxs(BaseBox,{display:"flex",flexDirection:"column",children:[jsxs(BaseBox,{display:"flex",alignItems:"center",flexDirection:"row",children:[jsx(SelectorInput,Object.assign({hoverTokens:radioHoverTokens,isChecked:state.isChecked,isDisabled:_isDisabled,hasError:hasError,inputProps:inputProps,ref:getInnerMotionRef({_motionMeta:_motionMeta,ref:ref})},makeAnalyticsAttribute(rest))),!_hideRadioIcon&&jsx(RadioIcon,{size:_size,isChecked:state.isChecked,isDisabled:_isDisabled,isNegative:hasError}),children?jsx(SelectorTitle,{size:_size,isDisabled:_isDisabled,children:children}):null]}),showHelpText&&jsx(BaseBox,{marginLeft:helpTextLeftSpacing,children:jsx(SelectorSupportText,{size:_size,id:ids==null?void 0:ids.helpTextId,children:helpText})})]})})}));};var Radio=assignWithoutSideEffects(React__default.forwardRef(_Radio),{displayName:'Radio'});
|
|
30
30
|
|
|
31
31
|
export { Radio };
|
|
32
32
|
//# sourceMappingURL=Radio.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Radio.js","sources":["../../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/restrict-plus-operands */\n/* eslint-disable @typescript-eslint/no-shadow */\nimport React from 'react';\nimport type { OnChange } from './useRadio';\nimport { useRadio } from './useRadio';\nimport { RadioIcon } from './RadioIcon/RadioIcon';\nimport { useRadioGroupContext } from './RadioGroup/RadioContext';\nimport { radioHoverTokens, radioSizes } from './radioTokens';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorTitle } from '~components/Form/Selector/SelectorTitle';\nimport { SelectorSupportText } from '~components/Form/Selector/SelectorSupportText';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type {\n BladeElementRef,\n DataAnalyticsAttribute,\n StringChildrenType,\n TestID,\n} from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getPlatformType, makeSize, useTheme } from '~utils';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { throwBladeError } from '~utils/logger';\nimport type { MotionMetaProp } from '~components/BaseMotion';\nimport { getInnerMotionRef, getOuterMotionRef } from '~utils/getMotionRefs';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype RadioProps = {\n /**\n * Sets the label text of the Radio\n */\n children?: StringChildrenType;\n /**\n * Help text for the Radio\n */\n helpText?: string;\n /**\n * The value to be used in the Radio input.\n * This is the value that will be returned on form submission.\n */\n value: string;\n /**\n * If `true`, the Radio will be disabled\n *\n * @default false\n */\n isDisabled?: boolean;\n /**\n * Size of the radios\n *\n * @default \"medium\"\n */\n size?: 'small' | 'medium' | 'large';\n} & TestID &\n DataAnalyticsAttribute &\n StyledPropsBlade &\n MotionMetaProp;\n\nconst _Radio: React.ForwardRefRenderFunction<BladeElementRef, RadioProps> = (\n { value, children, helpText, isDisabled, size = 'medium', testID, _motionMeta, ...rest },\n ref,\n) => {\n const { theme } = useTheme();\n const groupProps = useRadioGroupContext();\n const isInsideGroup = !isEmpty(groupProps);\n\n if (__DEV__) {\n if (!isInsideGroup) {\n throwBladeError({\n moduleName: 'Radio',\n message: 'Cannot use <Radio /> outside of <RadioGroup />',\n });\n }\n }\n\n const isChecked = groupProps?.state?.isChecked(value);\n const defaultChecked =\n groupProps?.defaultValue === undefined ? undefined : groupProps?.defaultValue === value;\n const validationState = groupProps?.validationState;\n const hasError = validationState === 'error';\n const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n const _isRequired = groupProps?.isRequired || groupProps?.necessityIndicator === 'required';\n const name = groupProps?.name;\n const showHelpText = helpText;\n const isReactNative = getPlatformType() === 'react-native';\n const _size = groupProps.size ?? size;\n\n const handleChange: OnChange = ({ isChecked, value, event }) => {\n if (isChecked) {\n groupProps?.state?.setValue(value!, event);\n } else {\n groupProps?.state?.removeValue();\n }\n };\n\n const { state, ids, inputProps } = useRadio({\n defaultChecked,\n isChecked,\n hasError,\n isDisabled: _isDisabled,\n isRequired: _isRequired,\n name,\n value,\n onChange: handleChange,\n });\n\n // radio icon's size & margin + margin-left of SelectorTitle which is 2\n const helpTextLeftSpacing = makeSize(radioSizes.icon[size].width + theme.spacing[3]);\n\n return (\n <BaseBox ref={getOuterMotionRef({ _motionMeta, ref })} {...getStyledProps(rest)}>\n <SelectorLabel\n componentName={MetaConstants.RadioLabel}\n inputProps={isReactNative ? inputProps : {}}\n testID={testID}\n >\n <BaseBox display=\"flex\" flexDirection=\"column\">\n <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n <SelectorInput\n hoverTokens={radioHoverTokens}\n isChecked={state.isChecked}\n isDisabled={_isDisabled}\n hasError={hasError}\n inputProps={inputProps}\n ref={getInnerMotionRef({ _motionMeta, ref })}\n {...makeAnalyticsAttribute(rest)}\n />\n <RadioIcon\n size={_size}\n isChecked={state.isChecked}\n isDisabled={_isDisabled}\n isNegative={hasError}\n />\n {children ? (\n <SelectorTitle size={_size} isDisabled={_isDisabled}>\n {children}\n </SelectorTitle>\n ) : null}\n </BaseBox>\n {showHelpText && (\n <BaseBox marginLeft={helpTextLeftSpacing}>\n <SelectorSupportText size={_size} id={ids?.helpTextId}>\n {helpText}\n </SelectorSupportText>\n </BaseBox>\n )}\n </BaseBox>\n </SelectorLabel>\n </BaseBox>\n );\n};\n\nconst Radio = assignWithoutSideEffects(React.forwardRef(_Radio), { displayName: 'Radio' });\n\nexport type { RadioProps };\nexport { Radio };\n"],"names":["_Radio","_ref","ref","_groupProps$state","_groupProps$size","value","children","helpText","isDisabled","_ref$size","size","testID","_motionMeta","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","groupProps","useRadioGroupContext","isInsideGroup","isEmpty","__DEV__","throwBladeError","moduleName","message","isChecked","state","defaultChecked","defaultValue","undefined","validationState","hasError","_isDisabled","_isRequired","isRequired","necessityIndicator","name","showHelpText","isReactNative","getPlatformType","_size","handleChange","_ref2","event","_groupProps$state2","setValue","_groupProps$state3","removeValue","_useRadio","useRadio","onChange","ids","inputProps","helpTextLeftSpacing","makeSize","radioSizes","icon","width","spacing","_jsx","BaseBox","Object","assign","getOuterMotionRef","getStyledProps","SelectorLabel","componentName","MetaConstants","RadioLabel","_jsxs","display","flexDirection","alignItems","SelectorInput","hoverTokens","radioHoverTokens","getInnerMotionRef","makeAnalyticsAttribute","RadioIcon","isNegative","SelectorTitle","marginLeft","SelectorSupportText","id","helpTextId","Radio","assignWithoutSideEffects","React","forwardRef","displayName"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Radio.js","sources":["../../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/restrict-plus-operands */\n/* eslint-disable @typescript-eslint/no-shadow */\nimport React from 'react';\nimport type { OnChange } from './useRadio';\nimport { useRadio } from './useRadio';\nimport { RadioIcon } from './RadioIcon/RadioIcon';\nimport { useRadioGroupContext } from './RadioGroup/RadioContext';\nimport { radioHoverTokens, radioSizes } from './radioTokens';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorTitle } from '~components/Form/Selector/SelectorTitle';\nimport { SelectorSupportText } from '~components/Form/Selector/SelectorSupportText';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type {\n BladeElementRef,\n DataAnalyticsAttribute,\n StringChildrenType,\n TestID,\n} from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getPlatformType, makeSize, useTheme } from '~utils';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { throwBladeError } from '~utils/logger';\nimport type { MotionMetaProp } from '~components/BaseMotion';\nimport { getInnerMotionRef, getOuterMotionRef } from '~utils/getMotionRefs';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype RadioProps = {\n /**\n * Sets the label text of the Radio\n */\n children?: StringChildrenType;\n /**\n * Help text for the Radio\n */\n helpText?: string;\n /**\n * The value to be used in the Radio input.\n * This is the value that will be returned on form submission.\n */\n value: string;\n /**\n * If `true`, the Radio will be disabled\n *\n * @default false\n */\n isDisabled?: boolean;\n /**\n * Size of the radios\n *\n * @default \"medium\"\n */\n size?: 'small' | 'medium' | 'large';\n /**\n * @private\n * Internal prop to hide the radio icon\n * @default false\n */\n _hideRadioIcon?: boolean;\n} & TestID &\n DataAnalyticsAttribute &\n StyledPropsBlade &\n MotionMetaProp;\n\nconst _Radio: React.ForwardRefRenderFunction<BladeElementRef, RadioProps> = (\n {\n value,\n children,\n helpText,\n isDisabled,\n size = 'medium',\n _hideRadioIcon = false,\n testID,\n _motionMeta,\n ...rest\n },\n ref,\n) => {\n const { theme } = useTheme();\n const groupProps = useRadioGroupContext();\n const isInsideGroup = !isEmpty(groupProps);\n\n if (__DEV__) {\n if (!isInsideGroup) {\n throwBladeError({\n moduleName: 'Radio',\n message: 'Cannot use <Radio /> outside of <RadioGroup />',\n });\n }\n }\n\n const isChecked = groupProps?.state?.isChecked(value);\n const defaultChecked =\n groupProps?.defaultValue === undefined ? undefined : groupProps?.defaultValue === value;\n const validationState = groupProps?.validationState;\n const hasError = validationState === 'error';\n const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n const _isRequired = groupProps?.isRequired || groupProps?.necessityIndicator === 'required';\n const name = groupProps?.name;\n const showHelpText = helpText;\n const isReactNative = getPlatformType() === 'react-native';\n const _size = groupProps.size ?? size;\n\n const handleChange: OnChange = ({ isChecked, value, event }) => {\n if (isChecked) {\n groupProps?.state?.setValue(value!, event);\n } else {\n groupProps?.state?.removeValue();\n }\n };\n\n const { state, ids, inputProps } = useRadio({\n defaultChecked,\n isChecked,\n hasError,\n isDisabled: _isDisabled,\n isRequired: _isRequired,\n name,\n value,\n onChange: handleChange,\n });\n\n // radio icon's size & margin + margin-left of SelectorTitle which is 2\n const helpTextLeftSpacing = makeSize(radioSizes.icon[size].width + theme.spacing[3]);\n\n return (\n <BaseBox ref={getOuterMotionRef({ _motionMeta, ref })} {...getStyledProps(rest)}>\n <SelectorLabel\n componentName={MetaConstants.RadioLabel}\n inputProps={isReactNative ? inputProps : {}}\n testID={testID}\n >\n <BaseBox display=\"flex\" flexDirection=\"column\">\n <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n <SelectorInput\n hoverTokens={radioHoverTokens}\n isChecked={state.isChecked}\n isDisabled={_isDisabled}\n hasError={hasError}\n inputProps={inputProps}\n ref={getInnerMotionRef({ _motionMeta, ref })}\n {...makeAnalyticsAttribute(rest)}\n />\n {!_hideRadioIcon && (\n <RadioIcon\n size={_size}\n isChecked={state.isChecked}\n isDisabled={_isDisabled}\n isNegative={hasError}\n />\n )}\n {children ? (\n <SelectorTitle size={_size} isDisabled={_isDisabled}>\n {children}\n </SelectorTitle>\n ) : null}\n </BaseBox>\n {showHelpText && (\n <BaseBox marginLeft={helpTextLeftSpacing}>\n <SelectorSupportText size={_size} id={ids?.helpTextId}>\n {helpText}\n </SelectorSupportText>\n </BaseBox>\n )}\n </BaseBox>\n </SelectorLabel>\n </BaseBox>\n );\n};\n\nconst Radio = assignWithoutSideEffects(React.forwardRef(_Radio), { displayName: 'Radio' });\n\nexport type { RadioProps };\nexport { Radio };\n"],"names":["_Radio","_ref","ref","_groupProps$state","_groupProps$size","value","children","helpText","isDisabled","_ref$size","size","_ref$_hideRadioIcon","_hideRadioIcon","testID","_motionMeta","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","groupProps","useRadioGroupContext","isInsideGroup","isEmpty","__DEV__","throwBladeError","moduleName","message","isChecked","state","defaultChecked","defaultValue","undefined","validationState","hasError","_isDisabled","_isRequired","isRequired","necessityIndicator","name","showHelpText","isReactNative","getPlatformType","_size","handleChange","_ref2","event","_groupProps$state2","setValue","_groupProps$state3","removeValue","_useRadio","useRadio","onChange","ids","inputProps","helpTextLeftSpacing","makeSize","radioSizes","icon","width","spacing","_jsx","BaseBox","Object","assign","getOuterMotionRef","getStyledProps","SelectorLabel","componentName","MetaConstants","RadioLabel","_jsxs","display","flexDirection","alignItems","SelectorInput","hoverTokens","radioHoverTokens","getInnerMotionRef","makeAnalyticsAttribute","RadioIcon","isNegative","SelectorTitle","marginLeft","SelectorSupportText","id","helpTextId","Radio","assignWithoutSideEffects","React","forwardRef","displayName"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
2
|
|
|
3
|
-
var TableContext=React__default.createContext({selectionType:'none',selectedRows:undefined,totalItems:0,toggleRowSelectionById:function toggleRowSelectionById(){},toggleAllRowsSelection:function toggleAllRowsSelection(){},deselectAllRows:function deselectAllRows(){},rowDensity:'normal',toggleSort:function toggleSort(){},currentSortedState:{sortKey:'',isSortReversed:false},setPaginationPage:function setPaginationPage(){},setPaginationRowSize:function setPaginationRowSize(){},disabledRows:[],setDisabledRows:function setDisabledRows(){},paginationType:'client',setPaginationType:function setPaginationType(){},backgroundColor:'surface.background.gray.intense',setHeaderRowDensity:function setHeaderRowDensity(){},showBorderedCells:false,hasHoverActions:false,setHasHoverActions:function setHasHoverActions(){},columnCount:0,gridTemplateColumns:undefined,isVirtualized:false,tableData:[],isGrouped:false});var useTableContext=function useTableContext(){var context=React__default.useContext(TableContext);return context;};
|
|
3
|
+
var TableContext=React__default.createContext({selectionType:'none',selectedRows:undefined,totalItems:0,toggleRowSelectionById:function toggleRowSelectionById(){},toggleAllRowsSelection:function toggleAllRowsSelection(){},deselectAllRows:function deselectAllRows(){},rowDensity:'normal',toggleSort:function toggleSort(){},currentSortedState:{sortKey:'',isSortReversed:false},setPaginationPage:function setPaginationPage(){},setPaginationRowSize:function setPaginationRowSize(){},disabledRows:[],setDisabledRows:function setDisabledRows(){},paginationType:'client',setPaginationType:function setPaginationType(){},backgroundColor:'surface.background.gray.intense',setHeaderRowDensity:function setHeaderRowDensity(){},showBorderedCells:false,hasHoverActions:false,setHasHoverActions:function setHasHoverActions(){},columnCount:0,gridTemplateColumns:undefined,isVirtualized:false,tableData:[],isGrouped:false,tableToolbarPlacement:'inline'});var useTableContext=function useTableContext(){var context=React__default.useContext(TableContext);return context;};
|
|
4
4
|
|
|
5
5
|
export { TableContext, useTableContext };
|
|
6
6
|
//# sourceMappingURL=TableContext.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableContext.js","sources":["../../../../../src/components/Table/TableContext.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-empty-function */\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nimport React from 'react';\nimport type { TableNode } from '@table-library/react-table-library/table';\nimport type {\n TableBackgroundColors,\n TableProps,\n TablePaginationType,\n TableHeaderRowProps,\n TableNode as LocalTableNode,\n} from './types';\n\nexport type TableContextType<Item> = {\n selectionType?: TableProps<unknown>['selectionType'];\n selectedRows?: TableNode['id'][];\n totalItems: number;\n toggleRowSelectionById: (id: TableNode['id']) => void;\n toggleAllRowsSelection: () => void;\n deselectAllRows: () => void;\n rowDensity: NonNullable<TableProps<unknown>['rowDensity']>;\n toggleSort: (sortKey: string) => void;\n currentSortedState: {\n sortKey: string;\n isSortReversed: boolean;\n sortableColumns?: string[];\n };\n setPaginationPage: (page: number) => void;\n setPaginationRowSize: (size: number) => void;\n currentPaginationState?: {\n page: number;\n size: number;\n };\n showStripedRows?: boolean;\n disabledRows: TableNode['id'][];\n setDisabledRows: React.Dispatch<React.SetStateAction<TableNode['id'][]>>;\n paginationType: NonNullable<TablePaginationType>;\n setPaginationType: React.Dispatch<React.SetStateAction<NonNullable<TablePaginationType>>>;\n backgroundColor: TableBackgroundColors | 'transparent';\n headerRowDensity?: TableHeaderRowProps['rowDensity'];\n setHeaderRowDensity: React.Dispatch<React.SetStateAction<TableHeaderRowProps['rowDensity']>>;\n showBorderedCells: NonNullable<TableProps<unknown>['showBorderedCells']>;\n hasHoverActions: boolean;\n setHasHoverActions: (hasHoverActions: boolean) => void;\n columnCount: number;\n gridTemplateColumns: string | undefined;\n isVirtualized?: boolean;\n tableData: LocalTableNode<Item>[];\n isGrouped: boolean;\n};\n\nconst TableContext = React.createContext<TableContextType<unknown>>({\n selectionType: 'none',\n selectedRows: undefined,\n totalItems: 0,\n toggleRowSelectionById: () => {},\n toggleAllRowsSelection: () => {},\n deselectAllRows: () => {},\n rowDensity: 'normal',\n toggleSort: () => {},\n currentSortedState: {\n sortKey: '',\n isSortReversed: false,\n },\n setPaginationPage: () => {},\n setPaginationRowSize: () => {},\n disabledRows: [],\n setDisabledRows: () => {},\n paginationType: 'client',\n setPaginationType: () => {},\n backgroundColor: 'surface.background.gray.intense',\n setHeaderRowDensity: () => {},\n showBorderedCells: false,\n hasHoverActions: false,\n setHasHoverActions: () => {},\n columnCount: 0,\n gridTemplateColumns: undefined,\n isVirtualized: false,\n tableData: [],\n isGrouped: false,\n});\n\nconst useTableContext = <Item,>(): TableContextType<Item> => {\n const context = React.useContext(TableContext as React.Context<TableContextType<Item>>);\n return context;\n};\n\nexport { useTableContext, TableContext };\n"],"names":["TableContext","React","createContext","selectionType","selectedRows","undefined","totalItems","toggleRowSelectionById","toggleAllRowsSelection","deselectAllRows","rowDensity","toggleSort","currentSortedState","sortKey","isSortReversed","setPaginationPage","setPaginationRowSize","disabledRows","setDisabledRows","paginationType","setPaginationType","backgroundColor","setHeaderRowDensity","showBorderedCells","hasHoverActions","setHasHoverActions","columnCount","gridTemplateColumns","isVirtualized","tableData","isGrouped","useTableContext","context","useContext"],"mappings":";;
|
|
1
|
+
{"version":3,"file":"TableContext.js","sources":["../../../../../src/components/Table/TableContext.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-empty-function */\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nimport React from 'react';\nimport type { TableNode } from '@table-library/react-table-library/table';\nimport type {\n TableBackgroundColors,\n TableProps,\n TablePaginationType,\n TableHeaderRowProps,\n TableNode as LocalTableNode,\n TableToolbarPlacement,\n} from './types';\n\nexport type TableContextType<Item> = {\n selectionType?: TableProps<unknown>['selectionType'];\n selectedRows?: TableNode['id'][];\n totalItems: number;\n toggleRowSelectionById: (id: TableNode['id']) => void;\n toggleAllRowsSelection: () => void;\n deselectAllRows: () => void;\n rowDensity: NonNullable<TableProps<unknown>['rowDensity']>;\n toggleSort: (sortKey: string) => void;\n currentSortedState: {\n sortKey: string;\n isSortReversed: boolean;\n sortableColumns?: string[];\n };\n setPaginationPage: (page: number) => void;\n setPaginationRowSize: (size: number) => void;\n currentPaginationState?: {\n page: number;\n size: number;\n };\n showStripedRows?: boolean;\n disabledRows: TableNode['id'][];\n setDisabledRows: React.Dispatch<React.SetStateAction<TableNode['id'][]>>;\n paginationType: NonNullable<TablePaginationType>;\n setPaginationType: React.Dispatch<React.SetStateAction<NonNullable<TablePaginationType>>>;\n backgroundColor: TableBackgroundColors | 'transparent';\n headerRowDensity?: TableHeaderRowProps['rowDensity'];\n setHeaderRowDensity: React.Dispatch<React.SetStateAction<TableHeaderRowProps['rowDensity']>>;\n showBorderedCells: NonNullable<TableProps<unknown>['showBorderedCells']>;\n hasHoverActions: boolean;\n setHasHoverActions: (hasHoverActions: boolean) => void;\n columnCount: number;\n gridTemplateColumns: string | undefined;\n isVirtualized?: boolean;\n tableData: LocalTableNode<Item>[];\n isGrouped: boolean;\n tableToolbarPlacement: TableToolbarPlacement;\n};\n\nconst TableContext = React.createContext<TableContextType<unknown>>({\n selectionType: 'none',\n selectedRows: undefined,\n totalItems: 0,\n toggleRowSelectionById: () => {},\n toggleAllRowsSelection: () => {},\n deselectAllRows: () => {},\n rowDensity: 'normal',\n toggleSort: () => {},\n currentSortedState: {\n sortKey: '',\n isSortReversed: false,\n },\n setPaginationPage: () => {},\n setPaginationRowSize: () => {},\n disabledRows: [],\n setDisabledRows: () => {},\n paginationType: 'client',\n setPaginationType: () => {},\n backgroundColor: 'surface.background.gray.intense',\n setHeaderRowDensity: () => {},\n showBorderedCells: false,\n hasHoverActions: false,\n setHasHoverActions: () => {},\n columnCount: 0,\n gridTemplateColumns: undefined,\n isVirtualized: false,\n tableData: [],\n isGrouped: false,\n tableToolbarPlacement: 'inline',\n});\n\nconst useTableContext = <Item,>(): TableContextType<Item> => {\n const context = React.useContext(TableContext as React.Context<TableContextType<Item>>);\n return context;\n};\n\nexport { useTableContext, TableContext };\n"],"names":["TableContext","React","createContext","selectionType","selectedRows","undefined","totalItems","toggleRowSelectionById","toggleAllRowsSelection","deselectAllRows","rowDensity","toggleSort","currentSortedState","sortKey","isSortReversed","setPaginationPage","setPaginationRowSize","disabledRows","setDisabledRows","paginationType","setPaginationType","backgroundColor","setHeaderRowDensity","showBorderedCells","hasHoverActions","setHasHoverActions","columnCount","gridTemplateColumns","isVirtualized","tableData","isGrouped","tableToolbarPlacement","useTableContext","context","useContext"],"mappings":";;AAoDM,IAAAA,YAAY,CAAGC,cAAK,CAACC,aAAa,CAA4B,CAClEC,aAAa,CAAE,MAAM,CACrBC,YAAY,CAAEC,SAAS,CACvBC,UAAU,CAAE,CAAC,CACbC,sBAAsB,CAAE,SAAAA,wBAAM,EAAE,CAChCC,sBAAsB,CAAE,SAAAA,sBAAAA,EAAM,EAAE,CAChCC,eAAe,CAAE,SAAAA,eAAAA,EAAM,EAAE,CACzBC,UAAU,CAAE,QAAQ,CACpBC,UAAU,CAAE,SAAAA,YAAM,EAAE,CACpBC,kBAAkB,CAAE,CAClBC,OAAO,CAAE,EAAE,CACXC,cAAc,CAAE,KAClB,CAAC,CACDC,iBAAiB,CAAE,SAAAA,iBAAA,EAAM,EAAE,CAC3BC,oBAAoB,CAAE,SAAAA,oBAAAA,EAAM,EAAE,CAC9BC,YAAY,CAAE,EAAE,CAChBC,eAAe,CAAE,SAAAA,eAAA,EAAM,EAAE,CACzBC,cAAc,CAAE,QAAQ,CACxBC,iBAAiB,CAAE,SAAAA,iBAAA,EAAM,EAAE,CAC3BC,eAAe,CAAE,iCAAiC,CAClDC,mBAAmB,CAAE,SAAAA,mBAAAA,EAAM,EAAE,CAC7BC,iBAAiB,CAAE,KAAK,CACxBC,eAAe,CAAE,KAAK,CACtBC,kBAAkB,CAAE,SAAAA,kBAAA,EAAM,EAAE,CAC5BC,WAAW,CAAE,CAAC,CACdC,mBAAmB,CAAEtB,SAAS,CAC9BuB,aAAa,CAAE,KAAK,CACpBC,SAAS,CAAE,EAAE,CACbC,SAAS,CAAE,KAAK,CAChBC,qBAAqB,CAAE,QACzB,CAAC,EAEK,IAAAC,eAAe,CAAG,SAAlBA,eAAeA,EAAwC,CAC3D,IAAMC,OAAO,CAAGhC,cAAK,CAACiC,UAAU,CAAClC,YAAqD,CAAC,CACvF,OAAOiC,OAAO,CAChB;;;;"}
|
|
@@ -440,7 +440,7 @@ import '../Icons/ZoomOutIcon/ZoomOutIcon.js';
|
|
|
440
440
|
import '../../tokens/global/typography.js';
|
|
441
441
|
import '../../tokens/global/motion.js';
|
|
442
442
|
|
|
443
|
-
var tableEditableCellRowDensityToInputSizeMap={compact:'
|
|
443
|
+
var tableEditableCellRowDensityToInputSizeMap={compact:'small',normal:'medium',comfortable:'large'};var validationStateToInputTrailingIconMap={none:undefined,success:CheckIcon,error:AlertCircleIcon};var rowDensityToIsTableInputCellMapping={comfortable:false,normal:true,compact:true};
|
|
444
444
|
|
|
445
445
|
export { rowDensityToIsTableInputCellMapping, tableEditableCellRowDensityToInputSizeMap, validationStateToInputTrailingIconMap };
|
|
446
446
|
//# sourceMappingURL=tokens.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tokens.js","sources":["../../../../../src/components/Table/tokens.ts"],"sourcesContent":["import { AlertCircleIcon, CheckIcon } from '~components/Icons';\nimport { size } from '~tokens/global';\n\nconst firstColumnStickyZIndex = 2;\n\nconst refreshWrapperZIndex = 3;\n\nconst checkboxCellWidth = size['44'];\n\nconst tableBackgroundColor = 'surface.background.gray.intense';\nconst tableHeader = {\n paddingTop: 'spacing.5',\n paddingBottom: 'spacing.5',\n paddingLeft: 'spacing.4',\n paddingRight: 'spacing.4',\n backgroundColor: 'interactive.background.gray.
|
|
1
|
+
{"version":3,"file":"tokens.js","sources":["../../../../../src/components/Table/tokens.ts"],"sourcesContent":["import { AlertCircleIcon, CheckIcon } from '~components/Icons';\nimport { size } from '~tokens/global';\n\nconst firstColumnStickyZIndex = 2;\n\nconst refreshWrapperZIndex = 3;\n\nconst checkboxCellWidth = size['44'];\n\nconst tableBackgroundColor = 'surface.background.gray.intense';\nconst tableHeader = {\n paddingTop: 'spacing.5',\n paddingBottom: 'spacing.5',\n paddingLeft: 'spacing.4',\n paddingRight: 'spacing.4',\n backgroundColor: 'interactive.background.gray.faded',\n borderBottomAndTopWidth: 'thin',\n borderBottomAndTopColor: 'surface.border.gray.muted',\n} as const;\n\nconst tableFooter = {\n paddingTop: 'spacing.5',\n paddingBottom: 'spacing.5',\n paddingLeft: 'spacing.4',\n paddingRight: 'spacing.4',\n borderBottomAndTopWidth: 'thin',\n borderBottomAndTopColor: 'surface.border.gray.muted',\n backgroundColor: 'interactive.background.gray.faded',\n} as const;\n\nconst tableRow = {\n paddingLeft: {\n compact: 'spacing.4',\n normal: 'spacing.4',\n comfortable: 'spacing.4',\n },\n paddingRight: {\n compact: 'spacing.4',\n normal: 'spacing.4',\n comfortable: 'spacing.4',\n },\n minHeight: {\n compact: '36',\n normal: '48',\n comfortable: '60',\n },\n nonStripe: {\n backgroundColor: 'transparent',\n backgroundColorHover: 'interactive.background.gray.default',\n backgroundColorFocus: 'transparent',\n // TODO: Rebranding - on design side: explore pressed state color change, right now both hover & active are same\n backgroundColorActive: 'interactive.background.gray.default',\n backgroundColorSelected: 'interactive.background.primary.faded',\n backgroundColorSelectedHover: 'interactive.background.primary.fadedHighlighted',\n backgroundColorSelectedFocus: 'interactive.background.primary.faded',\n backgroundColorSelectedActive: 'interactive.background.primary.fadedHighlighted',\n },\n nonStripeWrapper: {\n // not used anywhere\n backgroundColor: 'transparent',\n backgroundColorHover: 'transparent',\n backgroundColorFocus: 'transparent',\n backgroundColorActive: 'interactive.background.gray.default',\n backgroundColorSelected: 'transparent',\n backgroundColorSelectedHover: 'transparent',\n backgroundColorSelectedFocus: 'transparent',\n backgroundColorSelectedActive: 'transparent',\n },\n stripe: {\n backgroundColor: 'transparent',\n backgroundColorHover: 'interactive.background.gray.default',\n backgroundColorFocus: 'transparent',\n backgroundColorActive: 'interactive.background.gray.default',\n backgroundColorSelected: 'interactive.background.primary.faded',\n backgroundColorSelectedHover: 'interactive.background.primary.fadedHighlighted',\n backgroundColorSelectedFocus: 'interactive.background.primary.faded',\n backgroundColorSelectedActive: 'interactive.background.primary.fadedHighlighted',\n },\n stripeWrapper: {\n backgroundColor: 'interactive.background.gray.default',\n backgroundColorHover: 'interactive.background.gray.default',\n backgroundColorFocus: 'interactive.background.gray.default',\n backgroundColorActive: 'interactive.background.gray.default',\n backgroundColorSelected: 'interactive.background.primary.faded',\n backgroundColorSelectedHover: 'interactive.background.primary.faded',\n backgroundColorSelectedFocus: 'interactive.background.primary.faded',\n backgroundColorSelectedActive: 'interactive.background.primary.faded',\n },\n borderBottomWidth: 'thin',\n borderColor: 'surface.border.gray.muted',\n backgroundColorMotionEasing: 'easing.standard',\n backgroundColorMotionDuration: 'duration.xquick',\n groupHeaderBackgroundColor: 'surface.background.gray.moderate',\n} as const;\n\nconst tableToolbar = {\n backgroundColor: 'interactive.background.gray.faded',\n backgroundColorSelected: 'interactive.background.primary.faded',\n backgroundColorMotionEasing: 'easing.standard',\n backgroundColorMotionDuration: 'duration.xquick',\n minHeight: size[37], // 37px to accommodate 1px border, matching TableHeader height\n padding: ['spacing.3', 'spacing.4'],\n} as const;\n\nconst tablePagination = {\n padding: ['6px', 'spacing.3'],\n pageSelectionButton: {\n backgroundColor: 'transparent',\n backgroundColorHover: 'interactive.background.gray.default',\n backgroundColorActive: 'interactive.background.gray.highlighted',\n backgroundColorSelected: 'interactive.background.primary.faded',\n backgroundColorSelectedHover: 'interactive.background.primary.fadedHighlighted',\n backgroundColorSelectedActive: 'interactive.background.primary.fadedHighlighted',\n padding: 'spacing.2',\n borderRadius: 'small',\n focusRingColor: 'surface.border.primary.muted',\n textColor: 'surface.text.gray.subtle',\n textColorSelected: 'surface.text.primary.normal',\n height: size['32'],\n width: size['32'],\n },\n defaultPageSize: 10,\n} as const;\n\nconst tableEditableCellRowDensityToInputSizeMap = {\n compact: 'small',\n normal: 'medium',\n comfortable: 'large',\n} as const;\n\nconst validationStateToInputTrailingIconMap = {\n none: undefined,\n success: CheckIcon,\n error: AlertCircleIcon,\n};\n\nconst rowDensityToIsTableInputCellMapping = {\n comfortable: false,\n normal: true,\n compact: true,\n};\n\nconst classes = {\n HOVER_ACTIONS: 'hover-actions',\n HOVER_ACTIONS_LAYER2: 'hover-actions-layer-2',\n HOVER_ACTIONS_LAYER3: 'hover-actions-layer-3',\n HAS_ROW_SPANNING: 'has-row-spanning',\n};\n\nexport {\n tableHeader,\n tableFooter,\n tableRow,\n tableToolbar,\n tablePagination,\n refreshWrapperZIndex,\n tableBackgroundColor,\n firstColumnStickyZIndex,\n checkboxCellWidth,\n tableEditableCellRowDensityToInputSizeMap,\n validationStateToInputTrailingIconMap,\n rowDensityToIsTableInputCellMapping,\n classes,\n};\n"],"names":["tableEditableCellRowDensityToInputSizeMap","compact","normal","comfortable","validationStateToInputTrailingIconMap","none","undefined","success","CheckIcon","error","AlertCircleIcon","rowDensityToIsTableInputCellMapping"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4HM,IAAAA,yCAAyC,CAAG,CAChDC,OAAO,CAAE,OAAO,CAChBC,MAAM,CAAE,QAAQ,CAChBC,WAAW,CAAE,OACf,EAEM,IAAAC,qCAAqC,CAAG,CAC5CC,IAAI,CAAEC,SAAS,CACfC,OAAO,CAAEC,SAAS,CAClBC,KAAK,CAAEC,eACT,EAEM,IAAAC,mCAAmC,CAAG,CAC1CR,WAAW,CAAE,KAAK,CAClBD,MAAM,CAAE,IAAI,CACZD,OAAO,CAAE,IACX;;;;"}
|
|
@@ -35,6 +35,8 @@ export { ChartArea, ChartAreaWrapper } from './Charts/AreaChart/AreaChart.native
|
|
|
35
35
|
export { ChartDonut, ChartDonutCell, ChartDonutWrapper } from './Charts/DonutChart/DonutChart.native.js';
|
|
36
36
|
export { ChartBar, ChartBarWrapper } from './Charts/BarChart/BarChart.native.js';
|
|
37
37
|
export { ChartCartesianGrid, ChartLegend, ChartReferenceLine, ChartTooltip, ChartXAxis, ChartYAxis } from './Charts/CommonChartComponents/CommonChartComponents.native.js';
|
|
38
|
+
export { CommonChartComponentsContext, useCommonChartComponentsContext } from './Charts/CommonChartComponents/CommonChartComponentsContext.js';
|
|
39
|
+
export { DEFAULT_COLOR } from './Charts/CommonChartComponents/tokens.js';
|
|
38
40
|
export { Chip } from './Chip/Chip.js';
|
|
39
41
|
export { ChipGroup } from './Chip/ChipGroup.js';
|
|
40
42
|
export { Collapsible } from './Collapsible/Collapsible.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { opacity } from './opacity.js';
|
|
2
2
|
|
|
3
|
-
var colors={chromatic:{azure:{50:`hsla(222, 100%, 98%, ${opacity[1200]})`,100:`hsla(221, 90%, 92%, ${opacity[1200]})`,200:`hsla(219, 95%, 85%, ${opacity[1200]})`,300:`hsla(220, 100%, 73%, ${opacity[1200]})`,400:`hsla(223, 100%, 65%, ${opacity[1200]})`,500:`hsla(227, 100%, 59%, ${opacity[1200]})`,600:`hsla(227, 71%, 51%, ${opacity[1200]})`,700:`hsla(227, 69%, 42%, ${opacity[1200]})`,800:`hsla(227, 69%, 34%, ${opacity[1200]})`,900:`hsla(227, 69%, 25%, ${opacity[1200]})`,1000:`hsla(227, 69%, 17%, ${opacity[1200]})`,a50:`hsla(227, 100%, 59%, ${opacity[100]})`,a100:`hsla(227, 100%, 59%, ${opacity[300]})`,a150:`hsla(227, 100%, 59%, ${opacity[400]})`,a200:`hsla(227, 100%, 59%, ${opacity[500]})`,a400:`hsla(227, 100%, 59%, ${opacity[800]})`},emerald:{50:`hsla(152, 60%, 95%, ${opacity[1200]})`,100:`hsla(151, 57%, 91%, ${opacity[1200]})`,200:`hsla(150, 59%, 82%, ${opacity[1200]})`,300:`hsla(150, 59%, 73%, ${opacity[1200]})`,400:`hsla(150, 59%, 55%, ${opacity[1200]})`,500:`hsla(150, 100%, 37%, ${opacity[1200]})`,600:`hsla(150, 100%, 32%, ${opacity[1200]})`,700:`hsla(150, 100%, 27%, ${opacity[1200]})`,800:`hsla(150, 100%, 21%, ${opacity[1200]})`,900:`hsla(150, 100%, 16%, ${opacity[1200]})`,1000:`hsla(150, 100%, 11%, ${opacity[1200]})`,a50:`hsla(150, 100%, 32%, ${opacity[100]})`,a100:`hsla(150, 100%, 32%, ${opacity[300]})`,a150:`hsla(150, 100%, 32%, ${opacity[400]})`,a200:`hsla(150, 100%, 32%, ${opacity[500]})`,a400:`hsla(150, 100%, 32%, ${opacity[800]})`},crimson:{50:`hsla(0, 100%, 98%, ${opacity[1200]})`,100:`hsla(4, 93%, 94%, ${opacity[1200]})`,200:`hsla(3, 97%, 88%, ${opacity[1200]})`,300:`hsla(4, 96%, 79%, ${opacity[1200]})`,400:`hsla(4, 93%, 68%, ${opacity[1200]})`,500:`hsla(4, 86%, 58%, ${opacity[1200]})`,600:`hsla(4, 74%, 49%, ${opacity[1200]})`,700:`hsla(4, 77%, 40%, ${opacity[1200]})`,800:`hsla(0, 83%, 33%, ${opacity[1200]})`,900:`hsla(0, 84%, 29%, ${opacity[1200]})`,1000:`hsla(0, 84%, 25%, ${opacity[1200]})`,a50:`hsla(4, 74%, 49%, ${opacity[100]})`,a100:`hsla(4, 74%, 49%, ${opacity[300]})`,a150:`hsla(4, 74%, 49%, ${opacity[400]})`,a200:`hsla(4, 74%, 49%, ${opacity[500]})`,a400:`hsla(4, 74%, 49%, ${opacity[800]})`},cider:{50:`hsla(24, 100%, 96%, ${opacity[1200]})`,100:`hsla(25, 100%, 90%, ${opacity[1200]})`,200:`hsla(25, 100%, 80%, ${opacity[1200]})`,300:`hsla(25, 100%, 72%, ${opacity[1200]})`,400:`hsla(25, 100%, 63%, ${opacity[1200]})`,500:`hsla(25, 100%, 55%, ${opacity[1200]})`,600:`hsla(25, 90%, 48%, ${opacity[1200]})`,700:`hsla(25, 85%, 42%, ${opacity[1200]})`,800:`hsla(25, 82%, 35%, ${opacity[1200]})`,900:`hsla(25, 80%, 28%, ${opacity[1200]})`,1000:`hsla(25, 82%, 20%, ${opacity[1200]})`,a50:`hsla(25, 90%, 48%, ${opacity[100]})`,a100:`hsla(25, 90%, 48%, ${opacity[300]})`,a150:`hsla(25, 90%, 48%, ${opacity[400]})`,a200:`hsla(25, 90%, 48%, ${opacity[500]})`,a400:`hsla(25, 90%, 48%, ${opacity[800]})`},sapphire:{50:`hsla(201, 92%, 95%, ${opacity[1200]})`,100:`hsla(200, 88%, 90%, ${opacity[1200]})`,200:`hsla(200, 89%, 82%, ${opacity[1200]})`,300:`hsla(200, 90%, 72%, ${opacity[1200]})`,400:`hsla(200, 90%, 65%, ${opacity[1200]})`,500:`hsla(198, 90%, 52%, ${opacity[1200]})`,600:`hsla(200, 84%, 44%, ${opacity[1200]})`,700:`hsla(200, 84%, 37%, ${opacity[1200]})`,800:`hsla(200, 84%, 29%, ${opacity[1200]})`,900:`hsla(200, 84%, 22%, ${opacity[1200]})`,1000:`hsla(199, 84%, 15%, ${opacity[1200]})`,a50:`hsla(200, 84%, 44%, ${opacity[100]})`,a100:`hsla(200, 84%, 44%, ${opacity[300]})`,a150:`hsla(200, 84%, 44%, ${opacity[400]})`,a200:`hsla(200, 84%, 44%, ${opacity[500]})`,a400:`hsla(200, 84%, 44%, ${opacity[800]})`},sea:{50:`hsla(180, 39%, 95%, ${opacity[1200]})`,100:`hsla(180, 42%, 92%, ${opacity[1200]})`,200:`hsla(180, 33%, 82%, ${opacity[1200]})`,300:`hsla(180, 35%, 70%, ${opacity[1200]})`,400:`hsla(180, 30%, 52%, ${opacity[1200]})`,500:`hsla(180, 45%, 40%, ${opacity[1200]})`,600:`hsla(180, 60%, 30%, ${opacity[1200]})`,700:`hsla(180, 55%, 25%, ${opacity[1200]})`,800:`hsla(180, 61%, 20%, ${opacity[1200]})`,900:`hsla(180, 91%, 13%, ${opacity[1200]})`,1000:`hsla(180, 91%, 8%, ${opacity[1200]})`,a50:`hsla(180, 60%, 30%, ${opacity[100]})`,a100:`hsla(180, 60%, 30%, ${opacity[300]})`,a150:`hsla(180, 60%, 30%, ${opacity[400]})`,a200:`hsla(180, 60%, 30%, ${opacity[500]})`,a400:`hsla(180, 60%, 30%, ${opacity[800]})`},cloud:{50:`hsla(198, 39%, 95%, ${opacity[1200]})`,100:`hsla(201, 39%, 93%, ${opacity[1200]})`,200:`hsla(200, 35%, 85%, ${opacity[1200]})`,300:`hsla(200, 35%, 70%, ${opacity[1200]})`,400:`hsla(200, 30%, 52%, ${opacity[1200]})`,500:`hsla(200, 45%, 40%, ${opacity[1200]})`,600:`hsla(200, 60%, 30%, ${opacity[1200]})`,700:`hsla(201, 55%, 25%, ${opacity[1200]})`,800:`hsla(200, 61%, 20%, ${opacity[1200]})`,900:`hsla(200, 91%, 13%, ${opacity[1200]})`,1000:`hsla(200, 91%, 8%, ${opacity[1200]})`,a50:`hsla(200, 60%, 30%, ${opacity[100]})`,a100:`hsla(200, 60%, 30%, ${opacity[300]})`,a150:`hsla(200, 60%, 30%, ${opacity[400]})`,a200:`hsla(200, 60%, 30%, ${opacity[500]})`,a400:`hsla(200, 60%, 30%, ${opacity[800]})`},forest:{50:`hsla(152, 60%, 95%, ${opacity[1200]})`,100:`hsla(151, 57%, 91%, ${opacity[1200]})`,200:`hsla(150, 59%, 82%, ${opacity[1200]})`,300:`hsla(150, 59%, 73%, ${opacity[1200]})`,400:`hsla(150, 59%, 55%, ${opacity[1200]})`,500:`hsla(155, 100%, 37%, ${opacity[1200]})`,600:`hsla(155, 100%, 31%, ${opacity[1200]})`,700:`hsla(155, 100%, 27%, ${opacity[1200]})`,800:`hsla(155, 100%, 21%, ${opacity[1200]})`,900:`hsla(155, 100%, 16%, ${opacity[1200]})`,1000:`hsla(155, 100%, 11%, ${opacity[1200]})`,a50:`hsla(155, 100%, 31%, ${opacity[100]})`,a100:`hsla(155, 100%, 31%, ${opacity[300]})`,a150:`hsla(155, 100%, 31%, ${opacity[400]})`,a200:`hsla(155, 100%, 31%, ${opacity[500]})`,a400:`hsla(155, 100%, 31%, ${opacity[800]})`},orchid:{50:`hsla(249, 100%, 98%, ${opacity[1200]})`,100:`hsla(252, 100%, 95%, ${opacity[1200]})`,200:`hsla(252, 100%, 88%, ${opacity[1200]})`,300:`hsla(252, 100%, 80%, ${opacity[1200]})`,400:`hsla(252, 100%, 74%, ${opacity[1200]})`,500:`hsla(252, 100%, 67%, ${opacity[1200]})`,600:`hsla(252, 57%, 54%, ${opacity[1200]})`,700:`hsla(251, 49%, 41%, ${opacity[1200]})`,800:`hsla(251, 49%, 32%, ${opacity[1200]})`,900:`hsla(252, 50%, 24%, ${opacity[1200]})`,1000:`hsla(252, 50%, 17%, ${opacity[1200]})`,a50:`hsla(252, 100%, 67%, ${opacity[100]})`,a100:`hsla(252, 100%, 67%, ${opacity[300]})`,a150:`hsla(252, 100%, 67%, ${opacity[400]})`,a200:`hsla(252, 100%, 67%, ${opacity[500]})`,a400:`hsla(252, 100%, 67%, ${opacity[800]})`},magenta:{50:`hsla(330, 78%, 97%, ${opacity[1200]})`,100:`hsla(331, 83%, 93%, ${opacity[1200]})`,200:`hsla(330, 83%, 84%, ${opacity[1200]})`,300:`hsla(331, 82%, 74%, ${opacity[1200]})`,400:`hsla(331, 82%, 65%, ${opacity[1200]})`,500:`hsla(331, 82%, 56%, ${opacity[1200]})`,600:`hsla(331, 64%, 45%, ${opacity[1200]})`,700:`hsla(331, 64%, 34%, ${opacity[1200]})`,800:`hsla(331, 65%, 27%, ${opacity[1200]})`,900:`hsla(331, 65%, 21%, ${opacity[1200]})`,1000:`hsla(331, 65%, 15%, ${opacity[1200]})`,a50:`hsla(331, 82%, 56%, ${opacity[100]})`,a100:`hsla(331, 82%, 56%, ${opacity[300]})`,a150:`hsla(331, 82%, 56%, ${opacity[400]})`,a200:`hsla(331, 82%, 56%, ${opacity[500]})`,a400:`hsla(331, 82%, 56%, ${opacity[800]})`},topaz:{50:`hsla(51, 100%, 92%, ${opacity[1200]})`,100:`hsla(51, 100%, 80%, ${opacity[1200]})`,200:`hsla(51, 100%, 68%, ${opacity[1200]})`,300:`hsla(51, 100%, 60%, ${opacity[1200]})`,400:`hsla(51, 100%, 50%, ${opacity[1200]})`,500:`hsla(50, 100%, 46%, ${opacity[1200]})`,600:`hsla(50, 100%, 40%, ${opacity[1200]})`,700:`hsla(50, 100%, 32%, ${opacity[1200]})`,800:`hsla(50, 100%, 28%, ${opacity[1200]})`,900:`hsla(50, 100%, 24%, ${opacity[1200]})`,1000:`hsla(50, 97%, 19%, ${opacity[1200]})`,a50:`hsla(50, 100%, 46%, ${opacity[100]})`,a100:`hsla(50, 100%, 46%, ${opacity[300]})`,a150:`hsla(50, 100%, 46%, ${opacity[400]})`,a200:`hsla(50, 100%, 46%, ${opacity[500]})`,a400:`hsla(50, 100%, 46%, ${opacity[800]})`}},neutral:{blueGrayLight:{0:`hsla(0, 0%, 100%, ${opacity[1200]})`,50:`hsla(210, 40%, 98%, ${opacity[1200]})`,100:`hsla(213, 47%, 96%, ${opacity[1200]})`,200:`hsla(214, 40%, 92%, ${opacity[1200]})`,300:`hsla(214, 28%, 84%, ${opacity[1200]})`,400:`hsla(211, 27%, 76%, ${opacity[1200]})`,500:`hsla(211, 24%, 65%, ${opacity[1200]})`,600:`hsla(211, 22%, 56%, ${opacity[1200]})`,700:`hsla(211, 20%, 52%, ${opacity[1200]})`,800:`hsla(211, 23%, 45%, ${opacity[1200]})`,900:`hsla(211, 26%, 34%, ${opacity[1200]})`,1000:`hsla(211, 29%, 26%, ${opacity[1200]})`,1100:`hsla(211, 33%, 21%, ${opacity[1200]})`,1200:`hsla(212, 39%, 16%, ${opacity[1200]})`,1300:`hsla(211, 53%, 10%, ${opacity[1200]})`,a25:`hsla(211, 20%, 52%, ${opacity[50]})`,a50:`hsla(211, 20%, 52%, ${opacity[100]})`,a75:`hsla(211, 20%, 52%, ${opacity[200]})`,a100:`hsla(211, 20%, 52%, ${opacity[300]})`,a200:`hsla(211, 20%, 52%, ${opacity[500]})`,a400:`hsla(211, 20%, 52%, ${opacity[800]})`},blueGrayDark:{0:`hsla(240, 20%, 99%, ${opacity[1200]})`,50:`hsla(220, 22%, 92%, ${opacity[1200]})`,100:`hsla(214, 20%, 84%, ${opacity[1200]})`,200:`hsla(214, 17%, 76%, ${opacity[1200]})`,300:`hsla(216, 18%, 62%, ${opacity[1200]})`,400:`hsla(215, 20%, 43%, ${opacity[1200]})`,500:`hsla(216, 22%, 36%, ${opacity[1200]})`,600:`hsla(216, 24%, 31%, ${opacity[1200]})`,700:`hsla(216, 27%, 24%, ${opacity[1200]})`,800:`hsla(217, 27%, 21%, ${opacity[1200]})`,900:`hsla(218, 26%, 18%, ${opacity[1200]})`,1000:`hsla(217, 27%, 15%, ${opacity[1200]})`,1100:`hsla(216, 30%, 13%, ${opacity[1200]})`,1200:`hsla(215, 37%, 10%, ${opacity[1200]})`,1300:`hsla(214, 44%, 7%, ${opacity[1200]})`,a25:`hsla(214, 20%, 84%, ${opacity[50]})`,a50:`hsla(214, 20%, 84%, ${opacity[100]})`,a75:`hsla(214, 20%, 84%, ${opacity[200]})`,a100:`hsla(214, 20%, 84%, ${opacity[300]})`,a200:`hsla(214, 20%, 84%, ${opacity[500]})`,a400:`hsla(214, 20%, 84%, ${opacity[800]})`},ashGrayLight:{0:`hsla(0, 0%, 100%, ${opacity[1200]})`,50:`hsla(240, 9%, 98%, ${opacity[1200]})`,100:`hsla(210, 9%, 96%, ${opacity[1200]})`,200:`hsla(210, 6%, 94%, ${opacity[1200]})`,300:`hsla(210, 4%, 89%, ${opacity[1200]})`,400:`hsla(214, 7%, 81%, ${opacity[1200]})`,500:`hsla(216, 6%, 69%, ${opacity[1200]})`,600:`hsla(215, 6%, 60%, ${opacity[1200]})`,700:`hsla(214, 6%, 55%, ${opacity[1200]})`,800:`hsla(216, 7%, 45%, ${opacity[1200]})`,900:`hsla(218, 9%, 36%, ${opacity[1200]})`,1000:`hsla(219, 12%, 28%, ${opacity[1200]})`,1100:`hsla(214, 15%, 18%, ${opacity[1200]})`,1200:`hsla(216, 15%, 13%, ${opacity[1200]})`,1300:`hsla(214, 24%, 6%, ${opacity[1200]})`,a25:`hsla(214, 6%, 55%, ${opacity[50]})`,a50:`hsla(214, 6%, 55%, ${opacity[100]})`,a75:`hsla(214, 6%, 55%, ${opacity[200]})`,a100:`hsla(214, 6%, 55%, ${opacity[300]})`,a200:`hsla(214, 6%, 55%, ${opacity[500]})`,a400:`hsla(214, 6%, 55%, ${opacity[500]})`},ashGrayDark:{0:`hsla(0, 0%, 99%, ${opacity[1200]})`,50:`hsla(240, 2%, 92%, ${opacity[1200]})`,100:`hsla(240, 1%, 84%, ${opacity[1200]})`,200:`hsla(228, 4%, 76%, ${opacity[1200]})`,300:`hsla(227, 4%, 60%, ${opacity[1200]})`,400:`hsla(229, 4%, 50%, ${opacity[1200]})`,500:`hsla(233, 4%, 40%, ${opacity[1200]})`,600:`hsla(233, 5%, 32%, ${opacity[1200]})`,700:`hsla(230, 6%, 22%, ${opacity[1200]})`,800:`hsla(230, 6%, 19%, ${opacity[1200]})`,900:`hsla(230, 7%, 17%, ${opacity[1200]})`,1000:`hsla(230, 8%, 15%, ${opacity[1200]})`,1100:`hsla(231, 12%, 12%, ${opacity[1200]})`,1200:`hsla(231, 17%, 8%, ${opacity[1200]})`,1300:`hsla(240, 5%, 4%, ${opacity[1200]})`,a25:`hsla(228, 4%, 76%, ${opacity[50]})`,a50:`hsla(228, 4%, 76%, ${opacity[100]})`,a75:`hsla(228, 4%, 76%, ${opacity[200]})`,a100:`hsla(228, 4%, 76%, ${opacity[300]})`,a200:`hsla(228, 4%, 76%, ${opacity[500]})`,a400:`hsla(228, 4%, 76%, ${opacity[500]})`},white:{10:`hsla(0, 0%, 100%, ${opacity[100]})`,25:`hsla(0, 0%, 100%, ${opacity[200]})`,50:`hsla(0, 0%, 100%, ${opacity[300]})`,100:`hsla(0, 0%, 100%, ${opacity[500]})`,200:`hsla(0, 0%, 100%, ${opacity[600]})`,300:`hsla(0, 0%, 100%, ${opacity[800]})`,400:`hsla(0, 0%, 100%, ${opacity[1000]})`,450:`hsla(0, 0%, 100%, ${opacity[1100]})`,500:`hsla(0, 0%, 100%, ${opacity[1200]})`},black:{10:`hsla(0, 0%, 0%, ${opacity[100]})`,25:`hsla(0, 0%, 0%, ${opacity[200]})`,50:`hsla(0, 0%, 0%, ${opacity[300]})`,100:`hsla(0, 0%, 0%, ${opacity[500]})`,200:`hsla(0, 0%, 0%, ${opacity[700]})`,300:`hsla(0, 0%, 0%, ${opacity[900]})`,400:`hsla(0, 0%, 0%, ${opacity[1000]})`,450:`hsla(0, 0%, 0%, ${opacity[1100]})`,500:`hsla(0, 0%, 0%, ${opacity[1200]})`}}};
|
|
3
|
+
var colors={chromatic:{azure:{50:`hsla(222, 100%, 98%, ${opacity[1200]})`,100:`hsla(221, 90%, 92%, ${opacity[1200]})`,200:`hsla(219, 95%, 85%, ${opacity[1200]})`,300:`hsla(220, 100%, 73%, ${opacity[1200]})`,400:`hsla(223, 100%, 65%, ${opacity[1200]})`,500:`hsla(227, 100%, 59%, ${opacity[1200]})`,600:`hsla(227, 71%, 51%, ${opacity[1200]})`,700:`hsla(227, 69%, 42%, ${opacity[1200]})`,800:`hsla(227, 69%, 34%, ${opacity[1200]})`,900:`hsla(227, 69%, 25%, ${opacity[1200]})`,1000:`hsla(227, 69%, 17%, ${opacity[1200]})`,a50:`hsla(227, 100%, 59%, ${opacity[100]})`,a100:`hsla(227, 100%, 59%, ${opacity[300]})`,a150:`hsla(227, 100%, 59%, ${opacity[400]})`,a200:`hsla(227, 100%, 59%, ${opacity[500]})`,a400:`hsla(227, 100%, 59%, ${opacity[800]})`},emerald:{50:`hsla(152, 60%, 95%, ${opacity[1200]})`,100:`hsla(151, 57%, 91%, ${opacity[1200]})`,200:`hsla(150, 59%, 82%, ${opacity[1200]})`,300:`hsla(150, 59%, 73%, ${opacity[1200]})`,400:`hsla(150, 59%, 55%, ${opacity[1200]})`,500:`hsla(150, 100%, 37%, ${opacity[1200]})`,600:`hsla(150, 100%, 32%, ${opacity[1200]})`,700:`hsla(150, 100%, 27%, ${opacity[1200]})`,800:`hsla(150, 100%, 21%, ${opacity[1200]})`,900:`hsla(150, 100%, 16%, ${opacity[1200]})`,1000:`hsla(150, 100%, 11%, ${opacity[1200]})`,a50:`hsla(150, 100%, 32%, ${opacity[100]})`,a100:`hsla(150, 100%, 32%, ${opacity[300]})`,a150:`hsla(150, 100%, 32%, ${opacity[400]})`,a200:`hsla(150, 100%, 32%, ${opacity[500]})`,a400:`hsla(150, 100%, 32%, ${opacity[800]})`},crimson:{50:`hsla(0, 100%, 98%, ${opacity[1200]})`,100:`hsla(4, 93%, 94%, ${opacity[1200]})`,200:`hsla(3, 97%, 88%, ${opacity[1200]})`,300:`hsla(4, 96%, 79%, ${opacity[1200]})`,400:`hsla(4, 93%, 68%, ${opacity[1200]})`,500:`hsla(4, 86%, 58%, ${opacity[1200]})`,600:`hsla(4, 74%, 49%, ${opacity[1200]})`,700:`hsla(4, 77%, 40%, ${opacity[1200]})`,800:`hsla(0, 83%, 33%, ${opacity[1200]})`,900:`hsla(0, 84%, 29%, ${opacity[1200]})`,1000:`hsla(0, 84%, 25%, ${opacity[1200]})`,a50:`hsla(4, 74%, 49%, ${opacity[100]})`,a100:`hsla(4, 74%, 49%, ${opacity[300]})`,a150:`hsla(4, 74%, 49%, ${opacity[400]})`,a200:`hsla(4, 74%, 49%, ${opacity[500]})`,a400:`hsla(4, 74%, 49%, ${opacity[800]})`},cider:{50:`hsla(24, 100%, 96%, ${opacity[1200]})`,100:`hsla(25, 100%, 90%, ${opacity[1200]})`,200:`hsla(25, 100%, 80%, ${opacity[1200]})`,300:`hsla(25, 100%, 72%, ${opacity[1200]})`,400:`hsla(25, 100%, 63%, ${opacity[1200]})`,500:`hsla(25, 100%, 55%, ${opacity[1200]})`,600:`hsla(25, 90%, 48%, ${opacity[1200]})`,700:`hsla(25, 85%, 42%, ${opacity[1200]})`,800:`hsla(25, 82%, 35%, ${opacity[1200]})`,900:`hsla(25, 80%, 28%, ${opacity[1200]})`,1000:`hsla(25, 82%, 20%, ${opacity[1200]})`,a50:`hsla(25, 90%, 48%, ${opacity[100]})`,a100:`hsla(25, 90%, 48%, ${opacity[300]})`,a150:`hsla(25, 90%, 48%, ${opacity[400]})`,a200:`hsla(25, 90%, 48%, ${opacity[500]})`,a400:`hsla(25, 90%, 48%, ${opacity[800]})`},sapphire:{50:`hsla(201, 92%, 95%, ${opacity[1200]})`,100:`hsla(200, 88%, 90%, ${opacity[1200]})`,200:`hsla(200, 89%, 82%, ${opacity[1200]})`,300:`hsla(200, 90%, 72%, ${opacity[1200]})`,400:`hsla(200, 90%, 65%, ${opacity[1200]})`,500:`hsla(198, 90%, 52%, ${opacity[1200]})`,600:`hsla(200, 84%, 44%, ${opacity[1200]})`,700:`hsla(200, 84%, 37%, ${opacity[1200]})`,800:`hsla(200, 84%, 29%, ${opacity[1200]})`,900:`hsla(200, 84%, 22%, ${opacity[1200]})`,1000:`hsla(199, 84%, 15%, ${opacity[1200]})`,a50:`hsla(200, 84%, 44%, ${opacity[100]})`,a100:`hsla(200, 84%, 44%, ${opacity[300]})`,a150:`hsla(200, 84%, 44%, ${opacity[400]})`,a200:`hsla(200, 84%, 44%, ${opacity[500]})`,a400:`hsla(200, 84%, 44%, ${opacity[800]})`},sea:{50:`hsla(180, 39%, 95%, ${opacity[1200]})`,100:`hsla(180, 42%, 92%, ${opacity[1200]})`,200:`hsla(180, 33%, 82%, ${opacity[1200]})`,300:`hsla(180, 35%, 70%, ${opacity[1200]})`,400:`hsla(180, 30%, 52%, ${opacity[1200]})`,500:`hsla(180, 45%, 40%, ${opacity[1200]})`,600:`hsla(180, 60%, 30%, ${opacity[1200]})`,700:`hsla(180, 55%, 25%, ${opacity[1200]})`,800:`hsla(180, 61%, 20%, ${opacity[1200]})`,900:`hsla(180, 91%, 13%, ${opacity[1200]})`,1000:`hsla(180, 91%, 8%, ${opacity[1200]})`,a50:`hsla(180, 60%, 30%, ${opacity[100]})`,a100:`hsla(180, 60%, 30%, ${opacity[300]})`,a150:`hsla(180, 60%, 30%, ${opacity[400]})`,a200:`hsla(180, 60%, 30%, ${opacity[500]})`,a400:`hsla(180, 60%, 30%, ${opacity[800]})`},cloud:{50:`hsla(198, 39%, 95%, ${opacity[1200]})`,100:`hsla(201, 39%, 93%, ${opacity[1200]})`,200:`hsla(200, 35%, 85%, ${opacity[1200]})`,300:`hsla(200, 35%, 70%, ${opacity[1200]})`,400:`hsla(200, 30%, 52%, ${opacity[1200]})`,500:`hsla(200, 45%, 40%, ${opacity[1200]})`,600:`hsla(200, 60%, 30%, ${opacity[1200]})`,700:`hsla(201, 55%, 25%, ${opacity[1200]})`,800:`hsla(200, 61%, 20%, ${opacity[1200]})`,900:`hsla(200, 91%, 13%, ${opacity[1200]})`,1000:`hsla(200, 91%, 8%, ${opacity[1200]})`,a50:`hsla(200, 60%, 30%, ${opacity[100]})`,a100:`hsla(200, 60%, 30%, ${opacity[300]})`,a150:`hsla(200, 60%, 30%, ${opacity[400]})`,a200:`hsla(200, 60%, 30%, ${opacity[500]})`,a400:`hsla(200, 60%, 30%, ${opacity[800]})`},forest:{50:`hsla(152, 60%, 95%, ${opacity[1200]})`,100:`hsla(151, 57%, 91%, ${opacity[1200]})`,200:`hsla(150, 59%, 82%, ${opacity[1200]})`,300:`hsla(150, 59%, 73%, ${opacity[1200]})`,400:`hsla(150, 59%, 55%, ${opacity[1200]})`,500:`hsla(155, 100%, 37%, ${opacity[1200]})`,600:`hsla(155, 100%, 31%, ${opacity[1200]})`,700:`hsla(155, 100%, 27%, ${opacity[1200]})`,800:`hsla(155, 100%, 21%, ${opacity[1200]})`,900:`hsla(155, 100%, 16%, ${opacity[1200]})`,1000:`hsla(155, 100%, 11%, ${opacity[1200]})`,a50:`hsla(155, 100%, 31%, ${opacity[100]})`,a100:`hsla(155, 100%, 31%, ${opacity[300]})`,a150:`hsla(155, 100%, 31%, ${opacity[400]})`,a200:`hsla(155, 100%, 31%, ${opacity[500]})`,a400:`hsla(155, 100%, 31%, ${opacity[800]})`},orchid:{50:`hsla(267, 100%, 95%, ${opacity[1200]})`,100:`hsla(264, 100%, 89%, ${opacity[1200]})`,200:`hsla(263, 100%, 84%, ${opacity[1200]})`,300:`hsla(261, 100%, 79%, ${opacity[1200]})`,400:`hsla(259, 100%, 74%, ${opacity[1200]})`,500:`hsla(258, 93%, 68%, ${opacity[1200]})`,600:`hsla(257, 69%, 58%, ${opacity[1200]})`,700:`hsla(258, 54%, 48%, ${opacity[1200]})`,800:`hsla(257, 58%, 37%, ${opacity[1200]})`,900:`hsla(257, 62%, 26%, ${opacity[1200]})`,1000:`hsla(257, 65%, 14%, ${opacity[1200]})`,a50:`hsla(258, 93%, 68%, ${opacity[100]})`,a100:`hsla(258, 93%, 68%, ${opacity[300]})`,a150:`hsla(258, 93%, 68%, ${opacity[400]})`,a200:`hsla(258, 93%, 68%, ${opacity[500]})`,a400:`hsla(258, 93%, 68%, ${opacity[800]})`},magenta:{50:`hsla(309, 100%, 94%, ${opacity[1200]})`,100:`hsla(312, 100%, 87%, ${opacity[1200]})`,200:`hsla(316, 100%, 81%, ${opacity[1200]})`,300:`hsla(316, 90%, 73%, ${opacity[1200]})`,400:`hsla(316, 74%, 64%, ${opacity[1200]})`,500:`hsla(317, 60%, 55%, ${opacity[1200]})`,600:`hsla(317, 56%, 46%, ${opacity[1200]})`,700:`hsla(316, 63%, 36%, ${opacity[1200]})`,800:`hsla(316, 70%, 27%, ${opacity[1200]})`,900:`hsla(316, 76%, 18%, ${opacity[1200]})`,1000:`hsla(318, 80%, 10%, ${opacity[1200]})`,a50:`hsla(317, 60%, 55%, ${opacity[100]})`,a100:`hsla(317, 60%, 55%, ${opacity[300]})`,a150:`hsla(317, 60%, 55%, ${opacity[400]})`,a200:`hsla(317, 60%, 55%, ${opacity[500]})`,a400:`hsla(317, 60%, 55%, ${opacity[800]})`},topaz:{50:`hsla(46, 86%, 83%, ${opacity[1200]})`,100:`hsla(46, 80%, 68%, ${opacity[1200]})`,200:`hsla(46, 75%, 55%, ${opacity[1200]})`,300:`hsla(46, 93%, 43%, ${opacity[1200]})`,400:`hsla(44, 100%, 37%, ${opacity[1200]})`,500:`hsla(41, 100%, 33%, ${opacity[1200]})`,600:`hsla(39, 100%, 28%, ${opacity[1200]})`,700:`hsla(38, 100%, 24%, ${opacity[1200]})`,800:`hsla(37, 100%, 18%, ${opacity[1200]})`,900:`hsla(35, 100%, 13%, ${opacity[1200]})`,1000:`hsla(33, 100%, 7%, ${opacity[1200]})`,a50:`hsla(41, 100%, 33%, ${opacity[100]})`,a100:`hsla(41, 100%, 33%, ${opacity[300]})`,a150:`hsla(41, 100%, 33%, ${opacity[400]})`,a200:`hsla(41, 100%, 33%, ${opacity[500]})`,a400:`hsla(41, 100%, 33%, ${opacity[800]})`}},neutral:{blueGrayLight:{0:`hsla(0, 0%, 100%, ${opacity[1200]})`,50:`hsla(210, 40%, 98%, ${opacity[1200]})`,100:`hsla(213, 47%, 96%, ${opacity[1200]})`,200:`hsla(214, 40%, 92%, ${opacity[1200]})`,300:`hsla(214, 28%, 84%, ${opacity[1200]})`,400:`hsla(211, 27%, 76%, ${opacity[1200]})`,500:`hsla(211, 24%, 65%, ${opacity[1200]})`,600:`hsla(211, 22%, 56%, ${opacity[1200]})`,700:`hsla(211, 20%, 52%, ${opacity[1200]})`,800:`hsla(211, 23%, 45%, ${opacity[1200]})`,900:`hsla(211, 26%, 34%, ${opacity[1200]})`,1000:`hsla(211, 29%, 26%, ${opacity[1200]})`,1100:`hsla(211, 33%, 21%, ${opacity[1200]})`,1200:`hsla(212, 39%, 16%, ${opacity[1200]})`,1300:`hsla(211, 53%, 10%, ${opacity[1200]})`,a25:`hsla(211, 20%, 52%, ${opacity[50]})`,a50:`hsla(211, 20%, 52%, ${opacity[100]})`,a75:`hsla(211, 20%, 52%, ${opacity[200]})`,a100:`hsla(211, 20%, 52%, ${opacity[300]})`,a200:`hsla(211, 20%, 52%, ${opacity[500]})`,a400:`hsla(211, 20%, 52%, ${opacity[800]})`},blueGrayDark:{0:`hsla(240, 20%, 99%, ${opacity[1200]})`,50:`hsla(220, 22%, 92%, ${opacity[1200]})`,100:`hsla(214, 20%, 84%, ${opacity[1200]})`,200:`hsla(214, 17%, 76%, ${opacity[1200]})`,300:`hsla(216, 18%, 62%, ${opacity[1200]})`,400:`hsla(215, 20%, 43%, ${opacity[1200]})`,500:`hsla(216, 22%, 36%, ${opacity[1200]})`,600:`hsla(216, 24%, 31%, ${opacity[1200]})`,700:`hsla(216, 27%, 24%, ${opacity[1200]})`,800:`hsla(217, 27%, 21%, ${opacity[1200]})`,900:`hsla(218, 26%, 18%, ${opacity[1200]})`,1000:`hsla(217, 27%, 15%, ${opacity[1200]})`,1100:`hsla(216, 30%, 13%, ${opacity[1200]})`,1200:`hsla(215, 37%, 10%, ${opacity[1200]})`,1300:`hsla(214, 44%, 7%, ${opacity[1200]})`,a25:`hsla(214, 20%, 84%, ${opacity[50]})`,a50:`hsla(214, 20%, 84%, ${opacity[100]})`,a75:`hsla(214, 20%, 84%, ${opacity[200]})`,a100:`hsla(214, 20%, 84%, ${opacity[300]})`,a200:`hsla(214, 20%, 84%, ${opacity[500]})`,a400:`hsla(214, 20%, 84%, ${opacity[800]})`},ashGrayLight:{0:`hsla(0, 0%, 100%, ${opacity[1200]})`,50:`hsla(240, 9%, 98%, ${opacity[1200]})`,100:`hsla(210, 9%, 96%, ${opacity[1200]})`,200:`hsla(210, 6%, 94%, ${opacity[1200]})`,300:`hsla(210, 4%, 89%, ${opacity[1200]})`,400:`hsla(214, 7%, 81%, ${opacity[1200]})`,500:`hsla(216, 6%, 69%, ${opacity[1200]})`,600:`hsla(215, 6%, 60%, ${opacity[1200]})`,700:`hsla(214, 6%, 55%, ${opacity[1200]})`,800:`hsla(216, 7%, 45%, ${opacity[1200]})`,900:`hsla(218, 9%, 36%, ${opacity[1200]})`,1000:`hsla(219, 12%, 28%, ${opacity[1200]})`,1100:`hsla(214, 15%, 18%, ${opacity[1200]})`,1200:`hsla(216, 15%, 13%, ${opacity[1200]})`,1300:`hsla(214, 24%, 6%, ${opacity[1200]})`,a25:`hsla(214, 6%, 55%, ${opacity[50]})`,a50:`hsla(214, 6%, 55%, ${opacity[100]})`,a75:`hsla(214, 6%, 55%, ${opacity[200]})`,a100:`hsla(214, 6%, 55%, ${opacity[300]})`,a200:`hsla(214, 6%, 55%, ${opacity[500]})`,a400:`hsla(214, 6%, 55%, ${opacity[500]})`},ashGrayDark:{0:`hsla(0, 0%, 99%, ${opacity[1200]})`,50:`hsla(240, 2%, 92%, ${opacity[1200]})`,100:`hsla(240, 1%, 84%, ${opacity[1200]})`,200:`hsla(228, 4%, 76%, ${opacity[1200]})`,300:`hsla(227, 4%, 60%, ${opacity[1200]})`,400:`hsla(229, 4%, 50%, ${opacity[1200]})`,500:`hsla(233, 4%, 40%, ${opacity[1200]})`,600:`hsla(233, 5%, 32%, ${opacity[1200]})`,700:`hsla(230, 6%, 22%, ${opacity[1200]})`,800:`hsla(230, 6%, 19%, ${opacity[1200]})`,900:`hsla(230, 7%, 17%, ${opacity[1200]})`,1000:`hsla(230, 8%, 15%, ${opacity[1200]})`,1100:`hsla(231, 12%, 12%, ${opacity[1200]})`,1200:`hsla(231, 17%, 8%, ${opacity[1200]})`,1300:`hsla(240, 5%, 4%, ${opacity[1200]})`,a25:`hsla(228, 4%, 76%, ${opacity[50]})`,a50:`hsla(228, 4%, 76%, ${opacity[100]})`,a75:`hsla(228, 4%, 76%, ${opacity[200]})`,a100:`hsla(228, 4%, 76%, ${opacity[300]})`,a200:`hsla(228, 4%, 76%, ${opacity[500]})`,a400:`hsla(228, 4%, 76%, ${opacity[500]})`},white:{10:`hsla(0, 0%, 100%, ${opacity[100]})`,25:`hsla(0, 0%, 100%, ${opacity[200]})`,50:`hsla(0, 0%, 100%, ${opacity[300]})`,100:`hsla(0, 0%, 100%, ${opacity[500]})`,200:`hsla(0, 0%, 100%, ${opacity[600]})`,300:`hsla(0, 0%, 100%, ${opacity[800]})`,400:`hsla(0, 0%, 100%, ${opacity[1000]})`,450:`hsla(0, 0%, 100%, ${opacity[1100]})`,500:`hsla(0, 0%, 100%, ${opacity[1200]})`},black:{10:`hsla(0, 0%, 0%, ${opacity[100]})`,25:`hsla(0, 0%, 0%, ${opacity[200]})`,50:`hsla(0, 0%, 0%, ${opacity[300]})`,100:`hsla(0, 0%, 0%, ${opacity[500]})`,200:`hsla(0, 0%, 0%, ${opacity[700]})`,300:`hsla(0, 0%, 0%, ${opacity[900]})`,400:`hsla(0, 0%, 0%, ${opacity[1000]})`,450:`hsla(0, 0%, 0%, ${opacity[1100]})`,500:`hsla(0, 0%, 0%, ${opacity[1200]})`}}};
|
|
4
4
|
|
|
5
5
|
export { colors };
|
|
6
6
|
//# sourceMappingURL=colors.js.map
|