@epignosis_llc/gnosis 6.6.19 → 6.7.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/dist/cjs/index.cjs +187 -81
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/esm/src/components/FormElements/Select/styles.js +1 -0
- package/dist/esm/src/components/FormElements/Select/styles.js.map +1 -1
- package/dist/esm/src/components/FormElements/ToggleSwitch/ToggleLabel.js +2 -0
- package/dist/esm/src/components/FormElements/ToggleSwitch/ToggleLabel.js.map +1 -1
- package/dist/esm/src/components/FormElements/ToggleSwitch/ToggleSwitch.js +2 -0
- package/dist/esm/src/components/FormElements/ToggleSwitch/ToggleSwitch.js.map +1 -1
- package/dist/esm/src/components/FormElements/ToggleSwitch/ToggleSwitchCore.js +2 -0
- package/dist/esm/src/components/FormElements/ToggleSwitch/ToggleSwitchCore.js.map +1 -1
- package/dist/esm/src/components/Modal/styles.js +1 -0
- package/dist/esm/src/components/Modal/styles.js.map +1 -1
- package/dist/esm/src/components/SegmentedButtons/SegmentedButtons.js +73 -0
- package/dist/esm/src/components/SegmentedButtons/SegmentedButtons.js.map +1 -0
- package/dist/esm/src/components/SegmentedButtons/styles.js +37 -0
- package/dist/esm/src/components/SegmentedButtons/styles.js.map +1 -0
- package/dist/esm/src/components/Toast/ToastNotifications.js +2 -0
- package/dist/esm/src/components/Toast/ToastNotifications.js.map +1 -1
- package/dist/esm/src/index.js +1 -0
- package/dist/esm/src/index.js.map +1 -1
- package/dist/esm/src/theme/default/config/segmentedButtons.js +36 -0
- package/dist/esm/src/theme/default/config/segmentedButtons.js.map +1 -0
- package/dist/esm/src/theme/default/defaultTheme.js +2 -0
- package/dist/esm/src/theme/default/defaultTheme.js.map +1 -1
- package/dist/types/components/SegmentedButtons/SegmentedButtons.d.ts +16 -0
- package/dist/types/components/SegmentedButtons/styles.d.ts +11 -0
- package/dist/types/index.d.ts +2 -0
- package/dist/types/theme/default/config/index.d.ts +1 -0
- package/dist/types/theme/default/config/segmentedButtons.d.ts +23 -0
- package/dist/types/theme/default/defaultTheme.d.ts +22 -0
- package/package.json +1 -1
|
@@ -19,6 +19,7 @@ import '../../../theme/default/config/table.js';
|
|
|
19
19
|
import '../../../theme/default/config/tag.js';
|
|
20
20
|
import '../../../theme/default/config/pagination.js';
|
|
21
21
|
import scrollbar from '../../../theme/default/config/scrollbar.js';
|
|
22
|
+
import '../../../theme/default/config/segmentedButtons.js';
|
|
22
23
|
import '../../../theme/default/config/statusTag.js';
|
|
23
24
|
|
|
24
25
|
var portalSelectZIndex = 9999;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sources":["../../../../../../src/components/FormElements/Select/styles.ts"],"sourcesContent":["import { css, SerializedStyles, Theme } from \"@emotion/react\";\nimport {\n CSSObjectWithLabel,\n ClearIndicatorProps,\n ControlProps,\n DropdownIndicatorProps,\n GroupBase,\n MultiValueProps,\n OptionProps,\n PlaceholderProps,\n StylesConfig,\n} from \"react-select\";\nimport { InputSize } from \"../Input/Input\";\nimport { inputHeight } from \"../styles\";\nimport { CustomOption } from \"./types\";\nimport { formElements, scrollbar } from \"@theme/default/config\";\n\nconst portalSelectZIndex = 9999;\n\nexport const selectContainer = (\n { formElements }: Theme,\n {\n size,\n inline,\n isInlineFlex,\n minWidth,\n maxWidth,\n }: {\n size: InputSize;\n inline: boolean;\n isInlineFlex: boolean;\n minWidth: string;\n maxWidth: string;\n },\n): SerializedStyles => css`\n display: ${isInlineFlex ? \"inline-flex\" : \"flex\"};\n flex-direction: ${inline ? \"row\" : \"column\"};\n gap: ${inline ? \"1rem\" : \"0.5rem\"};\n align-items: ${inline ? \"center\" : \"normal\"};\n\n .label-container {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 0.25rem;\n\n label {\n margin: 0;\n\n &.required::after {\n content: \" *\";\n color: ${formElements.generic.required};\n }\n }\n\n div {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n svg {\n color: ${formElements.input.infoTooltipColor};\n &:hover {\n cursor: pointer;\n }\n }\n }\n\n .select-create-label {\n display: flex;\n justify-content: space-between;\n padding-inline-end: 1rem;\n color: ${formElements.input.borderFocusColor};\n\n svg {\n color: ${formElements.input.borderFocusColor};\n\n line-height: 0;\n }\n }\n\n .select-input-wrapper {\n min-width: ${minWidth};\n max-width: ${maxWidth};\n flex-grow: 1;\n background-color: ${formElements.input.background};\n border-radius: 0.3125rem;\n\n .error {\n border-color: ${formElements.errors.errorBorderColor};\n }\n\n .control-${size} {\n /* minus border */\n &:hover,\n &.focused {\n border: 1px solid ${formElements.input.borderFocus};\n }\n\n min-height: calc(${inputHeight[size]} - 2px);\n }\n\n .selected {\n background-color: ${formElements.input.borderFocus};\n }\n\n .option-${size} {\n padding: 0.3125rem 1rem;\n word-break: break-word;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n padding-inline-end: 1rem;\n width: auto;\n }\n }\n`;\n\nexport const resolveStyles = ({\n size,\n menuMinWidth,\n allowTextWrap = false,\n}: {\n size: InputSize;\n menuMinWidth?: number;\n allowTextWrap?: boolean;\n}): StylesConfig<CustomOption> => ({\n menu: (base: CSSObjectWithLabel) => {\n return {\n ...base,\n zIndex: 1060,\n minWidth: menuMinWidth ?? \"auto\",\n };\n },\n // Modal overlays use a z-index of 9998\n // To ensure the menu appears on top, set its z-index to at least 9999\n menuPortal: (base) => ({ ...base, zIndex: portalSelectZIndex }),\n placeholder: (\n base: CSSObjectWithLabel,\n { isDisabled }: PlaceholderProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => {\n return {\n ...base,\n fontStyle: \"italic\",\n color: isDisabled ? formElements.input.disabledColor : formElements.input.placeholderColor,\n };\n },\n groupHeading: (base: CSSObjectWithLabel) => ({\n ...base,\n color: formElements.generic.black,\n fontWeight: 700,\n }),\n dropdownIndicator: (\n base: CSSObjectWithLabel,\n { selectProps }: DropdownIndicatorProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => ({\n ...base,\n transform: selectProps.menuIsOpen ? \"rotate(-180deg)\" : \"rotate(0)\",\n transition: \"all .2s ease\",\n color: selectProps.isDisabled ? base.color : formElements.input.iconColor,\n \"&:hover\": {\n color: formElements.input.iconHoverColor,\n cursor: !selectProps.isDisabled ? \"pointer\" : \"not-allowed\",\n },\n }),\n clearIndicator: (\n base: CSSObjectWithLabel,\n { selectProps }: ClearIndicatorProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => ({\n ...base,\n color: selectProps.isDisabled ? base.color : formElements.input.iconColor,\n \"&:hover\": { color: formElements.input.iconHoverColor, cursor: \"pointer\" },\n }),\n control: (\n base: CSSObjectWithLabel,\n { isFocused, isDisabled }: ControlProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => {\n const border = isDisabled\n ? `1px solid ${formElements.input.disabledBorder}`\n : isFocused\n ? `1px solid ${formElements.input.borderFocusColor}`\n : // default case, set border equal to the background color to avoid pixel shift\n `1px solid ${formElements.input.background}`;\n const backgroundColor = isDisabled\n ? formElements.input.disabledBackground\n : isFocused\n ? formElements.input.backgroundFocus\n : \"formElements.input.background;\";\n\n return {\n ...base,\n border,\n backgroundColor,\n boxShadow: \"none\",\n borderRadius: \"5px\",\n color: !isDisabled ? base.color : formElements.input.disabledColor,\n cursor: !isDisabled ? \"pointer\" : \"not-allowed\",\n pointerEvents: \"auto\",\n \"&:hover\": {\n borderColor: isDisabled\n ? formElements.input.disabledBorder\n : formElements.input.borderFocusColor,\n },\n };\n },\n multiValue: (base) => ({\n ...base,\n background: \"transparent\",\n }),\n multiValueLabel: (\n base: CSSObjectWithLabel,\n { isDisabled }: MultiValueProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => ({\n ...base,\n color: !isDisabled ? base.color : formElements.input.disabledColor,\n background: formElements.multiSelect.background,\n order: \"1\",\n borderRadius: \"0 2px 2px 0\",\n paddingRight: \"6px\",\n paddingLeft: \"6px\",\n \".custom-multi-value\": {\n wordBreak: \"break-word\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n },\n }),\n multiValueRemove: (base: CSSObjectWithLabel) => ({\n ...base,\n background: formElements.multiSelect.background,\n borderRadius: \"2px 0 0 2px\",\n \":hover\": {\n cursor: \"pointer\",\n background: formElements.multiSelect.hoverClose,\n },\n }),\n option: (\n base: CSSObjectWithLabel,\n {\n isSelected,\n isFocused,\n isDisabled,\n }: OptionProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => {\n const commonStyles: CSSObjectWithLabel = {\n overflow: allowTextWrap ? \"visible\" : \"hidden\",\n textOverflow: allowTextWrap ? \"unset\" : \"ellipsis\",\n wordBreak: allowTextWrap ? \"break-word\" : \"keep-all\",\n whiteSpace: allowTextWrap ? \"normal\" : \"nowrap\",\n };\n\n return {\n ...base,\n backgroundColor: isSelected\n ? formElements.input.borderFocus\n : !isFocused\n ? \"transparent\"\n : formElements.input.hoverColor,\n color: isSelected\n ? formElements.input.textColorFocused\n : isDisabled\n ? formElements.input.disabledColor\n : \"inherit\",\n borderRadius: \"none\",\n \"&:hover\": {\n color: isSelected\n ? formElements.input.textColorFocused\n : isDisabled\n ? formElements.input.disabledColor\n : formElements.input.textColor,\n backgroundColor: isFocused\n ? !isSelected\n ? formElements.input.hoverColor\n : formElements.input.borderFocus\n : \"transparent\",\n },\n cursor: isDisabled ? \"default\" : \"pointer\",\n \".custom-option\": {\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n ...commonStyles,\n },\n \".label-text\": {\n flex: 1,\n ...commonStyles,\n },\n \".hint-text\": {\n color: formElements.input.disabledColor,\n marginLeft: \"5px\",\n textAlign: \"right\",\n ...commonStyles,\n },\n };\n },\n menuList: (base: CSSObjectWithLabel) => ({\n ...base,\n marginTop: \"0.5rem\",\n marginBottom: \"0.5rem\",\n padding: \"0\",\n \"::-webkit-scrollbar\": {\n width: \"5px\",\n },\n \"::-webkit-scrollbar-track\": {\n background: scrollbar.background,\n borderRadius: \"10px\",\n },\n \"::-webkit-scrollbar-thumb\": {\n backgroundColor: scrollbar.color,\n borderRadius: \"10px\",\n },\n }),\n indicatorsContainer: (base: CSSObjectWithLabel) => ({\n ...base,\n // it is important to set the indicator size to the same height as the input to avoid centering issues\n height: `calc(${inputHeight[size]} - 2px)`,\n }),\n singleValue: (base) => ({\n ...base,\n \".custom-value\": {\n wordBreak: \"break-word\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n },\n }),\n});\n\nexport const customLabelStyles = ({ level }: { level: number }): SerializedStyles => {\n return css`\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 0.5rem;\n padding-inline-start: ${level <= 1 ? \"0\" : `${0.5 * level}rem`};\n `;\n};\n"],"names":["portalSelectZIndex","selectContainer","_ref","_ref2","formElements","size","inline","isInlineFlex","minWidth","maxWidth","css","generic","required","input","infoTooltipColor","borderFocusColor","background","errors","errorBorderColor","inputHeight","borderFocus","process","env","NODE_ENV","resolveStyles","_ref3","menuMinWidth","_ref3$allowTextWrap","allowTextWrap","menu","base","_objectSpread","zIndex","menuPortal","placeholder","_ref4","isDisabled","fontStyle","color","disabledColor","placeholderColor","groupHeading","black","fontWeight","dropdownIndicator","_ref5","selectProps","transform","menuIsOpen","transition","iconColor","iconHoverColor","cursor","clearIndicator","_ref6","control","_ref7","isFocused","border","concat","disabledBorder","backgroundColor","disabledBackground","backgroundFocus","boxShadow","borderRadius","pointerEvents","borderColor","multiValue","multiValueLabel","_ref8","multiSelect","order","paddingRight","paddingLeft","wordBreak","overflow","textOverflow","whiteSpace","multiValueRemove","hoverClose","option","_ref9","isSelected","commonStyles","hoverColor","textColorFocused","textColor","display","justifyContent","alignItems","flex","marginLeft","textAlign","menuList","marginTop","marginBottom","padding","width","scrollbar","indicatorsContainer","height","singleValue","customLabelStyles","_ref0","level"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"styles.js","sources":["../../../../../../src/components/FormElements/Select/styles.ts"],"sourcesContent":["import { css, SerializedStyles, Theme } from \"@emotion/react\";\nimport {\n CSSObjectWithLabel,\n ClearIndicatorProps,\n ControlProps,\n DropdownIndicatorProps,\n GroupBase,\n MultiValueProps,\n OptionProps,\n PlaceholderProps,\n StylesConfig,\n} from \"react-select\";\nimport { InputSize } from \"../Input/Input\";\nimport { inputHeight } from \"../styles\";\nimport { CustomOption } from \"./types\";\nimport { formElements, scrollbar } from \"@theme/default/config\";\n\nconst portalSelectZIndex = 9999;\n\nexport const selectContainer = (\n { formElements }: Theme,\n {\n size,\n inline,\n isInlineFlex,\n minWidth,\n maxWidth,\n }: {\n size: InputSize;\n inline: boolean;\n isInlineFlex: boolean;\n minWidth: string;\n maxWidth: string;\n },\n): SerializedStyles => css`\n display: ${isInlineFlex ? \"inline-flex\" : \"flex\"};\n flex-direction: ${inline ? \"row\" : \"column\"};\n gap: ${inline ? \"1rem\" : \"0.5rem\"};\n align-items: ${inline ? \"center\" : \"normal\"};\n\n .label-container {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 0.25rem;\n\n label {\n margin: 0;\n\n &.required::after {\n content: \" *\";\n color: ${formElements.generic.required};\n }\n }\n\n div {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n svg {\n color: ${formElements.input.infoTooltipColor};\n &:hover {\n cursor: pointer;\n }\n }\n }\n\n .select-create-label {\n display: flex;\n justify-content: space-between;\n padding-inline-end: 1rem;\n color: ${formElements.input.borderFocusColor};\n\n svg {\n color: ${formElements.input.borderFocusColor};\n\n line-height: 0;\n }\n }\n\n .select-input-wrapper {\n min-width: ${minWidth};\n max-width: ${maxWidth};\n flex-grow: 1;\n background-color: ${formElements.input.background};\n border-radius: 0.3125rem;\n\n .error {\n border-color: ${formElements.errors.errorBorderColor};\n }\n\n .control-${size} {\n /* minus border */\n &:hover,\n &.focused {\n border: 1px solid ${formElements.input.borderFocus};\n }\n\n min-height: calc(${inputHeight[size]} - 2px);\n }\n\n .selected {\n background-color: ${formElements.input.borderFocus};\n }\n\n .option-${size} {\n padding: 0.3125rem 1rem;\n word-break: break-word;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n padding-inline-end: 1rem;\n width: auto;\n }\n }\n`;\n\nexport const resolveStyles = ({\n size,\n menuMinWidth,\n allowTextWrap = false,\n}: {\n size: InputSize;\n menuMinWidth?: number;\n allowTextWrap?: boolean;\n}): StylesConfig<CustomOption> => ({\n menu: (base: CSSObjectWithLabel) => {\n return {\n ...base,\n zIndex: 1060,\n minWidth: menuMinWidth ?? \"auto\",\n };\n },\n // Modal overlays use a z-index of 9998\n // To ensure the menu appears on top, set its z-index to at least 9999\n menuPortal: (base) => ({ ...base, zIndex: portalSelectZIndex }),\n placeholder: (\n base: CSSObjectWithLabel,\n { isDisabled }: PlaceholderProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => {\n return {\n ...base,\n fontStyle: \"italic\",\n color: isDisabled ? formElements.input.disabledColor : formElements.input.placeholderColor,\n };\n },\n groupHeading: (base: CSSObjectWithLabel) => ({\n ...base,\n color: formElements.generic.black,\n fontWeight: 700,\n }),\n dropdownIndicator: (\n base: CSSObjectWithLabel,\n { selectProps }: DropdownIndicatorProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => ({\n ...base,\n transform: selectProps.menuIsOpen ? \"rotate(-180deg)\" : \"rotate(0)\",\n transition: \"all .2s ease\",\n color: selectProps.isDisabled ? base.color : formElements.input.iconColor,\n \"&:hover\": {\n color: formElements.input.iconHoverColor,\n cursor: !selectProps.isDisabled ? \"pointer\" : \"not-allowed\",\n },\n }),\n clearIndicator: (\n base: CSSObjectWithLabel,\n { selectProps }: ClearIndicatorProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => ({\n ...base,\n color: selectProps.isDisabled ? base.color : formElements.input.iconColor,\n \"&:hover\": { color: formElements.input.iconHoverColor, cursor: \"pointer\" },\n }),\n control: (\n base: CSSObjectWithLabel,\n { isFocused, isDisabled }: ControlProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => {\n const border = isDisabled\n ? `1px solid ${formElements.input.disabledBorder}`\n : isFocused\n ? `1px solid ${formElements.input.borderFocusColor}`\n : // default case, set border equal to the background color to avoid pixel shift\n `1px solid ${formElements.input.background}`;\n const backgroundColor = isDisabled\n ? formElements.input.disabledBackground\n : isFocused\n ? formElements.input.backgroundFocus\n : \"formElements.input.background;\";\n\n return {\n ...base,\n border,\n backgroundColor,\n boxShadow: \"none\",\n borderRadius: \"5px\",\n color: !isDisabled ? base.color : formElements.input.disabledColor,\n cursor: !isDisabled ? \"pointer\" : \"not-allowed\",\n pointerEvents: \"auto\",\n \"&:hover\": {\n borderColor: isDisabled\n ? formElements.input.disabledBorder\n : formElements.input.borderFocusColor,\n },\n };\n },\n multiValue: (base) => ({\n ...base,\n background: \"transparent\",\n }),\n multiValueLabel: (\n base: CSSObjectWithLabel,\n { isDisabled }: MultiValueProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => ({\n ...base,\n color: !isDisabled ? base.color : formElements.input.disabledColor,\n background: formElements.multiSelect.background,\n order: \"1\",\n borderRadius: \"0 2px 2px 0\",\n paddingRight: \"6px\",\n paddingLeft: \"6px\",\n \".custom-multi-value\": {\n wordBreak: \"break-word\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n },\n }),\n multiValueRemove: (base: CSSObjectWithLabel) => ({\n ...base,\n background: formElements.multiSelect.background,\n borderRadius: \"2px 0 0 2px\",\n \":hover\": {\n cursor: \"pointer\",\n background: formElements.multiSelect.hoverClose,\n },\n }),\n option: (\n base: CSSObjectWithLabel,\n {\n isSelected,\n isFocused,\n isDisabled,\n }: OptionProps<CustomOption, boolean, GroupBase<CustomOption>>,\n ) => {\n const commonStyles: CSSObjectWithLabel = {\n overflow: allowTextWrap ? \"visible\" : \"hidden\",\n textOverflow: allowTextWrap ? \"unset\" : \"ellipsis\",\n wordBreak: allowTextWrap ? \"break-word\" : \"keep-all\",\n whiteSpace: allowTextWrap ? \"normal\" : \"nowrap\",\n };\n\n return {\n ...base,\n backgroundColor: isSelected\n ? formElements.input.borderFocus\n : !isFocused\n ? \"transparent\"\n : formElements.input.hoverColor,\n color: isSelected\n ? formElements.input.textColorFocused\n : isDisabled\n ? formElements.input.disabledColor\n : \"inherit\",\n borderRadius: \"none\",\n \"&:hover\": {\n color: isSelected\n ? formElements.input.textColorFocused\n : isDisabled\n ? formElements.input.disabledColor\n : formElements.input.textColor,\n backgroundColor: isFocused\n ? !isSelected\n ? formElements.input.hoverColor\n : formElements.input.borderFocus\n : \"transparent\",\n },\n cursor: isDisabled ? \"default\" : \"pointer\",\n \".custom-option\": {\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n ...commonStyles,\n },\n \".label-text\": {\n flex: 1,\n ...commonStyles,\n },\n \".hint-text\": {\n color: formElements.input.disabledColor,\n marginLeft: \"5px\",\n textAlign: \"right\",\n ...commonStyles,\n },\n };\n },\n menuList: (base: CSSObjectWithLabel) => ({\n ...base,\n marginTop: \"0.5rem\",\n marginBottom: \"0.5rem\",\n padding: \"0\",\n \"::-webkit-scrollbar\": {\n width: \"5px\",\n },\n \"::-webkit-scrollbar-track\": {\n background: scrollbar.background,\n borderRadius: \"10px\",\n },\n \"::-webkit-scrollbar-thumb\": {\n backgroundColor: scrollbar.color,\n borderRadius: \"10px\",\n },\n }),\n indicatorsContainer: (base: CSSObjectWithLabel) => ({\n ...base,\n // it is important to set the indicator size to the same height as the input to avoid centering issues\n height: `calc(${inputHeight[size]} - 2px)`,\n }),\n singleValue: (base) => ({\n ...base,\n \".custom-value\": {\n wordBreak: \"break-word\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n },\n }),\n});\n\nexport const customLabelStyles = ({ level }: { level: number }): SerializedStyles => {\n return css`\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 0.5rem;\n padding-inline-start: ${level <= 1 ? \"0\" : `${0.5 * level}rem`};\n `;\n};\n"],"names":["portalSelectZIndex","selectContainer","_ref","_ref2","formElements","size","inline","isInlineFlex","minWidth","maxWidth","css","generic","required","input","infoTooltipColor","borderFocusColor","background","errors","errorBorderColor","inputHeight","borderFocus","process","env","NODE_ENV","resolveStyles","_ref3","menuMinWidth","_ref3$allowTextWrap","allowTextWrap","menu","base","_objectSpread","zIndex","menuPortal","placeholder","_ref4","isDisabled","fontStyle","color","disabledColor","placeholderColor","groupHeading","black","fontWeight","dropdownIndicator","_ref5","selectProps","transform","menuIsOpen","transition","iconColor","iconHoverColor","cursor","clearIndicator","_ref6","control","_ref7","isFocused","border","concat","disabledBorder","backgroundColor","disabledBackground","backgroundFocus","boxShadow","borderRadius","pointerEvents","borderColor","multiValue","multiValueLabel","_ref8","multiSelect","order","paddingRight","paddingLeft","wordBreak","overflow","textOverflow","whiteSpace","multiValueRemove","hoverClose","option","_ref9","isSelected","commonStyles","hoverColor","textColorFocused","textColor","display","justifyContent","alignItems","flex","marginLeft","textAlign","menuList","marginTop","marginBottom","padding","width","scrollbar","indicatorsContainer","height","singleValue","customLabelStyles","_ref0","level"],"mappings":"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"}
|
|
@@ -58,6 +58,7 @@ import '../../../../node_modules/core-js/modules/web.set-timeout.js';
|
|
|
58
58
|
import '../Input/styles.js';
|
|
59
59
|
import '../../../../node_modules/core-js/modules/es.regexp.exec.js';
|
|
60
60
|
import '../../../../node_modules/core-js/modules/es.array.some.js';
|
|
61
|
+
import '../../SegmentedButtons/styles.js';
|
|
61
62
|
import '../../Toast/ToastNotifications.js';
|
|
62
63
|
import '../../../../node_modules/core-js/modules/es.function.name.js';
|
|
63
64
|
import '../../../theme/default/config/button.js';
|
|
@@ -68,6 +69,7 @@ import '../../../theme/default/config/progressBar.js';
|
|
|
68
69
|
import '../../../theme/default/config/table.js';
|
|
69
70
|
import '../../../theme/default/config/tag.js';
|
|
70
71
|
import '../../../theme/default/config/pagination.js';
|
|
72
|
+
import '../../../theme/default/config/segmentedButtons.js';
|
|
71
73
|
import '../../../theme/default/config/statusTag.js';
|
|
72
74
|
|
|
73
75
|
var TooltipIcon = function TooltipIcon(_ref) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleLabel.js","sources":["../../../../../../src/components/FormElements/ToggleSwitch/ToggleLabel.tsx"],"sourcesContent":["import React from \"react\";\nimport classNames from \"classnames\";\nimport { Text, Tooltip } from \"../../../\";\nimport { InfoIconSVG } from \"../../../icons\";\n\ntype ToggleLabelProps = {\n label: string;\n position: \"before\" | \"after\";\n description?: string;\n tooltip?: string;\n required?: boolean;\n notSwitchedOff?: boolean;\n hasDescription?: boolean;\n onClick: (e: React.MouseEvent<HTMLDivElement>) => void;\n};\n\ntype TooltipIconProps = {\n tooltip: string;\n};\n\nconst TooltipIcon: React.FC<TooltipIconProps> = ({ tooltip }) => (\n <Tooltip content={tooltip} parentProps={{ \"aria-label\": tooltip }}>\n <InfoIconSVG height={16} />\n </Tooltip>\n);\n\nconst labelClassNames = (\n customClassName: string,\n notSwitchedOff: boolean,\n isRequired: boolean,\n): string =>\n classNames(customClassName, {\n \"toggle-switch__label--binary-bold\": notSwitchedOff,\n \"toggle-switch__label--required\": isRequired,\n });\n\nconst ToggleLabel: React.FC<ToggleLabelProps> = ({\n label,\n position,\n description,\n tooltip,\n required = false,\n notSwitchedOff = false,\n hasDescription = false,\n onClick,\n}) => {\n const hasDescriptionTextWeight = hasDescription ? \"700\" : \"400\";\n const isBeforeLabel = position === \"before\";\n\n return (\n <div className={`toggle-switch__label-container toggle-switch__label-container--${position}`}>\n <Text\n fontSize=\"sm\"\n className={labelClassNames(\n `toggle-switch__label ${isBeforeLabel ? \"toggle-switch__label--before\" : \"\"}`,\n notSwitchedOff,\n required,\n )}\n onClick={onClick}\n as=\"div\"\n weight={hasDescriptionTextWeight}\n >\n {tooltip && isBeforeLabel && <TooltipIcon tooltip={tooltip} />}\n {label}\n {tooltip && !isBeforeLabel && <TooltipIcon tooltip={tooltip} />}\n </Text>\n {description && (\n <Text fontSize=\"sm\" as=\"div\" className=\"toggle-switch__description\">\n {description}\n </Text>\n )}\n </div>\n );\n};\n\nexport default ToggleLabel;\n"],"names":["TooltipIcon","_ref","tooltip","___EmotionJSX","Tooltip","content","parentProps","InfoIconSVG","height","labelClassNames","customClassName","notSwitchedOff","isRequired","classNames","ToggleLabel","_ref2","label","position","description","_ref2$required","required","_ref2$notSwitchedOff","_ref2$hasDescription","hasDescription","onClick","hasDescriptionTextWeight","isBeforeLabel","className","concat","Text","fontSize","as","weight"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ToggleLabel.js","sources":["../../../../../../src/components/FormElements/ToggleSwitch/ToggleLabel.tsx"],"sourcesContent":["import React from \"react\";\nimport classNames from \"classnames\";\nimport { Text, Tooltip } from \"../../../\";\nimport { InfoIconSVG } from \"../../../icons\";\n\ntype ToggleLabelProps = {\n label: string;\n position: \"before\" | \"after\";\n description?: string;\n tooltip?: string;\n required?: boolean;\n notSwitchedOff?: boolean;\n hasDescription?: boolean;\n onClick: (e: React.MouseEvent<HTMLDivElement>) => void;\n};\n\ntype TooltipIconProps = {\n tooltip: string;\n};\n\nconst TooltipIcon: React.FC<TooltipIconProps> = ({ tooltip }) => (\n <Tooltip content={tooltip} parentProps={{ \"aria-label\": tooltip }}>\n <InfoIconSVG height={16} />\n </Tooltip>\n);\n\nconst labelClassNames = (\n customClassName: string,\n notSwitchedOff: boolean,\n isRequired: boolean,\n): string =>\n classNames(customClassName, {\n \"toggle-switch__label--binary-bold\": notSwitchedOff,\n \"toggle-switch__label--required\": isRequired,\n });\n\nconst ToggleLabel: React.FC<ToggleLabelProps> = ({\n label,\n position,\n description,\n tooltip,\n required = false,\n notSwitchedOff = false,\n hasDescription = false,\n onClick,\n}) => {\n const hasDescriptionTextWeight = hasDescription ? \"700\" : \"400\";\n const isBeforeLabel = position === \"before\";\n\n return (\n <div className={`toggle-switch__label-container toggle-switch__label-container--${position}`}>\n <Text\n fontSize=\"sm\"\n className={labelClassNames(\n `toggle-switch__label ${isBeforeLabel ? \"toggle-switch__label--before\" : \"\"}`,\n notSwitchedOff,\n required,\n )}\n onClick={onClick}\n as=\"div\"\n weight={hasDescriptionTextWeight}\n >\n {tooltip && isBeforeLabel && <TooltipIcon tooltip={tooltip} />}\n {label}\n {tooltip && !isBeforeLabel && <TooltipIcon tooltip={tooltip} />}\n </Text>\n {description && (\n <Text fontSize=\"sm\" as=\"div\" className=\"toggle-switch__description\">\n {description}\n </Text>\n )}\n </div>\n );\n};\n\nexport default ToggleLabel;\n"],"names":["TooltipIcon","_ref","tooltip","___EmotionJSX","Tooltip","content","parentProps","InfoIconSVG","height","labelClassNames","customClassName","notSwitchedOff","isRequired","classNames","ToggleLabel","_ref2","label","position","description","_ref2$required","required","_ref2$notSwitchedOff","_ref2$hasDescription","hasDescription","onClick","hasDescriptionTextWeight","isBeforeLabel","className","concat","Text","fontSize","as","weight"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,IAAMA,WAAuC,GAAG,SAA1CA,WAAuCA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAMC,OAAO,GAAAD,IAAA,CAAPC,OAAO,CAAA;EAAA,OACxDC,GAAA,CAACC,OAAO,EAAA;AAACC,IAAAA,OAAO,EAAEH,OAAQ;AAACI,IAAAA,WAAW,EAAE;AAAE,MAAA,YAAY,EAAEJ,OAAAA;AAAQ,KAAA;GAC9DC,EAAAA,GAAA,CAACI,WAAW,EAAA;AAACC,IAAAA,MAAM,EAAE,EAAA;AAAG,GAAE,CACnB,CAAC,CAAA;AAAA,CACX,CAAA;AAED,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,CACnBC,eAAuB,EACvBC,cAAuB,EACvBC,UAAmB,EAAA;EAAA,OAEnBC,UAAU,CAACH,eAAe,EAAE;AAC1B,IAAA,mCAAmC,EAAEC,cAAc;AACnD,IAAA,gCAAgC,EAAEC,UAAAA;AACpC,GAAC,CAAC,CAAA;AAAA,CAAA,CAAA;AAEJ,IAAME,WAAuC,GAAG,SAA1CA,WAAuCA,CAAAC,KAAA,EASvC;AAAA,EAAA,IARJC,KAAK,GAAAD,KAAA,CAALC,KAAK;IACLC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;IACRC,WAAW,GAAAH,KAAA,CAAXG,WAAW;IACXhB,OAAO,GAAAa,KAAA,CAAPb,OAAO;IAAAiB,cAAA,GAAAJ,KAAA,CACPK,QAAQ;AAARA,IAAAA,QAAQ,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,cAAA;IAAAE,oBAAA,GAAAN,KAAA,CAChBJ,cAAc;AAAdA,IAAAA,cAAc,GAAAU,oBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,oBAAA;IAAAC,oBAAA,GAAAP,KAAA,CACtBQ,cAAc;AAAdA,IAAAA,cAAc,GAAAD,oBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,oBAAA;IACtBE,OAAO,GAAAT,KAAA,CAAPS,OAAO,CAAA;AAEP,EAAA,IAAMC,wBAAwB,GAAGF,cAAc,GAAG,KAAK,GAAG,KAAK,CAAA;AAC/D,EAAA,IAAMG,aAAa,GAAGT,QAAQ,KAAK,QAAQ,CAAA;AAE3C,EAAA,OACEd,GAAA,CAAA,KAAA,EAAA;IAAKwB,SAAS,EAAA,iEAAA,CAAAC,MAAA,CAAoEX,QAAQ,CAAA;GACxFd,EAAAA,GAAA,CAAC0B,IAAI,EAAA;AACHC,IAAAA,QAAQ,EAAC,IAAI;AACbH,IAAAA,SAAS,EAAElB,eAAe,CAAAmB,uBAAAA,CAAAA,MAAA,CACAF,aAAa,GAAG,8BAA8B,GAAG,EAAE,CAAA,EAC3Ef,cAAc,EACdS,QACF,CAAE;AACFI,IAAAA,OAAO,EAAEA,OAAQ;AACjBO,IAAAA,EAAE,EAAC,KAAK;AACRC,IAAAA,MAAM,EAAEP,wBAAAA;AAAyB,GAAA,EAEhCvB,OAAO,IAAIwB,aAAa,IAAIvB,GAAA,CAACH,WAAW,EAAA;AAACE,IAAAA,OAAO,EAAEA,OAAAA;GAAU,CAAC,EAC7Dc,KAAK,EACLd,OAAO,IAAI,CAACwB,aAAa,IAAIvB,GAAA,CAACH,WAAW,EAAA;AAACE,IAAAA,OAAO,EAAEA,OAAAA;AAAQ,GAAE,CAC1D,CAAC,EACNgB,WAAW,IACVf,GAAA,CAAC0B,IAAI,EAAA;AAACC,IAAAA,QAAQ,EAAC,IAAI;AAACC,IAAAA,EAAE,EAAC,KAAK;AAACJ,IAAAA,SAAS,EAAC,4BAAA;GACpCT,EAAAA,WACG,CAEL,CAAC,CAAA;AAEV;;;;"}
|
|
@@ -57,6 +57,7 @@ import '../../../../node_modules/core-js/modules/web.set-timeout.js';
|
|
|
57
57
|
import '../Input/styles.js';
|
|
58
58
|
import '../../../../node_modules/core-js/modules/es.regexp.exec.js';
|
|
59
59
|
import '../../../../node_modules/core-js/modules/es.array.some.js';
|
|
60
|
+
import '../../SegmentedButtons/styles.js';
|
|
60
61
|
import '../../Toast/ToastNotifications.js';
|
|
61
62
|
import '../../../../node_modules/core-js/modules/es.function.name.js';
|
|
62
63
|
import '../../../theme/default/config/button.js';
|
|
@@ -67,6 +68,7 @@ import '../../../theme/default/config/progressBar.js';
|
|
|
67
68
|
import '../../../theme/default/config/table.js';
|
|
68
69
|
import '../../../theme/default/config/tag.js';
|
|
69
70
|
import '../../../theme/default/config/pagination.js';
|
|
71
|
+
import '../../../theme/default/config/segmentedButtons.js';
|
|
70
72
|
import '../../../theme/default/config/statusTag.js';
|
|
71
73
|
import ToggleLabel from './ToggleLabel.js';
|
|
72
74
|
import ToggleSwitchCore from './ToggleSwitchCore.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleSwitch.js","sources":["../../../../../../src/components/FormElements/ToggleSwitch/ToggleSwitch.tsx"],"sourcesContent":["import React, { useState, useEffect, useImperativeHandle, forwardRef } from \"react\";\nimport { SerializedStyles } from \"@emotion/utils\";\nimport { Text } from \"../../../\";\nimport ToggleLabel from \"./ToggleLabel\";\nimport ToggleSwitchCore from \"./ToggleSwitchCore\";\nimport { ToggleContainer } from \"./styles\";\n\ntype ToggleSpecificProps = {\n id: string;\n labelBefore?: string;\n labelAfter?: string;\n defaultChecked?: boolean;\n description?: string;\n labelledById?: string;\n isDisabled?: boolean;\n required?: boolean;\n tooltip?: string;\n variant?: \"primary\" | \"success\";\n showOutlineBorder?: boolean;\n size?: \"sm\" | \"md\";\n notSwitchedOff?: boolean;\n preventToggle?: boolean;\n subtitle?: string;\n hasInlineText?: boolean;\n inlineTextTranslations?: {\n enabled: string;\n disabled: string;\n };\n InternalIcon?: JSX.Element;\n onChange?: (isChecked: boolean) => void;\n};\n\ntype InputHTMLProps = Omit<React.ComponentPropsWithoutRef<\"input\">, keyof ToggleSpecificProps>;\n\nexport type ToggleProps = ToggleSpecificProps & InputHTMLProps;\n\nexport type ToggleSwitchHandlers = {\n toggle: () => void;\n};\n\nconst ToggleSwitch: React.ForwardRefRenderFunction<ToggleSwitchHandlers, ToggleProps> = (\n {\n id,\n labelBefore,\n labelAfter,\n description,\n labelledById,\n defaultChecked = false,\n preventToggle = false,\n isDisabled = false,\n required = false,\n hasInlineText = false,\n inlineTextTranslations = { enabled: \"Enabled\", disabled: \"Disabled\" },\n variant = \"primary\",\n showOutlineBorder = false,\n notSwitchedOff = false,\n size = \"sm\",\n subtitle = \"\",\n tooltip,\n InternalIcon,\n onChange,\n ...rest\n },\n ref,\n) => {\n const [isChecked, setIsChecked] = useState(defaultChecked);\n const hasDescription = Boolean(description);\n\n useEffect(() => {\n setIsChecked(defaultChecked);\n }, [defaultChecked]);\n\n const handleToggle = (\n e: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>,\n ): void => {\n e.stopPropagation();\n\n if (isDisabled) return;\n\n if (!preventToggle) {\n setIsChecked((prev) => {\n const newValue = !prev;\n onChange?.(newValue);\n return newValue;\n });\n } else {\n onChange?.(isChecked);\n }\n };\n\n useImperativeHandle(ref, () => ({\n toggle: () => setIsChecked((prev) => !prev),\n }));\n\n return (\n <div\n id={id}\n tabIndex={0}\n onKeyDown={(e: React.KeyboardEvent<HTMLDivElement>) => e.key === \"Enter\" && handleToggle(e)}\n css={(theme): SerializedStyles =>\n ToggleContainer(theme, {\n isChecked,\n isDisabled,\n hasDescription,\n notSwitchedOff,\n showOutlineBorder,\n variant,\n size,\n })\n }\n data-testid={id}\n data-checked={isChecked}\n aria-label={tooltip}\n {...rest}\n >\n <div className=\"toggle-switch__container\">\n {labelBefore && (\n <ToggleLabel\n label={labelBefore}\n position=\"before\"\n description={description}\n tooltip={tooltip}\n notSwitchedOff={notSwitchedOff}\n hasDescription={hasDescription}\n onClick={handleToggle}\n />\n )}\n\n <ToggleSwitchCore\n isChecked={isChecked}\n variant={variant}\n size={size}\n hasInlineText={hasInlineText}\n inlineTextTranslations={inlineTextTranslations}\n InternalIcon={InternalIcon}\n labelledById={labelledById}\n onClick={handleToggle}\n />\n\n {labelAfter && (\n <ToggleLabel\n label={labelAfter}\n position=\"after\"\n description={description}\n tooltip={tooltip}\n required={required}\n notSwitchedOff={notSwitchedOff}\n hasDescription={hasDescription}\n onClick={handleToggle}\n />\n )}\n </div>\n\n {subtitle && (\n <div className=\"toggle-switch__subtitle\">\n <Text fontSize=\"sm\">{subtitle}</Text>\n </div>\n )}\n </div>\n );\n};\n\nexport default forwardRef(ToggleSwitch);\n"],"names":["ToggleSwitch","_ref","ref","id","labelBefore","labelAfter","description","labelledById","_ref$defaultChecked","defaultChecked","_ref$preventToggle","preventToggle","_ref$isDisabled","isDisabled","_ref$required","required","_ref$hasInlineText","hasInlineText","_ref$inlineTextTransl","inlineTextTranslations","enabled","disabled","_ref$variant","variant","_ref$showOutlineBorde","showOutlineBorder","_ref$notSwitchedOff","notSwitchedOff","_ref$size","size","_ref$subtitle","subtitle","tooltip","InternalIcon","onChange","rest","_objectWithoutProperties","_excluded","_useState","useState","_useState2","_slicedToArray","isChecked","setIsChecked","hasDescription","Boolean","useEffect","handleToggle","e","stopPropagation","prev","newValue","useImperativeHandle","toggle","___EmotionJSX","_extends","tabIndex","onKeyDown","key","css","theme","ToggleContainer","className","ToggleLabel","label","position","onClick","ToggleSwitchCore","Text","fontSize","forwardRef"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ToggleSwitch.js","sources":["../../../../../../src/components/FormElements/ToggleSwitch/ToggleSwitch.tsx"],"sourcesContent":["import React, { useState, useEffect, useImperativeHandle, forwardRef } from \"react\";\nimport { SerializedStyles } from \"@emotion/utils\";\nimport { Text } from \"../../../\";\nimport ToggleLabel from \"./ToggleLabel\";\nimport ToggleSwitchCore from \"./ToggleSwitchCore\";\nimport { ToggleContainer } from \"./styles\";\n\ntype ToggleSpecificProps = {\n id: string;\n labelBefore?: string;\n labelAfter?: string;\n defaultChecked?: boolean;\n description?: string;\n labelledById?: string;\n isDisabled?: boolean;\n required?: boolean;\n tooltip?: string;\n variant?: \"primary\" | \"success\";\n showOutlineBorder?: boolean;\n size?: \"sm\" | \"md\";\n notSwitchedOff?: boolean;\n preventToggle?: boolean;\n subtitle?: string;\n hasInlineText?: boolean;\n inlineTextTranslations?: {\n enabled: string;\n disabled: string;\n };\n InternalIcon?: JSX.Element;\n onChange?: (isChecked: boolean) => void;\n};\n\ntype InputHTMLProps = Omit<React.ComponentPropsWithoutRef<\"input\">, keyof ToggleSpecificProps>;\n\nexport type ToggleProps = ToggleSpecificProps & InputHTMLProps;\n\nexport type ToggleSwitchHandlers = {\n toggle: () => void;\n};\n\nconst ToggleSwitch: React.ForwardRefRenderFunction<ToggleSwitchHandlers, ToggleProps> = (\n {\n id,\n labelBefore,\n labelAfter,\n description,\n labelledById,\n defaultChecked = false,\n preventToggle = false,\n isDisabled = false,\n required = false,\n hasInlineText = false,\n inlineTextTranslations = { enabled: \"Enabled\", disabled: \"Disabled\" },\n variant = \"primary\",\n showOutlineBorder = false,\n notSwitchedOff = false,\n size = \"sm\",\n subtitle = \"\",\n tooltip,\n InternalIcon,\n onChange,\n ...rest\n },\n ref,\n) => {\n const [isChecked, setIsChecked] = useState(defaultChecked);\n const hasDescription = Boolean(description);\n\n useEffect(() => {\n setIsChecked(defaultChecked);\n }, [defaultChecked]);\n\n const handleToggle = (\n e: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>,\n ): void => {\n e.stopPropagation();\n\n if (isDisabled) return;\n\n if (!preventToggle) {\n setIsChecked((prev) => {\n const newValue = !prev;\n onChange?.(newValue);\n return newValue;\n });\n } else {\n onChange?.(isChecked);\n }\n };\n\n useImperativeHandle(ref, () => ({\n toggle: () => setIsChecked((prev) => !prev),\n }));\n\n return (\n <div\n id={id}\n tabIndex={0}\n onKeyDown={(e: React.KeyboardEvent<HTMLDivElement>) => e.key === \"Enter\" && handleToggle(e)}\n css={(theme): SerializedStyles =>\n ToggleContainer(theme, {\n isChecked,\n isDisabled,\n hasDescription,\n notSwitchedOff,\n showOutlineBorder,\n variant,\n size,\n })\n }\n data-testid={id}\n data-checked={isChecked}\n aria-label={tooltip}\n {...rest}\n >\n <div className=\"toggle-switch__container\">\n {labelBefore && (\n <ToggleLabel\n label={labelBefore}\n position=\"before\"\n description={description}\n tooltip={tooltip}\n notSwitchedOff={notSwitchedOff}\n hasDescription={hasDescription}\n onClick={handleToggle}\n />\n )}\n\n <ToggleSwitchCore\n isChecked={isChecked}\n variant={variant}\n size={size}\n hasInlineText={hasInlineText}\n inlineTextTranslations={inlineTextTranslations}\n InternalIcon={InternalIcon}\n labelledById={labelledById}\n onClick={handleToggle}\n />\n\n {labelAfter && (\n <ToggleLabel\n label={labelAfter}\n position=\"after\"\n description={description}\n tooltip={tooltip}\n required={required}\n notSwitchedOff={notSwitchedOff}\n hasDescription={hasDescription}\n onClick={handleToggle}\n />\n )}\n </div>\n\n {subtitle && (\n <div className=\"toggle-switch__subtitle\">\n <Text fontSize=\"sm\">{subtitle}</Text>\n </div>\n )}\n </div>\n );\n};\n\nexport default forwardRef(ToggleSwitch);\n"],"names":["ToggleSwitch","_ref","ref","id","labelBefore","labelAfter","description","labelledById","_ref$defaultChecked","defaultChecked","_ref$preventToggle","preventToggle","_ref$isDisabled","isDisabled","_ref$required","required","_ref$hasInlineText","hasInlineText","_ref$inlineTextTransl","inlineTextTranslations","enabled","disabled","_ref$variant","variant","_ref$showOutlineBorde","showOutlineBorder","_ref$notSwitchedOff","notSwitchedOff","_ref$size","size","_ref$subtitle","subtitle","tooltip","InternalIcon","onChange","rest","_objectWithoutProperties","_excluded","_useState","useState","_useState2","_slicedToArray","isChecked","setIsChecked","hasDescription","Boolean","useEffect","handleToggle","e","stopPropagation","prev","newValue","useImperativeHandle","toggle","___EmotionJSX","_extends","tabIndex","onKeyDown","key","css","theme","ToggleContainer","className","ToggleLabel","label","position","onClick","ToggleSwitchCore","Text","fontSize","forwardRef"],"mappings":"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"}
|
|
@@ -50,6 +50,7 @@ import '../../../../node_modules/core-js/modules/web.set-timeout.js';
|
|
|
50
50
|
import '../Input/styles.js';
|
|
51
51
|
import '../../../../node_modules/core-js/modules/es.regexp.exec.js';
|
|
52
52
|
import '../../../../node_modules/core-js/modules/es.array.some.js';
|
|
53
|
+
import '../../SegmentedButtons/styles.js';
|
|
53
54
|
import '../../Toast/ToastNotifications.js';
|
|
54
55
|
import '../../../../node_modules/core-js/modules/es.function.name.js';
|
|
55
56
|
import '../../../theme/default/config/button.js';
|
|
@@ -60,6 +61,7 @@ import '../../../theme/default/config/progressBar.js';
|
|
|
60
61
|
import '../../../theme/default/config/table.js';
|
|
61
62
|
import '../../../theme/default/config/tag.js';
|
|
62
63
|
import '../../../theme/default/config/pagination.js';
|
|
64
|
+
import '../../../theme/default/config/segmentedButtons.js';
|
|
63
65
|
import '../../../theme/default/config/statusTag.js';
|
|
64
66
|
import '../../../../node_modules/core-js/modules/es.symbol.constructor.js';
|
|
65
67
|
import '../../../../node_modules/core-js/modules/es.symbol.for.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleSwitchCore.js","sources":["../../../../../../src/components/FormElements/ToggleSwitch/ToggleSwitchCore.tsx"],"sourcesContent":["import React from \"react\";\nimport classNames from \"classnames\";\nimport { Text } from \"../../../\";\n\nexport type ToggleSwitchVariant = \"primary\" | \"success\";\nexport type ToggleSwitchSize = \"sm\" | \"md\";\n\ntype ToggleSwitchCoreProps = {\n isChecked: boolean;\n variant: ToggleSwitchVariant;\n size: ToggleSwitchSize;\n hasInlineText?: boolean;\n inlineTextTranslations?: {\n enabled: string;\n disabled: string;\n };\n InternalIcon?: JSX.Element;\n labelledById?: string;\n onClick: (e: React.MouseEvent<HTMLDivElement>) => void;\n};\n\nconst switchClassNames = (customClassName: string, isMedium: boolean, isSuccess: boolean): string =>\n classNames(customClassName, {\n \"toggle-switch__switch--md\": isMedium,\n \"toggle-switch__switch--success\": isSuccess,\n });\n\nconst ToggleSwitchCore: React.FC<ToggleSwitchCoreProps> = ({\n isChecked,\n variant,\n size,\n hasInlineText = false,\n inlineTextTranslations = { enabled: \"Enabled\", disabled: \"Disabled\" },\n InternalIcon,\n labelledById,\n onClick,\n}) => {\n const isMedium = size === \"md\";\n const isSuccess = variant === \"success\";\n const hasIcon = Boolean(InternalIcon);\n\n return (\n <div className=\"toggle-switch__wrapper\">\n <div\n data-testid=\"switch\"\n data-checked={isChecked}\n className={switchClassNames(\"toggle-switch__switch\", isMedium, isSuccess)}\n onClick={onClick}\n role=\"switch\"\n aria-checked={isChecked}\n aria-labelledby={labelledById}\n >\n {hasInlineText && isMedium && (\n <Text fontSize=\"sm\" className=\"toggle-switch__inline-text\">\n {isChecked ? inlineTextTranslations.enabled : inlineTextTranslations.disabled}\n </Text>\n )}\n\n {hasIcon && <div className=\"toggle-switch__icon\">{InternalIcon}</div>}\n <div className={switchClassNames(\"toggle-switch__thumb\", isMedium, isSuccess)} />\n </div>\n </div>\n );\n};\n\nexport default ToggleSwitchCore;\n"],"names":["switchClassNames","customClassName","isMedium","isSuccess","classNames","ToggleSwitchCore","_ref","isChecked","variant","size","_ref$hasInlineText","hasInlineText","_ref$inlineTextTransl","inlineTextTranslations","enabled","disabled","InternalIcon","labelledById","onClick","hasIcon","Boolean","___EmotionJSX","className","role","Text","fontSize"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ToggleSwitchCore.js","sources":["../../../../../../src/components/FormElements/ToggleSwitch/ToggleSwitchCore.tsx"],"sourcesContent":["import React from \"react\";\nimport classNames from \"classnames\";\nimport { Text } from \"../../../\";\n\nexport type ToggleSwitchVariant = \"primary\" | \"success\";\nexport type ToggleSwitchSize = \"sm\" | \"md\";\n\ntype ToggleSwitchCoreProps = {\n isChecked: boolean;\n variant: ToggleSwitchVariant;\n size: ToggleSwitchSize;\n hasInlineText?: boolean;\n inlineTextTranslations?: {\n enabled: string;\n disabled: string;\n };\n InternalIcon?: JSX.Element;\n labelledById?: string;\n onClick: (e: React.MouseEvent<HTMLDivElement>) => void;\n};\n\nconst switchClassNames = (customClassName: string, isMedium: boolean, isSuccess: boolean): string =>\n classNames(customClassName, {\n \"toggle-switch__switch--md\": isMedium,\n \"toggle-switch__switch--success\": isSuccess,\n });\n\nconst ToggleSwitchCore: React.FC<ToggleSwitchCoreProps> = ({\n isChecked,\n variant,\n size,\n hasInlineText = false,\n inlineTextTranslations = { enabled: \"Enabled\", disabled: \"Disabled\" },\n InternalIcon,\n labelledById,\n onClick,\n}) => {\n const isMedium = size === \"md\";\n const isSuccess = variant === \"success\";\n const hasIcon = Boolean(InternalIcon);\n\n return (\n <div className=\"toggle-switch__wrapper\">\n <div\n data-testid=\"switch\"\n data-checked={isChecked}\n className={switchClassNames(\"toggle-switch__switch\", isMedium, isSuccess)}\n onClick={onClick}\n role=\"switch\"\n aria-checked={isChecked}\n aria-labelledby={labelledById}\n >\n {hasInlineText && isMedium && (\n <Text fontSize=\"sm\" className=\"toggle-switch__inline-text\">\n {isChecked ? inlineTextTranslations.enabled : inlineTextTranslations.disabled}\n </Text>\n )}\n\n {hasIcon && <div className=\"toggle-switch__icon\">{InternalIcon}</div>}\n <div className={switchClassNames(\"toggle-switch__thumb\", isMedium, isSuccess)} />\n </div>\n </div>\n );\n};\n\nexport default ToggleSwitchCore;\n"],"names":["switchClassNames","customClassName","isMedium","isSuccess","classNames","ToggleSwitchCore","_ref","isChecked","variant","size","_ref$hasInlineText","hasInlineText","_ref$inlineTextTransl","inlineTextTranslations","enabled","disabled","InternalIcon","labelledById","onClick","hasIcon","Boolean","___EmotionJSX","className","role","Text","fontSize"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAIC,eAAuB,EAAEC,QAAiB,EAAEC,SAAkB,EAAA;EAAA,OACtFC,UAAU,CAACH,eAAe,EAAE;AAC1B,IAAA,2BAA2B,EAAEC,QAAQ;AACrC,IAAA,gCAAgC,EAAEC,SAAAA;AACpC,GAAC,CAAC,CAAA;AAAA,CAAA,CAAA;AAEJ,IAAME,gBAAiD,GAAG,SAApDA,gBAAiDA,CAAAC,IAAA,EASjD;AAAA,EAAA,IARJC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACTC,OAAO,GAAAF,IAAA,CAAPE,OAAO;IACPC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IAAAC,kBAAA,GAAAJ,IAAA,CACJK,aAAa;AAAbA,IAAAA,aAAa,GAAAD,kBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,kBAAA;IAAAE,qBAAA,GAAAN,IAAA,CACrBO,sBAAsB;IAAtBA,sBAAsB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA;AAAEE,MAAAA,OAAO,EAAE,SAAS;AAAEC,MAAAA,QAAQ,EAAE,UAAA;AAAW,KAAC,GAAAH,qBAAA;IACrEI,YAAY,GAAAV,IAAA,CAAZU,YAAY;IACZC,YAAY,GAAAX,IAAA,CAAZW,YAAY;IACZC,OAAO,GAAAZ,IAAA,CAAPY,OAAO,CAAA;AAEP,EAAA,IAAMhB,QAAQ,GAAGO,IAAI,KAAK,IAAI,CAAA;AAC9B,EAAA,IAAMN,SAAS,GAAGK,OAAO,KAAK,SAAS,CAAA;AACvC,EAAA,IAAMW,OAAO,GAAGC,OAAO,CAACJ,YAAY,CAAC,CAAA;AAErC,EAAA,OACEK,GAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,wBAAA;AAAwB,GAAA,EACrCD,GAAA,CAAA,KAAA,EAAA;AACE,IAAA,aAAA,EAAY,QAAQ;AACpB,IAAA,cAAA,EAAcd,SAAU;IACxBe,SAAS,EAAEtB,gBAAgB,CAAC,uBAAuB,EAAEE,QAAQ,EAAEC,SAAS,CAAE;AAC1Ee,IAAAA,OAAO,EAAEA,OAAQ;AACjBK,IAAAA,IAAI,EAAC,QAAQ;AACb,IAAA,cAAA,EAAchB,SAAU;IACxB,iBAAiBU,EAAAA,YAAAA;AAAa,GAAA,EAE7BN,aAAa,IAAIT,QAAQ,IACxBmB,GAAA,CAACG,IAAI,EAAA;AAACC,IAAAA,QAAQ,EAAC,IAAI;AAACH,IAAAA,SAAS,EAAC,4BAAA;AAA4B,GAAA,EACvDf,SAAS,GAAGM,sBAAsB,CAACC,OAAO,GAAGD,sBAAsB,CAACE,QACjE,CACP,EAEAI,OAAO,IAAIE,GAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,qBAAA;GAAuBN,EAAAA,YAAkB,CAAC,EACrEK,GAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAEtB,gBAAgB,CAAC,sBAAsB,EAAEE,QAAQ,EAAEC,SAAS,CAAA;GAAI,CAC7E,CACF,CAAC,CAAA;AAEV;;;;"}
|
|
@@ -18,6 +18,7 @@ import '../../theme/default/config/progressBar.js';
|
|
|
18
18
|
import '../../theme/default/config/table.js';
|
|
19
19
|
import '../../theme/default/config/tag.js';
|
|
20
20
|
import '../../theme/default/config/pagination.js';
|
|
21
|
+
import '../../theme/default/config/segmentedButtons.js';
|
|
21
22
|
import '../../theme/default/config/statusTag.js';
|
|
22
23
|
|
|
23
24
|
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sources":["../../../../../src/components/Modal/styles.ts"],"sourcesContent":["import { css, Theme, SerializedStyles } from \"@emotion/react\";\nimport { Size } from \"./Modal\";\nimport { mq } from \"@theme/utils/breakpoints\";\nimport { modal } from \"@theme/default/config\";\n\nconst widthDimensions = {\n sm: \"32rem\",\n md: \"48rem\",\n lg: \"64rem\",\n fullscreen: \"100%\",\n};\n\nexport const modalContent = css`\n max-height: calc(90vh - 150px);\n overflow-y: auto;\n padding: 1.5rem;\n`;\n\nexport const modalHeader = ({ modal }: Theme): SerializedStyles => {\n return css`\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 1.25rem;\n border-bottom: 1px solid ${modal.border};\n\n .close-btn {\n height: 32px;\n background: transparent;\n border: 0;\n margin: 0;\n padding: 0;\n\n svg {\n color: ${modal.color};\n\n &:hover {\n color: ${modal.iconHover};\n }\n }\n }\n `;\n};\n\nexport const modalFooter = ({ modal }: Theme): SerializedStyles => {\n return css`\n padding: 1.25rem;\n border-top: 1px solid ${modal.border};\n `;\n};\n\n// plain styles as string\nexport const portalStyles = (size: Size): SerializedStyles => {\n return css`\n .overlay-base {\n position: fixed;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n background: rgba(0, 0, 0, 0.7);\n opacity: 0;\n z-index: 9999;\n transition: opacity 0.2s ease-in-out;\n\n &.overlay-before {\n opacity: 0;\n }\n }\n\n .overlay-after {\n opacity: 1;\n }\n\n .content-after {\n background-color: ${modal.content};\n height: 100%;\n width: 100%;\n border-radius: 0;\n\n ${mq[\"md\"]} {\n height: auto;\n border-radius: 5px;\n width: ${widthDimensions[size]};\n max-width: 90%;\n }\n\n ${size === \"fullscreen\" &&\n `\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n `}\n }\n `;\n};\n"],"names":["widthDimensions","sm","md","lg","fullscreen","modalContent","process","env","NODE_ENV","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","modalHeader","_ref","modal","css","border","color","iconHover","modalFooter","_ref2","portalStyles","size","content","mq"],"mappings":"
|
|
1
|
+
{"version":3,"file":"styles.js","sources":["../../../../../src/components/Modal/styles.ts"],"sourcesContent":["import { css, Theme, SerializedStyles } from \"@emotion/react\";\nimport { Size } from \"./Modal\";\nimport { mq } from \"@theme/utils/breakpoints\";\nimport { modal } from \"@theme/default/config\";\n\nconst widthDimensions = {\n sm: \"32rem\",\n md: \"48rem\",\n lg: \"64rem\",\n fullscreen: \"100%\",\n};\n\nexport const modalContent = css`\n max-height: calc(90vh - 150px);\n overflow-y: auto;\n padding: 1.5rem;\n`;\n\nexport const modalHeader = ({ modal }: Theme): SerializedStyles => {\n return css`\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 1.25rem;\n border-bottom: 1px solid ${modal.border};\n\n .close-btn {\n height: 32px;\n background: transparent;\n border: 0;\n margin: 0;\n padding: 0;\n\n svg {\n color: ${modal.color};\n\n &:hover {\n color: ${modal.iconHover};\n }\n }\n }\n `;\n};\n\nexport const modalFooter = ({ modal }: Theme): SerializedStyles => {\n return css`\n padding: 1.25rem;\n border-top: 1px solid ${modal.border};\n `;\n};\n\n// plain styles as string\nexport const portalStyles = (size: Size): SerializedStyles => {\n return css`\n .overlay-base {\n position: fixed;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n background: rgba(0, 0, 0, 0.7);\n opacity: 0;\n z-index: 9999;\n transition: opacity 0.2s ease-in-out;\n\n &.overlay-before {\n opacity: 0;\n }\n }\n\n .overlay-after {\n opacity: 1;\n }\n\n .content-after {\n background-color: ${modal.content};\n height: 100%;\n width: 100%;\n border-radius: 0;\n\n ${mq[\"md\"]} {\n height: auto;\n border-radius: 5px;\n width: ${widthDimensions[size]};\n max-width: 90%;\n }\n\n ${size === \"fullscreen\" &&\n `\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n `}\n }\n `;\n};\n"],"names":["widthDimensions","sm","md","lg","fullscreen","modalContent","process","env","NODE_ENV","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","modalHeader","_ref","modal","css","border","color","iconHover","modalFooter","_ref2","portalStyles","size","content","mq"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAKA,IAAMA,eAAe,GAAG;AACtBC,EAAAA,EAAE,EAAE,OAAO;AACXC,EAAAA,EAAE,EAAE,OAAO;AACXC,EAAAA,EAAE,EAAE,OAAO;AACXC,EAAAA,UAAU,EAAE,MAAA;AACd,CAAC,CAAA;IAEYC,YAAY,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA;EAAAC,IAAA,EAAA,QAAA;EAAAC,MAAA,EAAA,8DAAA;AAAA,CAAA,GAAA;EAAAD,IAAA,EAAA,sBAAA;EAAAC,MAAA,EAAA,kFAAA;EAAAC,GAAA,EAAA,i8FAAA;AAAAC,EAAAA,QAAA,EAAAC,gCAAAA;AAAA,EAIxB;IAEYC,WAAW,GAAG,SAAdA,WAAWA,CAAAC,IAAA,EAA2C;AAAA,EAAA,IAArCC,KAAK,GAAAD,IAAA,CAALC,KAAK,CAAA;AACjC,EAAA,kCAAOC,GAAG,CAAA,wGAAA,EAKmBD,KAAK,CAACE,MAAM,EAAA,uFAAA,EAU1BF,KAAK,CAACG,KAAK,EAAA,iBAAA,EAGTH,KAAK,CAACI,SAAS,EAAAd,MAAAA,IAAAA,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAAF,YAAAA,GAAAA,EAAAA,GAAAA,qBAAAA,CAAAA,EAAAA,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAAF,YAAAA,GAAAA,EAAAA,GAAAA,i8FAAAA,EAAAA,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,qBAAA,CAAA,CAAA;AAKlC,EAAC;IAEYa,WAAW,GAAG,SAAdA,WAAWA,CAAAC,KAAA,EAA2C;AAAA,EAAA,IAArCN,KAAK,GAAAM,KAAA,CAALN,KAAK,CAAA;EACjC,kCAAOC,GAAG,0CAEgBD,KAAK,CAACE,MAAM,EAAAZ,GAAAA,IAAAA,OAAA,CAAAC,GAAA,CAAAC,QAAA,iDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,49FAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,qBAAA,CAAA,CAAA;AAExC,EAAC;;AAED;IACae,YAAY,GAAG,SAAfA,YAAYA,CAAIC,IAAU,EAAuB;AAC5D,EAAA,kCAAOP,GAAG,CAyBcD,oSAAAA,EAAAA,KAAK,CAACS,OAAO,8CAY/BD,IAAI,KAAK,YAAY,IAAA,oGAKxB,OAZGE,EAAE,CAAC,IAAI,CAAC,2CAGC1B,eAAe,CAACwB,IAAI,CAAC,yBAAAlB,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAAF,YAAAA,GAAAA,EAAAA,GAAAA,sBAAAA,CAAAA,EAAAA,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,i8FAAA,EAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,sBAAA,CAAA,CAAA;AAYtC;;;;"}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
|
|
2
|
+
/**
|
|
3
|
+
* @license
|
|
4
|
+
* author: epignosis front-end team
|
|
5
|
+
* @epignosis_llc/gnosis.js v6.6.16
|
|
6
|
+
* Released under the MIT license.
|
|
7
|
+
*/
|
|
8
|
+
|
|
9
|
+
import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
|
|
10
|
+
import '../../../node_modules/core-js/modules/es.array.map.js';
|
|
11
|
+
import 'react';
|
|
12
|
+
import classNames from '../../../node_modules/classnames/index.js';
|
|
13
|
+
import { segmentedButton, container } from './styles.js';
|
|
14
|
+
import { createElement as jsx } from '../../../node_modules/@emotion/react/dist/emotion-react.browser.esm.js';
|
|
15
|
+
|
|
16
|
+
var _excluded = ["options", "value", "onChange", "className", "ariaLabel"];
|
|
17
|
+
var getButtonClassName = function getButtonClassName(isSelected, showOnlyIcon) {
|
|
18
|
+
return classNames("segmented-buttons__button", {
|
|
19
|
+
"segmented-buttons__button--selected": isSelected,
|
|
20
|
+
"segmented-buttons__button--icon-only": showOnlyIcon
|
|
21
|
+
});
|
|
22
|
+
};
|
|
23
|
+
var SegmentedButtons = function SegmentedButtons(_ref) {
|
|
24
|
+
var options = _ref.options,
|
|
25
|
+
value = _ref.value,
|
|
26
|
+
onChange = _ref.onChange,
|
|
27
|
+
className = _ref.className,
|
|
28
|
+
ariaLabel = _ref.ariaLabel,
|
|
29
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
30
|
+
return jsx("div", _extends({
|
|
31
|
+
role: "group",
|
|
32
|
+
"aria-label": ariaLabel,
|
|
33
|
+
className: classNames("segmented-buttons", className),
|
|
34
|
+
css: container
|
|
35
|
+
}, rest), options.map(function (option, index) {
|
|
36
|
+
var Icon = option.icon;
|
|
37
|
+
var isSelected = option.value === value;
|
|
38
|
+
var hasLabel = Boolean(option.label);
|
|
39
|
+
var hasIcon = Boolean(Icon);
|
|
40
|
+
var showOnlyIcon = hasIcon && !hasLabel;
|
|
41
|
+
return jsx("button", {
|
|
42
|
+
key: option.value,
|
|
43
|
+
type: "button",
|
|
44
|
+
id: "segmented-button-".concat(index),
|
|
45
|
+
"data-testid": "segmented-buttons__button-".concat(index),
|
|
46
|
+
css: function css(theme) {
|
|
47
|
+
return segmentedButton(theme, {
|
|
48
|
+
isSelected: isSelected,
|
|
49
|
+
isFirst: index === 0,
|
|
50
|
+
isLast: index === options.length - 1,
|
|
51
|
+
hasLabel: hasLabel,
|
|
52
|
+
hasIcon: hasIcon
|
|
53
|
+
});
|
|
54
|
+
},
|
|
55
|
+
className: getButtonClassName(isSelected, showOnlyIcon),
|
|
56
|
+
disabled: option.disabled,
|
|
57
|
+
"aria-pressed": isSelected,
|
|
58
|
+
"aria-label": showOnlyIcon && typeof option.value === "string" ? option.value : undefined,
|
|
59
|
+
onClick: function onClick() {
|
|
60
|
+
return onChange(option.value);
|
|
61
|
+
}
|
|
62
|
+
}, Icon && jsx(Icon, {
|
|
63
|
+
className: "segmented-buttons__icon",
|
|
64
|
+
"aria-hidden": "true",
|
|
65
|
+
height: 16
|
|
66
|
+
}), hasLabel && jsx("span", {
|
|
67
|
+
className: "segmented-buttons__label"
|
|
68
|
+
}, option.label));
|
|
69
|
+
}));
|
|
70
|
+
};
|
|
71
|
+
|
|
72
|
+
export { SegmentedButtons as default };
|
|
73
|
+
//# sourceMappingURL=SegmentedButtons.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SegmentedButtons.js","sources":["../../../../../src/components/SegmentedButtons/SegmentedButtons.tsx"],"sourcesContent":["import React, { FC, ReactNode } from \"react\";\nimport { SerializedStyles } from \"@emotion/react\";\nimport classNames from \"classnames\";\nimport { container, segmentedButton } from \"./styles\";\nimport { IconType } from \"types/common\";\n\nexport type SegmentedButtonOption = {\n value: string;\n label?: ReactNode;\n icon?: IconType;\n disabled?: boolean;\n};\n\nexport type SegmentedButtonsProps = Omit<\n React.HTMLAttributes<HTMLDivElement>,\n \"onChange\" | \"role\"\n> & {\n options: SegmentedButtonOption[];\n value: string;\n onChange: (value: string) => void;\n ariaLabel?: string;\n};\n\nconst getButtonClassName = (isSelected: boolean, showOnlyIcon: boolean): string =>\n classNames(\"segmented-buttons__button\", {\n \"segmented-buttons__button--selected\": isSelected,\n \"segmented-buttons__button--icon-only\": showOnlyIcon,\n });\n\nconst SegmentedButtons: FC<SegmentedButtonsProps> = ({\n options,\n value,\n onChange,\n className,\n ariaLabel,\n ...rest\n}) => {\n return (\n <div\n role=\"group\"\n aria-label={ariaLabel}\n className={classNames(\"segmented-buttons\", className)}\n css={container}\n {...rest}\n >\n {options.map((option, index) => {\n const Icon = option.icon;\n const isSelected = option.value === value;\n const hasLabel = Boolean(option.label);\n const hasIcon = Boolean(Icon);\n const showOnlyIcon = hasIcon && !hasLabel;\n\n return (\n <button\n key={option.value}\n type=\"button\"\n id={`segmented-button-${index}`}\n data-testid={`segmented-buttons__button-${index}`}\n css={(theme): SerializedStyles =>\n segmentedButton(theme, {\n isSelected,\n isFirst: index === 0,\n isLast: index === options.length - 1,\n hasLabel,\n hasIcon,\n })\n }\n className={getButtonClassName(isSelected, showOnlyIcon)}\n disabled={option.disabled}\n aria-pressed={isSelected}\n aria-label={showOnlyIcon && typeof option.value === \"string\" ? option.value : undefined}\n onClick={(): void => onChange(option.value)}\n >\n {Icon && <Icon className=\"segmented-buttons__icon\" aria-hidden=\"true\" height={16} />}\n {hasLabel && <span className=\"segmented-buttons__label\">{option.label}</span>}\n </button>\n );\n })}\n </div>\n );\n};\n\nexport default SegmentedButtons;\n"],"names":["getButtonClassName","isSelected","showOnlyIcon","classNames","SegmentedButtons","_ref","options","value","onChange","className","ariaLabel","rest","_objectWithoutProperties","_excluded","___EmotionJSX","_extends","role","css","container","map","option","index","Icon","icon","hasLabel","Boolean","label","hasIcon","key","type","id","concat","theme","segmentedButton","isFirst","isLast","length","disabled","undefined","onClick","height"],"mappings":"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"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
|
|
2
|
+
/**
|
|
3
|
+
* @license
|
|
4
|
+
* author: epignosis front-end team
|
|
5
|
+
* @epignosis_llc/gnosis.js v6.6.16
|
|
6
|
+
* Released under the MIT license.
|
|
7
|
+
*/
|
|
8
|
+
|
|
9
|
+
import { css } from '../../../node_modules/@emotion/react/dist/emotion-react.browser.esm.js';
|
|
10
|
+
|
|
11
|
+
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
|
12
|
+
var container = process.env.NODE_ENV === "production" ? {
|
|
13
|
+
name: "8irbms",
|
|
14
|
+
styles: "display:inline-flex;align-items:center"
|
|
15
|
+
} : {
|
|
16
|
+
name: "y2i3w0-container",
|
|
17
|
+
styles: "display:inline-flex;align-items:center;label:container;",
|
|
18
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVNEIiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBUaGVtZSwgU2VyaWFsaXplZFN0eWxlcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuXG50eXBlIFNlZ21lbnRlZEJ1dHRvbkF0dHJzID0ge1xuICBpc1NlbGVjdGVkOiBib29sZWFuO1xuICBpc0ZpcnN0OiBib29sZWFuO1xuICBpc0xhc3Q6IGJvb2xlYW47XG4gIGhhc0xhYmVsOiBib29sZWFuO1xuICBoYXNJY29uOiBib29sZWFuO1xufTtcblxuZXhwb3J0IGNvbnN0IGNvbnRhaW5lciA9IGNzc2BcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5gO1xuXG5leHBvcnQgY29uc3Qgc2VnbWVudGVkQnV0dG9uID0gKFxuICB7IHR5cGVTY2FsZVNpemVzLCBzZWdtZW50ZWRCdXR0b25zIH06IFRoZW1lLFxuICB7IGlzU2VsZWN0ZWQsIGlzRmlyc3QsIGlzTGFzdCwgaGFzTGFiZWwsIGhhc0ljb24gfTogU2VnbWVudGVkQnV0dG9uQXR0cnMsXG4pOiBTZXJpYWxpemVkU3R5bGVzID0+IHtcbiAgY29uc3Qgc3RhdGUgPSBpc1NlbGVjdGVkID8gc2VnbWVudGVkQnV0dG9ucy5hY3RpdmUgOiBzZWdtZW50ZWRCdXR0b25zLmRlZmF1bHQ7XG4gIGNvbnN0IGljb25Pbmx5ID0gaGFzSWNvbiAmJiAhaGFzTGFiZWw7XG4gIGNvbnN0IGljb25BbmRMYWJlbCA9IGhhc0ljb24gJiYgaGFzTGFiZWw7XG5cbiAgY29uc3QgaG9yaXpvbnRhbFBhZGRpbmcgPSBpY29uT25seSA/IFwiMC41cmVtXCIgOiBpY29uQW5kTGFiZWwgPyBcIjAuNzVyZW1cIiA6IFwiMS41cmVtXCI7XG5cbiAgcmV0dXJuIGNzc2BcbiAgICBkaXNwbGF5OiBpbmxpbmUtZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGdhcDogMC41cmVtO1xuICAgIGhlaWdodDogMi41cmVtO1xuICAgIG1pbi13aWR0aDogMi41cmVtO1xuICAgIHBhZGRpbmc6IDAgJHtob3Jpem9udGFsUGFkZGluZ307XG4gICAgYmFja2dyb3VuZDogJHtzdGF0ZS5iYWNrZ3JvdW5kfTtcbiAgICBib3JkZXI6IDFweCBzb2xpZCAke3N0YXRlLmJvcmRlckNvbG9yfTtcbiAgICBib3JkZXItaW5saW5lLXN0YXJ0LXdpZHRoOiAke2lzRmlyc3QgPyBcIjFweFwiIDogXCIwXCJ9O1xuICAgIGJvcmRlci1zdGFydC1zdGFydC1yYWRpdXM6ICR7aXNGaXJzdCA/IFwiNXB4XCIgOiBcIjBcIn07XG4gICAgYm9yZGVyLWVuZC1zdGFydC1yYWRpdXM6ICR7aXNGaXJzdCA/IFwiNXB4XCIgOiBcIjBcIn07XG4gICAgYm9yZGVyLXN0YXJ0LWVuZC1yYWRpdXM6ICR7aXNMYXN0ID8gXCI1cHhcIiA6IFwiMFwifTtcbiAgICBib3JkZXItZW5kLWVuZC1yYWRpdXM6ICR7aXNMYXN0ID8gXCI1cHhcIiA6IFwiMFwifTtcbiAgICBjb2xvcjogJHtzdGF0ZS5jb2xvcn07XG4gICAgZm9udC1mYW1pbHk6IGluaGVyaXQ7XG4gICAgZm9udC1zaXplOiAke3R5cGVTY2FsZVNpemVzLnNtfTtcbiAgICBmb250LXdlaWdodDogNzAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxO1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICB0cmFuc2l0aW9uOiBiYWNrZ3JvdW5kLWNvbG9yIDAuMnMgZWFzZS1pbiwgY29sb3IgMC4ycyBlYXNlLWluLCBib3JkZXItY29sb3IgMC4ycyBlYXNlLWluO1xuXG4gICAgLnNlZ21lbnRlZC1idXR0b25zX19pY29uIHtcbiAgICAgIGNvbG9yOiBjdXJyZW50Q29sb3I7XG4gICAgICBmbGV4LXNocmluazogMDtcbiAgICB9XG5cbiAgICAmOmhvdmVyOm5vdCg6ZGlzYWJsZWQpOm5vdCguc2VnbWVudGVkLWJ1dHRvbnNfX2J1dHRvbi0tc2VsZWN0ZWQpIHtcbiAgICAgIGJhY2tncm91bmQ6ICR7c2VnbWVudGVkQnV0dG9ucy5ob3Zlci5iYWNrZ3JvdW5kfTtcbiAgICAgIGJvcmRlci1jb2xvcjogJHtzZWdtZW50ZWRCdXR0b25zLmhvdmVyLmJvcmRlckNvbG9yfTtcbiAgICAgIGNvbG9yOiAke3NlZ21lbnRlZEJ1dHRvbnMuaG92ZXIuY29sb3J9O1xuICAgIH1cblxuICAgICY6Zm9jdXMtdmlzaWJsZSB7XG4gICAgICBvdXRsaW5lOiAxcHggc29saWQgJHtzZWdtZW50ZWRCdXR0b25zLmhvdmVyLmJvcmRlckNvbG9yfTtcbiAgICAgIG91dGxpbmUtb2Zmc2V0OiAycHg7XG4gICAgfVxuXG4gICAgJjpkaXNhYmxlZCB7XG4gICAgICBiYWNrZ3JvdW5kOiAke3NlZ21lbnRlZEJ1dHRvbnMuZGlzYWJsZWQuYmFja2dyb3VuZH07XG4gICAgICBib3JkZXItY29sb3I6ICR7c2VnbWVudGVkQnV0dG9ucy5kaXNhYmxlZC5ib3JkZXJDb2xvcn07XG4gICAgICBjb2xvcjogJHtzZWdtZW50ZWRCdXR0b25zLmRpc2FibGVkLmNvbG9yfTtcbiAgICAgIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gICAgfVxuICBgO1xufTtcbiJdfQ== */",
|
|
19
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
20
|
+
};
|
|
21
|
+
var segmentedButton = function segmentedButton(_ref, _ref2) {
|
|
22
|
+
var typeScaleSizes = _ref.typeScaleSizes,
|
|
23
|
+
segmentedButtons = _ref.segmentedButtons;
|
|
24
|
+
var isSelected = _ref2.isSelected,
|
|
25
|
+
isFirst = _ref2.isFirst,
|
|
26
|
+
isLast = _ref2.isLast,
|
|
27
|
+
hasLabel = _ref2.hasLabel,
|
|
28
|
+
hasIcon = _ref2.hasIcon;
|
|
29
|
+
var state = isSelected ? segmentedButtons.active : segmentedButtons["default"];
|
|
30
|
+
var iconOnly = hasIcon && !hasLabel;
|
|
31
|
+
var iconAndLabel = hasIcon && hasLabel;
|
|
32
|
+
var horizontalPadding = iconOnly ? "0.5rem" : iconAndLabel ? "0.75rem" : "1.5rem";
|
|
33
|
+
return /*#__PURE__*/ /*#__PURE__*/css("display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;height:2.5rem;min-width:2.5rem;padding:0 ", horizontalPadding, ";background:", state.background, ";border:1px solid ", state.borderColor, ";border-inline-start-width:", isFirst ? "1px" : "0", ";border-start-start-radius:", isFirst ? "5px" : "0", ";border-end-start-radius:", isFirst ? "5px" : "0", ";border-start-end-radius:", isLast ? "5px" : "0", ";border-end-end-radius:", isLast ? "5px" : "0", ";color:", state.color, ";font-family:inherit;font-size:", typeScaleSizes.sm, ";font-weight:700;line-height:1;cursor:pointer;transition:background-color 0.2s ease-in,color 0.2s ease-in,border-color 0.2s ease-in;.segmented-buttons__icon{color:currentColor;flex-shrink:0;}&:hover:not(:disabled):not(.segmented-buttons__button--selected){background:", segmentedButtons.hover.background, ";border-color:", segmentedButtons.hover.borderColor, ";color:", segmentedButtons.hover.color, ";}&:focus-visible{outline:1px solid ", segmentedButtons.hover.borderColor, ";outline-offset:2px;}&:disabled{background:", segmentedButtons.disabled.background, ";border-color:", segmentedButtons.disabled.borderColor, ";color:", segmentedButtons.disabled.color, ";cursor:not-allowed;}" + (process.env.NODE_ENV === "production" ? "" : ";label:segmentedButton;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5QlkiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBUaGVtZSwgU2VyaWFsaXplZFN0eWxlcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuXG50eXBlIFNlZ21lbnRlZEJ1dHRvbkF0dHJzID0ge1xuICBpc1NlbGVjdGVkOiBib29sZWFuO1xuICBpc0ZpcnN0OiBib29sZWFuO1xuICBpc0xhc3Q6IGJvb2xlYW47XG4gIGhhc0xhYmVsOiBib29sZWFuO1xuICBoYXNJY29uOiBib29sZWFuO1xufTtcblxuZXhwb3J0IGNvbnN0IGNvbnRhaW5lciA9IGNzc2BcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5gO1xuXG5leHBvcnQgY29uc3Qgc2VnbWVudGVkQnV0dG9uID0gKFxuICB7IHR5cGVTY2FsZVNpemVzLCBzZWdtZW50ZWRCdXR0b25zIH06IFRoZW1lLFxuICB7IGlzU2VsZWN0ZWQsIGlzRmlyc3QsIGlzTGFzdCwgaGFzTGFiZWwsIGhhc0ljb24gfTogU2VnbWVudGVkQnV0dG9uQXR0cnMsXG4pOiBTZXJpYWxpemVkU3R5bGVzID0+IHtcbiAgY29uc3Qgc3RhdGUgPSBpc1NlbGVjdGVkID8gc2VnbWVudGVkQnV0dG9ucy5hY3RpdmUgOiBzZWdtZW50ZWRCdXR0b25zLmRlZmF1bHQ7XG4gIGNvbnN0IGljb25Pbmx5ID0gaGFzSWNvbiAmJiAhaGFzTGFiZWw7XG4gIGNvbnN0IGljb25BbmRMYWJlbCA9IGhhc0ljb24gJiYgaGFzTGFiZWw7XG5cbiAgY29uc3QgaG9yaXpvbnRhbFBhZGRpbmcgPSBpY29uT25seSA/IFwiMC41cmVtXCIgOiBpY29uQW5kTGFiZWwgPyBcIjAuNzVyZW1cIiA6IFwiMS41cmVtXCI7XG5cbiAgcmV0dXJuIGNzc2BcbiAgICBkaXNwbGF5OiBpbmxpbmUtZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGdhcDogMC41cmVtO1xuICAgIGhlaWdodDogMi41cmVtO1xuICAgIG1pbi13aWR0aDogMi41cmVtO1xuICAgIHBhZGRpbmc6IDAgJHtob3Jpem9udGFsUGFkZGluZ307XG4gICAgYmFja2dyb3VuZDogJHtzdGF0ZS5iYWNrZ3JvdW5kfTtcbiAgICBib3JkZXI6IDFweCBzb2xpZCAke3N0YXRlLmJvcmRlckNvbG9yfTtcbiAgICBib3JkZXItaW5saW5lLXN0YXJ0LXdpZHRoOiAke2lzRmlyc3QgPyBcIjFweFwiIDogXCIwXCJ9O1xuICAgIGJvcmRlci1zdGFydC1zdGFydC1yYWRpdXM6ICR7aXNGaXJzdCA/IFwiNXB4XCIgOiBcIjBcIn07XG4gICAgYm9yZGVyLWVuZC1zdGFydC1yYWRpdXM6ICR7aXNGaXJzdCA/IFwiNXB4XCIgOiBcIjBcIn07XG4gICAgYm9yZGVyLXN0YXJ0LWVuZC1yYWRpdXM6ICR7aXNMYXN0ID8gXCI1cHhcIiA6IFwiMFwifTtcbiAgICBib3JkZXItZW5kLWVuZC1yYWRpdXM6ICR7aXNMYXN0ID8gXCI1cHhcIiA6IFwiMFwifTtcbiAgICBjb2xvcjogJHtzdGF0ZS5jb2xvcn07XG4gICAgZm9udC1mYW1pbHk6IGluaGVyaXQ7XG4gICAgZm9udC1zaXplOiAke3R5cGVTY2FsZVNpemVzLnNtfTtcbiAgICBmb250LXdlaWdodDogNzAwO1xuICAgIGxpbmUtaGVpZ2h0OiAxO1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICB0cmFuc2l0aW9uOiBiYWNrZ3JvdW5kLWNvbG9yIDAuMnMgZWFzZS1pbiwgY29sb3IgMC4ycyBlYXNlLWluLCBib3JkZXItY29sb3IgMC4ycyBlYXNlLWluO1xuXG4gICAgLnNlZ21lbnRlZC1idXR0b25zX19pY29uIHtcbiAgICAgIGNvbG9yOiBjdXJyZW50Q29sb3I7XG4gICAgICBmbGV4LXNocmluazogMDtcbiAgICB9XG5cbiAgICAmOmhvdmVyOm5vdCg6ZGlzYWJsZWQpOm5vdCguc2VnbWVudGVkLWJ1dHRvbnNfX2J1dHRvbi0tc2VsZWN0ZWQpIHtcbiAgICAgIGJhY2tncm91bmQ6ICR7c2VnbWVudGVkQnV0dG9ucy5ob3Zlci5iYWNrZ3JvdW5kfTtcbiAgICAgIGJvcmRlci1jb2xvcjogJHtzZWdtZW50ZWRCdXR0b25zLmhvdmVyLmJvcmRlckNvbG9yfTtcbiAgICAgIGNvbG9yOiAke3NlZ21lbnRlZEJ1dHRvbnMuaG92ZXIuY29sb3J9O1xuICAgIH1cblxuICAgICY6Zm9jdXMtdmlzaWJsZSB7XG4gICAgICBvdXRsaW5lOiAxcHggc29saWQgJHtzZWdtZW50ZWRCdXR0b25zLmhvdmVyLmJvcmRlckNvbG9yfTtcbiAgICAgIG91dGxpbmUtb2Zmc2V0OiAycHg7XG4gICAgfVxuXG4gICAgJjpkaXNhYmxlZCB7XG4gICAgICBiYWNrZ3JvdW5kOiAke3NlZ21lbnRlZEJ1dHRvbnMuZGlzYWJsZWQuYmFja2dyb3VuZH07XG4gICAgICBib3JkZXItY29sb3I6ICR7c2VnbWVudGVkQnV0dG9ucy5kaXNhYmxlZC5ib3JkZXJDb2xvcn07XG4gICAgICBjb2xvcjogJHtzZWdtZW50ZWRCdXR0b25zLmRpc2FibGVkLmNvbG9yfTtcbiAgICAgIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gICAgfVxuICBgO1xufTtcbiJdfQ== */", process.env.NODE_ENV === "production" ? "" : ";label:segmentedButton;");
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
export { container, segmentedButton };
|
|
37
|
+
//# sourceMappingURL=styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.js","sources":["../../../../../src/components/SegmentedButtons/styles.ts"],"sourcesContent":["import { css, Theme, SerializedStyles } from \"@emotion/react\";\n\ntype SegmentedButtonAttrs = {\n isSelected: boolean;\n isFirst: boolean;\n isLast: boolean;\n hasLabel: boolean;\n hasIcon: boolean;\n};\n\nexport const container = css`\n display: inline-flex;\n align-items: center;\n`;\n\nexport const segmentedButton = (\n { typeScaleSizes, segmentedButtons }: Theme,\n { isSelected, isFirst, isLast, hasLabel, hasIcon }: SegmentedButtonAttrs,\n): SerializedStyles => {\n const state = isSelected ? segmentedButtons.active : segmentedButtons.default;\n const iconOnly = hasIcon && !hasLabel;\n const iconAndLabel = hasIcon && hasLabel;\n\n const horizontalPadding = iconOnly ? \"0.5rem\" : iconAndLabel ? \"0.75rem\" : \"1.5rem\";\n\n return css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n height: 2.5rem;\n min-width: 2.5rem;\n padding: 0 ${horizontalPadding};\n background: ${state.background};\n border: 1px solid ${state.borderColor};\n border-inline-start-width: ${isFirst ? \"1px\" : \"0\"};\n border-start-start-radius: ${isFirst ? \"5px\" : \"0\"};\n border-end-start-radius: ${isFirst ? \"5px\" : \"0\"};\n border-start-end-radius: ${isLast ? \"5px\" : \"0\"};\n border-end-end-radius: ${isLast ? \"5px\" : \"0\"};\n color: ${state.color};\n font-family: inherit;\n font-size: ${typeScaleSizes.sm};\n font-weight: 700;\n line-height: 1;\n cursor: pointer;\n transition: background-color 0.2s ease-in, color 0.2s ease-in, border-color 0.2s ease-in;\n\n .segmented-buttons__icon {\n color: currentColor;\n flex-shrink: 0;\n }\n\n &:hover:not(:disabled):not(.segmented-buttons__button--selected) {\n background: ${segmentedButtons.hover.background};\n border-color: ${segmentedButtons.hover.borderColor};\n color: ${segmentedButtons.hover.color};\n }\n\n &:focus-visible {\n outline: 1px solid ${segmentedButtons.hover.borderColor};\n outline-offset: 2px;\n }\n\n &:disabled {\n background: ${segmentedButtons.disabled.background};\n border-color: ${segmentedButtons.disabled.borderColor};\n color: ${segmentedButtons.disabled.color};\n cursor: not-allowed;\n }\n `;\n};\n"],"names":["container","process","env","NODE_ENV","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","segmentedButton","_ref","_ref2","typeScaleSizes","segmentedButtons","isSelected","isFirst","isLast","hasLabel","hasIcon","state","active","iconOnly","iconAndLabel","horizontalPadding","css","background","borderColor","color","sm","hover","disabled"],"mappings":";;;;;;;;;;;IAUaA,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA;EAAAC,IAAA,EAAA,QAAA;EAAAC,MAAA,EAAA,wCAAA;AAAA,CAAA,GAAA;EAAAD,IAAA,EAAA,kBAAA;EAAAC,MAAA,EAAA,yDAAA;EAAAC,GAAA,EAAA,isGAAA;AAAAC,EAAAA,QAAA,EAAAC,gCAAAA;AAAA,EAGrB;AAEM,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,CAAAC,IAAA,EAAAC,KAAA,EAGL;AAAA,EAAA,IAFnBC,cAAc,GAAAF,IAAA,CAAdE,cAAc;IAAEC,gBAAgB,GAAAH,IAAA,CAAhBG,gBAAgB,CAAA;AAAA,EAAA,IAChCC,UAAU,GAAAH,KAAA,CAAVG,UAAU;IAAEC,OAAO,GAAAJ,KAAA,CAAPI,OAAO;IAAEC,MAAM,GAAAL,KAAA,CAANK,MAAM;IAAEC,QAAQ,GAAAN,KAAA,CAARM,QAAQ;IAAEC,OAAO,GAAAP,KAAA,CAAPO,OAAO,CAAA;EAEhD,IAAMC,KAAK,GAAGL,UAAU,GAAGD,gBAAgB,CAACO,MAAM,GAAGP,gBAAgB,CAAQ,SAAA,CAAA,CAAA;AAC7E,EAAA,IAAMQ,QAAQ,GAAGH,OAAO,IAAI,CAACD,QAAQ,CAAA;AACrC,EAAA,IAAMK,YAAY,GAAGJ,OAAO,IAAID,QAAQ,CAAA;EAExC,IAAMM,iBAAiB,GAAGF,QAAQ,GAAG,QAAQ,GAAGC,YAAY,GAAG,SAAS,GAAG,QAAQ,CAAA;EAEnF,kCAAOE,GAAG,CAOKD,oHAAAA,EAAAA,iBAAiB,EAChBJ,cAAAA,EAAAA,KAAK,CAACM,UAAU,EAAA,oBAAA,EACVN,KAAK,CAACO,WAAW,EAAA,6BAAA,EACRX,OAAO,GAAG,KAAK,GAAG,GAAG,EACrBA,6BAAAA,EAAAA,OAAO,GAAG,KAAK,GAAG,GAAG,EAAA,2BAAA,EACvBA,OAAO,GAAG,KAAK,GAAG,GAAG,EACrBC,2BAAAA,EAAAA,MAAM,GAAG,KAAK,GAAG,GAAG,EAAA,yBAAA,EACtBA,MAAM,GAAG,KAAK,GAAG,GAAG,EACpCG,SAAAA,EAAAA,KAAK,CAACQ,KAAK,EAEPf,iCAAAA,EAAAA,cAAc,CAACgB,EAAE,EAAA,6QAAA,EAYdf,gBAAgB,CAACgB,KAAK,CAACJ,UAAU,EAC/BZ,gBAAAA,EAAAA,gBAAgB,CAACgB,KAAK,CAACH,WAAW,aACzCb,gBAAgB,CAACgB,KAAK,CAACF,KAAK,EAAA,sCAAA,EAIhBd,gBAAgB,CAACgB,KAAK,CAACH,WAAW,EAKzCb,6CAAAA,EAAAA,gBAAgB,CAACiB,QAAQ,CAACL,UAAU,EAAA,gBAAA,EAClCZ,gBAAgB,CAACiB,QAAQ,CAACJ,WAAW,EAC5Cb,SAAAA,EAAAA,gBAAgB,CAACiB,QAAQ,CAACH,KAAK,EAAA,uBAAA,IAAA1B,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAAF,YAAAA,GAAAA,EAAAA,GAAAA,yBAAAA,CAAAA,EAAAA,OAAA,CAAAC,GAAA,CAAAC,QAAA,4tGAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,yBAAA,CAAA,CAAA;AAI9C;;;;"}
|
|
@@ -56,6 +56,7 @@ import '../../../node_modules/core-js/modules/web.set-timeout.js';
|
|
|
56
56
|
import '../FormElements/Input/styles.js';
|
|
57
57
|
import '../../../node_modules/core-js/modules/es.regexp.exec.js';
|
|
58
58
|
import '../../../node_modules/core-js/modules/es.array.some.js';
|
|
59
|
+
import '../SegmentedButtons/styles.js';
|
|
59
60
|
import '../../../node_modules/core-js/modules/es.function.name.js';
|
|
60
61
|
import '../../theme/default/config/button.js';
|
|
61
62
|
import '../../theme/default/config/card.js';
|
|
@@ -65,6 +66,7 @@ import '../../theme/default/config/progressBar.js';
|
|
|
65
66
|
import '../../theme/default/config/table.js';
|
|
66
67
|
import '../../theme/default/config/tag.js';
|
|
67
68
|
import '../../theme/default/config/pagination.js';
|
|
69
|
+
import '../../theme/default/config/segmentedButtons.js';
|
|
68
70
|
import '../../theme/default/config/statusTag.js';
|
|
69
71
|
import '../../../node_modules/core-js/modules/es.symbol.constructor.js';
|
|
70
72
|
import '../../../node_modules/core-js/modules/es.symbol.for.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToastNotifications.js","sources":["../../../../../src/components/Toast/ToastNotifications.tsx"],"sourcesContent":["import React, { ReactNode } from \"react\";\nimport { SerializedStyles } from \"@emotion/react\";\nimport { Button, Text } from \"../../index\";\nimport {\n CloseModalSVG,\n DeactivateSVG,\n InfoIconSVG,\n SuccessIconSVG,\n WarningIconSVG,\n} from \"../../icons\";\nimport { notificationStyles } from \"./styles\";\n\nconst ICONS = {\n info: <InfoIconSVG height={16} />,\n error: <DeactivateSVG height={16} />,\n success: <SuccessIconSVG height={16} />,\n warning: <WarningIconSVG height={16} />,\n};\n\nconst ToastNotification = ({\n content,\n type,\n closeButtonAriaLabel,\n onClose,\n}: {\n content: ReactNode;\n type: \"info\" | \"success\" | \"warning\" | \"error\";\n closeButtonAriaLabel?: string;\n onClose: () => void;\n}): JSX.Element => {\n return (\n <div\n css={(theme): SerializedStyles => notificationStyles(theme, type)}\n className=\"toast-notification\"\n >\n <div className=\"toast-notification__icon-container\">\n <span className=\"toast-notification__icon\">{ICONS[type]}</span>\n <Text as=\"p\" fontSize=\"sm\" className=\"toast-notification__text\">\n {content}\n </Text>\n </div>\n\n {Boolean(onClose) && (\n <Button\n data-testid=\"close-toast-notification\"\n aria-label={closeButtonAriaLabel || \"Close toast notification\"}\n className=\"toast-notification__close-btn\"\n variant=\"link\"\n onClick={onClose}\n >\n <CloseModalSVG height={32} />\n </Button>\n )}\n </div>\n );\n};\n\nexport default ToastNotification;\n"],"names":["ICONS","info","___EmotionJSX","InfoIconSVG","height","error","DeactivateSVG","success","SuccessIconSVG","warning","WarningIconSVG","ToastNotification","_ref","content","type","closeButtonAriaLabel","onClose","css","theme","notificationStyles","className","Text","as","fontSize","Boolean","Button","variant","onClick","CloseModalSVG"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ToastNotifications.js","sources":["../../../../../src/components/Toast/ToastNotifications.tsx"],"sourcesContent":["import React, { ReactNode } from \"react\";\nimport { SerializedStyles } from \"@emotion/react\";\nimport { Button, Text } from \"../../index\";\nimport {\n CloseModalSVG,\n DeactivateSVG,\n InfoIconSVG,\n SuccessIconSVG,\n WarningIconSVG,\n} from \"../../icons\";\nimport { notificationStyles } from \"./styles\";\n\nconst ICONS = {\n info: <InfoIconSVG height={16} />,\n error: <DeactivateSVG height={16} />,\n success: <SuccessIconSVG height={16} />,\n warning: <WarningIconSVG height={16} />,\n};\n\nconst ToastNotification = ({\n content,\n type,\n closeButtonAriaLabel,\n onClose,\n}: {\n content: ReactNode;\n type: \"info\" | \"success\" | \"warning\" | \"error\";\n closeButtonAriaLabel?: string;\n onClose: () => void;\n}): JSX.Element => {\n return (\n <div\n css={(theme): SerializedStyles => notificationStyles(theme, type)}\n className=\"toast-notification\"\n >\n <div className=\"toast-notification__icon-container\">\n <span className=\"toast-notification__icon\">{ICONS[type]}</span>\n <Text as=\"p\" fontSize=\"sm\" className=\"toast-notification__text\">\n {content}\n </Text>\n </div>\n\n {Boolean(onClose) && (\n <Button\n data-testid=\"close-toast-notification\"\n aria-label={closeButtonAriaLabel || \"Close toast notification\"}\n className=\"toast-notification__close-btn\"\n variant=\"link\"\n onClick={onClose}\n >\n <CloseModalSVG height={32} />\n </Button>\n )}\n </div>\n );\n};\n\nexport default ToastNotification;\n"],"names":["ICONS","info","___EmotionJSX","InfoIconSVG","height","error","DeactivateSVG","success","SuccessIconSVG","warning","WarningIconSVG","ToastNotification","_ref","content","type","closeButtonAriaLabel","onClose","css","theme","notificationStyles","className","Text","as","fontSize","Boolean","Button","variant","onClick","CloseModalSVG"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,IAAMA,KAAK,GAAG;EACZC,IAAI,EAAEC,GAAA,CAACC,WAAW,EAAA;AAACC,IAAAA,MAAM,EAAE,EAAA;AAAG,GAAE,CAAC;EACjCC,KAAK,EAAEH,GAAA,CAACI,aAAa,EAAA;AAACF,IAAAA,MAAM,EAAE,EAAA;AAAG,GAAE,CAAC;EACpCG,OAAO,EAAEL,GAAA,CAACM,cAAc,EAAA;AAACJ,IAAAA,MAAM,EAAE,EAAA;AAAG,GAAE,CAAC;EACvCK,OAAO,EAAEP,GAAA,CAACQ,cAAc,EAAA;AAACN,IAAAA,MAAM,EAAE,EAAA;GAAK,CAAA;AACxC,CAAC,CAAA;AAED,IAAMO,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAAC,IAAA,EAUJ;AAAA,EAAA,IATjBC,OAAO,GAAAD,IAAA,CAAPC,OAAO;IACPC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IACJC,oBAAoB,GAAAH,IAAA,CAApBG,oBAAoB;IACpBC,OAAO,GAAAJ,IAAA,CAAPI,OAAO,CAAA;AAOP,EAAA,OACEd,GAAA,CAAA,KAAA,EAAA;AACEe,IAAAA,GAAG,EAAE,SAALA,GAAGA,CAAGC,KAAK,EAAA;AAAA,MAAA,OAAuBC,kBAAkB,CAACD,KAAK,EAAEJ,IAAI,CAAC,CAAA;KAAC;AAClEM,IAAAA,SAAS,EAAC,oBAAA;AAAoB,GAAA,EAE9BlB,GAAA,CAAA,KAAA,EAAA;AAAKkB,IAAAA,SAAS,EAAC,oCAAA;AAAoC,GAAA,EACjDlB,GAAA,CAAA,MAAA,EAAA;AAAMkB,IAAAA,SAAS,EAAC,0BAAA;GAA4BpB,EAAAA,KAAK,CAACc,IAAI,CAAQ,CAAC,EAC/DZ,GAAA,CAACmB,IAAI,EAAA;AAACC,IAAAA,EAAE,EAAC,GAAG;AAACC,IAAAA,QAAQ,EAAC,IAAI;AAACH,IAAAA,SAAS,EAAC,0BAAA;GAClCP,EAAAA,OACG,CACH,CAAC,EAELW,OAAO,CAACR,OAAO,CAAC,IACfd,GAAA,CAACuB,MAAM,EAAA;AACL,IAAA,aAAA,EAAY,0BAA0B;IACtC,YAAYV,EAAAA,oBAAoB,IAAI,0BAA2B;AAC/DK,IAAAA,SAAS,EAAC,+BAA+B;AACzCM,IAAAA,OAAO,EAAC,MAAM;AACdC,IAAAA,OAAO,EAAEX,OAAAA;GAETd,EAAAA,GAAA,CAAC0B,aAAa,EAAA;AAACxB,IAAAA,MAAM,EAAE,EAAA;GAAK,CACtB,CAEP,CAAC,CAAA;AAEV;;;;"}
|
package/dist/esm/src/index.js
CHANGED
|
@@ -28,6 +28,7 @@ export { default as Table } from './components/Table/Table.js';
|
|
|
28
28
|
export { default as Dropdown } from './components/Dropdown/Dropdown.js';
|
|
29
29
|
export { default as StatusTag } from './components/StatusTag/StatusTag.js';
|
|
30
30
|
export { default as Breadcrumbs } from './components/Breadcrumbs/Breadcrumbs.js';
|
|
31
|
+
export { default as SegmentedButtons } from './components/SegmentedButtons/SegmentedButtons.js';
|
|
31
32
|
export { default as ToastNotification } from './components/Toast/ToastNotifications.js';
|
|
32
33
|
export { default as Heading } from './components/Heading/Heading.js';
|
|
33
34
|
export { default as Text } from './components/Text/Text.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
|
|
2
|
+
/**
|
|
3
|
+
* @license
|
|
4
|
+
* author: epignosis front-end team
|
|
5
|
+
* @epignosis_llc/gnosis.js v6.6.16
|
|
6
|
+
* Released under the MIT license.
|
|
7
|
+
*/
|
|
8
|
+
|
|
9
|
+
import Color from '../../../../node_modules/color/index.js';
|
|
10
|
+
import { colors } from '../colors.js';
|
|
11
|
+
|
|
12
|
+
var segmentedButtons = {
|
|
13
|
+
"default": {
|
|
14
|
+
background: colors.white,
|
|
15
|
+
borderColor: colors.secondary.light,
|
|
16
|
+
color: colors.black
|
|
17
|
+
},
|
|
18
|
+
hover: {
|
|
19
|
+
background: Color(colors.primary.lightest).alpha(0.25).string(),
|
|
20
|
+
borderColor: colors.primary.base,
|
|
21
|
+
color: colors.primary.base
|
|
22
|
+
},
|
|
23
|
+
active: {
|
|
24
|
+
background: colors.primary.base,
|
|
25
|
+
borderColor: colors.primary.base,
|
|
26
|
+
color: colors.white
|
|
27
|
+
},
|
|
28
|
+
disabled: {
|
|
29
|
+
background: colors.secondary.lighter,
|
|
30
|
+
borderColor: colors.secondary.light,
|
|
31
|
+
color: colors.secondary.base
|
|
32
|
+
}
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
export { segmentedButtons as default };
|
|
36
|
+
//# sourceMappingURL=segmentedButtons.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"segmentedButtons.js","sources":["../../../../../../src/theme/default/config/segmentedButtons.ts"],"sourcesContent":["import Color from \"color\";\nimport { colors } from \"../colors\";\n\nexport default {\n default: {\n background: colors.white,\n borderColor: colors.secondary.light,\n color: colors.black,\n },\n hover: {\n background: Color(colors.primary.lightest).alpha(0.25).string(),\n borderColor: colors.primary.base,\n color: colors.primary.base,\n },\n active: {\n background: colors.primary.base,\n borderColor: colors.primary.base,\n color: colors.white,\n },\n disabled: {\n background: colors.secondary.lighter,\n borderColor: colors.secondary.light,\n color: colors.secondary.base,\n },\n};\n"],"names":["background","colors","white","borderColor","secondary","light","color","black","hover","Color","primary","lightest","alpha","string","base","active","disabled","lighter"],"mappings":";;;;;;;;;;;AAGA,uBAAe;EACb,SAAS,EAAA;IACPA,UAAU,EAAEC,MAAM,CAACC,KAAK;AACxBC,IAAAA,WAAW,EAAEF,MAAM,CAACG,SAAS,CAACC,KAAK;IACnCC,KAAK,EAAEL,MAAM,CAACM,KAAAA;GACf;AACDC,EAAAA,KAAK,EAAE;AACLR,IAAAA,UAAU,EAAES,KAAK,CAACR,MAAM,CAACS,OAAO,CAACC,QAAQ,CAAC,CAACC,KAAK,CAAC,IAAI,CAAC,CAACC,MAAM,EAAE;AAC/DV,IAAAA,WAAW,EAAEF,MAAM,CAACS,OAAO,CAACI,IAAI;AAChCR,IAAAA,KAAK,EAAEL,MAAM,CAACS,OAAO,CAACI,IAAAA;GACvB;AACDC,EAAAA,MAAM,EAAE;AACNf,IAAAA,UAAU,EAAEC,MAAM,CAACS,OAAO,CAACI,IAAI;AAC/BX,IAAAA,WAAW,EAAEF,MAAM,CAACS,OAAO,CAACI,IAAI;IAChCR,KAAK,EAAEL,MAAM,CAACC,KAAAA;GACf;AACDc,EAAAA,QAAQ,EAAE;AACRhB,IAAAA,UAAU,EAAEC,MAAM,CAACG,SAAS,CAACa,OAAO;AACpCd,IAAAA,WAAW,EAAEF,MAAM,CAACG,SAAS,CAACC,KAAK;AACnCC,IAAAA,KAAK,EAAEL,MAAM,CAACG,SAAS,CAACU,IAAAA;AAC1B,GAAA;AACF,CAAC;;;;"}
|
|
@@ -28,6 +28,7 @@ import tag from './config/tag.js';
|
|
|
28
28
|
import tooltip from './config/tooltip.js';
|
|
29
29
|
import pagination from './config/pagination.js';
|
|
30
30
|
import scrollbar from './config/scrollbar.js';
|
|
31
|
+
import segmentedButtons from './config/segmentedButtons.js';
|
|
31
32
|
import statusTag from './config/statusTag.js';
|
|
32
33
|
import toastNotifications from './config/toastNotifications.js';
|
|
33
34
|
|
|
@@ -64,6 +65,7 @@ var defaultTheme = {
|
|
|
64
65
|
pagination: pagination,
|
|
65
66
|
dropdown: dropdown,
|
|
66
67
|
scrollbar: scrollbar,
|
|
68
|
+
segmentedButtons: segmentedButtons,
|
|
67
69
|
statusTag: statusTag,
|
|
68
70
|
breadcrumbs: breadcrumbs,
|
|
69
71
|
toastNotifications: toastNotifications
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"defaultTheme.js","sources":["../../../../../src/theme/default/defaultTheme.ts"],"sourcesContent":["import { generateTypeScaleSizes, DEFAULT_TYPESCALE_CONFIG } from \"../utils/typography\";\nimport { colors } from \"./colors\";\nimport {\n alert,\n badge,\n button,\n card,\n chip,\n drawer,\n formElements,\n loader,\n modal,\n progressBar,\n result,\n sidebar,\n tabs,\n table,\n tag,\n toastNotifications,\n tooltip,\n pagination,\n dropdown,\n scrollbar,\n statusTag,\n breadcrumbs,\n} from \"./config\";\n\nconst typeScaleSizes = generateTypeScaleSizes(DEFAULT_TYPESCALE_CONFIG);\n\nconst defaultTheme = {\n body: {\n color: colors.black,\n background: colors.white,\n fontSize: \"100%\",\n lineHeight: 1.5715,\n fontFamily: `\"Mulish\", Arial, sans-serif`,\n },\n link: {\n color: colors.primary.base,\n hoverColor: colors.primary.lighter,\n },\n typeScaleSizes,\n alert,\n badge,\n button,\n card,\n chip,\n drawer,\n formElements,\n loader,\n modal,\n progressBar,\n result,\n sidebar,\n table,\n tabs,\n tag,\n tooltip,\n pagination,\n dropdown,\n scrollbar,\n statusTag,\n breadcrumbs,\n toastNotifications,\n};\n\nexport type GnosisTheme = typeof defaultTheme;\n\nexport default defaultTheme;\n"],"names":["typeScaleSizes","generateTypeScaleSizes","DEFAULT_TYPESCALE_CONFIG","defaultTheme","body","color","colors","black","background","white","fontSize","lineHeight","fontFamily","link","primary","base","hoverColor","lighter","alert","badge","button","card","chip","drawer","formElements","loader","modal","progressBar","result","sidebar","table","tabs","tag","tooltip","pagination","dropdown","scrollbar","statusTag","breadcrumbs","toastNotifications"],"mappings":"
|
|
1
|
+
{"version":3,"file":"defaultTheme.js","sources":["../../../../../src/theme/default/defaultTheme.ts"],"sourcesContent":["import { generateTypeScaleSizes, DEFAULT_TYPESCALE_CONFIG } from \"../utils/typography\";\nimport { colors } from \"./colors\";\nimport {\n alert,\n badge,\n button,\n card,\n chip,\n drawer,\n formElements,\n loader,\n modal,\n progressBar,\n result,\n sidebar,\n tabs,\n table,\n tag,\n toastNotifications,\n tooltip,\n pagination,\n dropdown,\n scrollbar,\n segmentedButtons,\n statusTag,\n breadcrumbs,\n} from \"./config\";\n\nconst typeScaleSizes = generateTypeScaleSizes(DEFAULT_TYPESCALE_CONFIG);\n\nconst defaultTheme = {\n body: {\n color: colors.black,\n background: colors.white,\n fontSize: \"100%\",\n lineHeight: 1.5715,\n fontFamily: `\"Mulish\", Arial, sans-serif`,\n },\n link: {\n color: colors.primary.base,\n hoverColor: colors.primary.lighter,\n },\n typeScaleSizes,\n alert,\n badge,\n button,\n card,\n chip,\n drawer,\n formElements,\n loader,\n modal,\n progressBar,\n result,\n sidebar,\n table,\n tabs,\n tag,\n tooltip,\n pagination,\n dropdown,\n scrollbar,\n segmentedButtons,\n statusTag,\n breadcrumbs,\n toastNotifications,\n};\n\nexport type GnosisTheme = typeof defaultTheme;\n\nexport default defaultTheme;\n"],"names":["typeScaleSizes","generateTypeScaleSizes","DEFAULT_TYPESCALE_CONFIG","defaultTheme","body","color","colors","black","background","white","fontSize","lineHeight","fontFamily","link","primary","base","hoverColor","lighter","alert","badge","button","card","chip","drawer","formElements","loader","modal","progressBar","result","sidebar","table","tabs","tag","tooltip","pagination","dropdown","scrollbar","segmentedButtons","statusTag","breadcrumbs","toastNotifications"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,IAAMA,cAAc,GAAGC,sBAAsB,CAACC,wBAAwB,CAAC,CAAA;AAEvE,IAAMC,YAAY,GAAG;AACnBC,EAAAA,IAAI,EAAE;IACJC,KAAK,EAAEC,MAAM,CAACC,KAAK;IACnBC,UAAU,EAAEF,MAAM,CAACG,KAAK;AACxBC,IAAAA,QAAQ,EAAE,MAAM;AAChBC,IAAAA,UAAU,EAAE,MAAM;IAClBC,UAAU,EAAA,+BAAA;GACX;AACDC,EAAAA,IAAI,EAAE;AACJR,IAAAA,KAAK,EAAEC,MAAM,CAACQ,OAAO,CAACC,IAAI;AAC1BC,IAAAA,UAAU,EAAEV,MAAM,CAACQ,OAAO,CAACG,OAAAA;GAC5B;AACDjB,EAAAA,cAAc,EAAdA,cAAc;AACdkB,EAAAA,KAAK,EAALA,KAAK;AACLC,EAAAA,KAAK,EAALA,KAAK;AACLC,EAAAA,MAAM,EAANA,MAAM;AACNC,EAAAA,IAAI,EAAJA,IAAI;AACJC,EAAAA,IAAI,EAAJA,IAAI;AACJC,EAAAA,MAAM,EAANA,MAAM;AACNC,EAAAA,YAAY,EAAZA,YAAY;AACZC,EAAAA,MAAM,EAANA,MAAM;AACNC,EAAAA,KAAK,EAALA,KAAK;AACLC,EAAAA,WAAW,EAAXA,WAAW;AACXC,EAAAA,MAAM,EAANA,MAAM;AACNC,EAAAA,OAAO,EAAPA,OAAO;AACPC,EAAAA,KAAK,EAALA,KAAK;AACLC,EAAAA,IAAI,EAAJA,IAAI;AACJC,EAAAA,GAAG,EAAHA,GAAG;AACHC,EAAAA,OAAO,EAAPA,OAAO;AACPC,EAAAA,UAAU,EAAVA,UAAU;AACVC,EAAAA,QAAQ,EAARA,QAAQ;AACRC,EAAAA,SAAS,EAATA,SAAS;AACTC,EAAAA,gBAAgB,EAAhBA,gBAAgB;AAChBC,EAAAA,SAAS,EAATA,SAAS;AACTC,EAAAA,WAAW,EAAXA,WAAW;AACXC,EAAAA,kBAAkB,EAAlBA,kBAAAA;AACF;;;;"}
|