@clickhouse/click-ui 0.6.2-rc3 → 0.8.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/click-ui.css +3521 -236
- package/dist/cjs/components/Alert/index.cjs +2 -2
- package/dist/cjs/components/Alert/index.cjs.map +1 -1
- package/dist/cjs/components/Assets/Logos/Polaris.cjs +22 -0
- package/dist/cjs/components/Assets/Logos/Polaris.cjs.map +1 -0
- package/dist/cjs/components/Assets/Logos/system/LogosDark.cjs +2 -0
- package/dist/cjs/components/Assets/Logos/system/LogosDark.cjs.map +1 -1
- package/dist/cjs/components/Assets/Logos/system/LogosLight.cjs +2 -0
- package/dist/cjs/components/Assets/Logos/system/LogosLight.cjs.map +1 -1
- package/dist/cjs/components/AutoComplete/AutoComplete.css +97 -0
- package/dist/cjs/components/AutoComplete/AutoComplete.module.css.cjs +18 -0
- package/dist/cjs/components/AutoComplete/AutoComplete.module.css.cjs.map +1 -0
- package/dist/cjs/components/AutoComplete/index.cjs +14 -74
- package/dist/cjs/components/AutoComplete/index.cjs.map +1 -1
- package/dist/cjs/components/BigStat/BigStat.css +77 -0
- package/dist/cjs/components/BigStat/BigStat.module.css.cjs +22 -0
- package/dist/cjs/components/BigStat/BigStat.module.css.cjs.map +1 -0
- package/dist/cjs/components/BigStat/index.cjs +60 -52
- package/dist/cjs/components/BigStat/index.cjs.map +1 -1
- package/dist/cjs/components/Button/BaseButton.cjs +10 -31
- package/dist/cjs/components/Button/BaseButton.cjs.map +1 -1
- package/dist/cjs/components/Button/BaseButton.css +40 -0
- package/dist/cjs/components/Button/BaseButton.module.css.cjs +10 -0
- package/dist/cjs/components/Button/BaseButton.module.css.cjs.map +1 -0
- package/dist/cjs/components/ButtonGroup/index.cjs +1 -1
- package/dist/cjs/components/ButtonGroup/index.cjs.map +1 -1
- package/dist/cjs/components/CardPromotion/CardPromotion.css +52 -0
- package/dist/cjs/components/CardPromotion/CardPromotion.module.css.cjs +21 -0
- package/dist/cjs/components/CardPromotion/CardPromotion.module.css.cjs.map +1 -0
- package/dist/cjs/components/CardPromotion/index.cjs +8 -54
- package/dist/cjs/components/CardPromotion/index.cjs.map +1 -1
- package/dist/cjs/components/CardSecondary/CardSecondary.css +99 -0
- package/dist/cjs/components/CardSecondary/CardSecondary.module.css.cjs +39 -0
- package/dist/cjs/components/CardSecondary/CardSecondary.module.css.cjs.map +1 -0
- package/dist/cjs/components/CardSecondary/index.cjs +35 -84
- package/dist/cjs/components/CardSecondary/index.cjs.map +1 -1
- package/dist/cjs/components/CodeBlock/CodeBlock.css +48 -0
- package/dist/cjs/components/CodeBlock/CodeBlock.module.css.cjs +22 -0
- package/dist/cjs/components/CodeBlock/CodeBlock.module.css.cjs.map +1 -0
- package/dist/cjs/components/CodeBlock/InlineCodeBlock.cjs +7 -14
- package/dist/cjs/components/CodeBlock/InlineCodeBlock.cjs.map +1 -1
- package/dist/cjs/components/CodeBlock/InlineCodeBlock.css +10 -0
- package/dist/cjs/components/CodeBlock/InlineCodeBlock.module.css.cjs +12 -0
- package/dist/cjs/components/CodeBlock/InlineCodeBlock.module.css.cjs.map +1 -0
- package/dist/cjs/components/CodeBlock/index.cjs +18 -49
- package/dist/cjs/components/CodeBlock/index.cjs.map +1 -1
- package/dist/cjs/components/CodeBlock/useColorStyle.cjs +15 -0
- package/dist/cjs/components/CodeBlock/useColorStyle.cjs.map +1 -1
- package/dist/cjs/components/ConfirmationDialog/ConfirmationDialog.css +20 -0
- package/dist/cjs/components/ConfirmationDialog/ConfirmationDialog.module.css.cjs +15 -0
- package/dist/cjs/components/ConfirmationDialog/ConfirmationDialog.module.css.cjs.map +1 -0
- package/dist/cjs/components/ConfirmationDialog/index.cjs +6 -11
- package/dist/cjs/components/ConfirmationDialog/index.cjs.map +1 -1
- package/dist/cjs/components/ContextMenu/ContextMenu.css +40 -0
- package/dist/cjs/components/ContextMenu/ContextMenu.module.css.cjs +17 -0
- package/dist/cjs/components/ContextMenu/ContextMenu.module.css.cjs.map +1 -0
- package/dist/cjs/components/ContextMenu/index.cjs +33 -47
- package/dist/cjs/components/ContextMenu/index.cjs.map +1 -1
- package/dist/cjs/components/CrossButton/CrossButton.css +12 -0
- package/dist/cjs/components/CrossButton/CrossButton.module.css.cjs +10 -0
- package/dist/cjs/components/CrossButton/CrossButton.module.css.cjs.map +1 -0
- package/dist/cjs/components/CrossButton/index.cjs +11 -14
- package/dist/cjs/components/CrossButton/index.cjs.map +1 -1
- package/dist/cjs/components/DatePicker/Common.cjs +1 -1
- package/dist/cjs/components/DatePicker/Common.cjs.map +1 -1
- package/dist/cjs/components/DatePicker/DateTimeRangePicker.cjs +1 -1
- package/dist/cjs/components/DatePicker/DateTimeRangePicker.cjs.map +1 -1
- package/dist/cjs/components/Dropdown/Dropdown.css +36 -0
- package/dist/cjs/components/Dropdown/Dropdown.module.css.cjs +13 -0
- package/dist/cjs/components/Dropdown/Dropdown.module.css.cjs.map +1 -0
- package/dist/cjs/components/Dropdown/index.cjs +28 -33
- package/dist/cjs/components/Dropdown/index.cjs.map +1 -1
- package/dist/cjs/components/EllipsisContent/EllipsisContent.css +21 -0
- package/dist/cjs/components/EllipsisContent/EllipsisContent.module.css.cjs +10 -0
- package/dist/cjs/components/EllipsisContent/EllipsisContent.module.css.cjs.map +1 -0
- package/dist/cjs/components/EllipsisContent/index.cjs +7 -6
- package/dist/cjs/components/EllipsisContent/index.cjs.map +1 -1
- package/dist/cjs/components/EmptyButton/EmptyButton.css +21 -0
- package/dist/cjs/components/EmptyButton/EmptyButton.module.css.cjs +10 -0
- package/dist/cjs/components/EmptyButton/EmptyButton.module.css.cjs.map +1 -0
- package/dist/cjs/components/EmptyButton/index.cjs +10 -4
- package/dist/cjs/components/EmptyButton/index.cjs.map +1 -1
- package/dist/cjs/components/FileTabs/FileTabs.css +167 -0
- package/dist/cjs/components/FileTabs/FileTabs.module.css.cjs +38 -0
- package/dist/cjs/components/FileTabs/FileTabs.module.css.cjs.map +1 -0
- package/dist/cjs/components/FileTabs/index.cjs +51 -80
- package/dist/cjs/components/FileTabs/index.cjs.map +1 -1
- package/dist/cjs/components/FileUpload/FileMultiUpload.cjs +3 -9
- package/dist/cjs/components/FileUpload/FileMultiUpload.cjs.map +1 -1
- package/dist/cjs/components/FileUpload/FileMultiUpload.css +8 -0
- package/dist/cjs/components/FileUpload/FileMultiUpload.module.css.cjs +10 -0
- package/dist/cjs/components/FileUpload/FileMultiUpload.module.css.cjs.map +1 -0
- package/dist/cjs/components/FileUpload/FileUpload.stories-common.css +14 -0
- package/dist/cjs/components/FileUpload/FileUploadArea.cjs +87 -64
- package/dist/cjs/components/FileUpload/FileUploadArea.cjs.map +1 -1
- package/dist/cjs/components/FileUpload/FileUploadArea.css +130 -0
- package/dist/cjs/components/FileUpload/FileUploadArea.module.css.cjs +38 -0
- package/dist/cjs/components/FileUpload/FileUploadArea.module.css.cjs.map +1 -0
- package/dist/cjs/components/FileUpload/FileUploadItem.cjs +56 -64
- package/dist/cjs/components/FileUpload/FileUploadItem.cjs.map +1 -1
- package/dist/cjs/components/FileUpload/FileUploadItem.css +82 -0
- package/dist/cjs/components/FileUpload/FileUploadItem.module.css.cjs +27 -0
- package/dist/cjs/components/FileUpload/FileUploadItem.module.css.cjs.map +1 -0
- package/dist/cjs/components/Flyout/Flyout.css +231 -0
- package/dist/cjs/components/Flyout/Flyout.module.css.cjs +93 -0
- package/dist/cjs/components/Flyout/Flyout.module.css.cjs.map +1 -0
- package/dist/cjs/components/Flyout/index.cjs +148 -126
- package/dist/cjs/components/Flyout/index.cjs.map +1 -1
- package/dist/cjs/components/FormContainer/Error.cjs +8 -9
- package/dist/cjs/components/FormContainer/Error.cjs.map +1 -1
- package/dist/cjs/components/FormContainer/Error.css +4 -0
- package/dist/cjs/components/FormContainer/Error.module.css.cjs +12 -0
- package/dist/cjs/components/FormContainer/Error.module.css.cjs.map +1 -0
- package/dist/cjs/components/FormContainer/FormElementContainer.cjs +8 -6
- package/dist/cjs/components/FormContainer/FormElementContainer.cjs.map +1 -1
- package/dist/cjs/components/FormContainer/FormElementContainer.css +14 -0
- package/dist/cjs/components/FormContainer/FormElementContainer.module.css.cjs +10 -0
- package/dist/cjs/components/FormContainer/FormElementContainer.module.css.cjs.map +1 -0
- package/dist/cjs/components/FormContainer/FormRoot.cjs +32 -18
- package/dist/cjs/components/FormContainer/FormRoot.cjs.map +1 -1
- package/dist/cjs/components/FormContainer/FormRoot.css +33 -0
- package/dist/cjs/components/FormContainer/FormRoot.module.css.cjs +15 -0
- package/dist/cjs/components/FormContainer/FormRoot.module.css.cjs.map +1 -0
- package/dist/cjs/components/GenericMenu/GenericMenu.css +176 -0
- package/dist/cjs/components/GenericMenu/GenericMenu.module.css.cjs +23 -0
- package/dist/cjs/components/GenericMenu/GenericMenu.module.css.cjs.map +1 -0
- package/dist/cjs/components/GenericMenu/index.cjs +93 -99
- package/dist/cjs/components/GenericMenu/index.cjs.map +1 -1
- package/dist/cjs/components/GridCenter/GridCenter.css +6 -0
- package/dist/cjs/components/GridContainer/GridContainer.css +71 -0
- package/dist/cjs/components/GridContainer/GridContainer.module.css.cjs +12 -0
- package/dist/cjs/components/GridContainer/GridContainer.module.css.cjs.map +1 -0
- package/dist/cjs/components/GridContainer/index.cjs +64 -64
- package/dist/cjs/components/GridContainer/index.cjs.map +1 -1
- package/dist/cjs/components/HoverCard/index.cjs +1 -1
- package/dist/cjs/components/HoverCard/index.cjs.map +1 -1
- package/dist/cjs/components/IconButton/index.cjs +2 -1
- package/dist/cjs/components/IconButton/index.cjs.map +1 -1
- package/dist/cjs/components/InputWrapper/InputWrapper.css +221 -0
- package/dist/cjs/components/InputWrapper/InputWrapper.module.css.cjs +39 -0
- package/dist/cjs/components/InputWrapper/InputWrapper.module.css.cjs.map +1 -0
- package/dist/cjs/components/InputWrapper/index.cjs +84 -185
- package/dist/cjs/components/InputWrapper/index.cjs.map +1 -1
- package/dist/cjs/components/MiddleTruncator/MiddleTruncator.css +22 -0
- package/dist/cjs/components/MiddleTruncator/MiddleTruncator.module.css.cjs +18 -0
- package/dist/cjs/components/MiddleTruncator/MiddleTruncator.module.css.cjs.map +1 -0
- package/dist/cjs/components/MiddleTruncator/index.cjs +5 -17
- package/dist/cjs/components/MiddleTruncator/index.cjs.map +1 -1
- package/dist/cjs/components/Pagination/Pagination.css +7 -0
- package/dist/cjs/components/Pagination/Pagination.module.css.cjs +10 -0
- package/dist/cjs/components/Pagination/Pagination.module.css.cjs.map +1 -0
- package/dist/cjs/components/Pagination/index.cjs +3 -5
- package/dist/cjs/components/Pagination/index.cjs.map +1 -1
- package/dist/cjs/components/Panel/Panel.css +116 -0
- package/dist/cjs/components/Panel/Panel.module.css.cjs +87 -0
- package/dist/cjs/components/Panel/Panel.module.css.cjs.map +1 -0
- package/dist/cjs/components/Panel/index.cjs +85 -35
- package/dist/cjs/components/Panel/index.cjs.map +1 -1
- package/dist/cjs/components/Popover/Popover.css +32 -0
- package/dist/cjs/components/Popover/Popover.module.css.cjs +15 -0
- package/dist/cjs/components/Popover/Popover.module.css.cjs.map +1 -0
- package/dist/cjs/components/Popover/index.cjs +27 -36
- package/dist/cjs/components/Popover/index.cjs.map +1 -1
- package/dist/cjs/components/RadioGroup/RadioGroup.css +99 -0
- package/dist/cjs/components/RadioGroup/RadioGroup.module.css.cjs +18 -0
- package/dist/cjs/components/RadioGroup/RadioGroup.module.css.cjs.map +1 -0
- package/dist/cjs/components/RadioGroup/index.cjs +28 -77
- package/dist/cjs/components/RadioGroup/index.cjs.map +1 -1
- package/dist/cjs/components/Select/MultiSelectValue.cjs +4 -9
- package/dist/cjs/components/Select/MultiSelectValue.cjs.map +1 -1
- package/dist/cjs/components/Select/MultiSelectValue.css +19 -0
- package/dist/cjs/components/Select/MultiSelectValue.module.css.cjs +11 -0
- package/dist/cjs/components/Select/MultiSelectValue.module.css.cjs.map +1 -0
- package/dist/cjs/components/Select/SingleSelectValue.cjs +3 -5
- package/dist/cjs/components/Select/SingleSelectValue.cjs.map +1 -1
- package/dist/cjs/components/Select/SingleSelectValue.css +10 -0
- package/dist/cjs/components/Select/SingleSelectValue.module.css.cjs +10 -0
- package/dist/cjs/components/Select/SingleSelectValue.module.css.cjs.map +1 -0
- package/dist/cjs/components/Select/common/InternalSelect.cjs +18 -23
- package/dist/cjs/components/Select/common/InternalSelect.cjs.map +1 -1
- package/dist/cjs/components/Select/common/SelectComponents.cjs +110 -0
- package/dist/cjs/components/Select/common/SelectComponents.cjs.map +1 -0
- package/dist/cjs/components/Select/common/SelectComponents.css +296 -0
- package/dist/cjs/components/Select/common/SelectComponents.module.css.cjs +31 -0
- package/dist/cjs/components/Select/common/SelectComponents.module.css.cjs.map +1 -0
- package/dist/cjs/components/SplitButton/SplitButton.css +138 -0
- package/dist/cjs/components/SplitButton/SplitButton.module.css.cjs +19 -0
- package/dist/cjs/components/SplitButton/SplitButton.module.css.cjs.map +1 -0
- package/dist/cjs/components/SplitButton/index.cjs +43 -88
- package/dist/cjs/components/SplitButton/index.cjs.map +1 -1
- package/dist/cjs/components/Table/Table.css +375 -0
- package/dist/cjs/components/Table/Table.module.css.cjs +86 -0
- package/dist/cjs/components/Table/Table.module.css.cjs.map +1 -0
- package/dist/cjs/components/Table/index.cjs +132 -214
- package/dist/cjs/components/Table/index.cjs.map +1 -1
- package/dist/cjs/components/Toast/Toast.css +142 -0
- package/dist/cjs/components/Toast/Toast.module.css.cjs +38 -0
- package/dist/cjs/components/Toast/Toast.module.css.cjs.map +1 -0
- package/dist/cjs/components/Toast/index.cjs +43 -96
- package/dist/cjs/components/Toast/index.cjs.map +1 -1
- package/dist/cjs/components/Tooltip/Tooltip.css +17 -0
- package/dist/cjs/components/Tooltip/Tooltip.module.css.cjs +15 -0
- package/dist/cjs/components/Tooltip/Tooltip.module.css.cjs.map +1 -0
- package/dist/cjs/components/Tooltip/index.cjs +12 -24
- package/dist/cjs/components/Tooltip/index.cjs.map +1 -1
- package/dist/cjs/components/VerticalStepper/VerticalStepper.css +302 -0
- package/dist/cjs/components/VerticalStepper/VerticalStepper.module.css.cjs +84 -0
- package/dist/cjs/components/VerticalStepper/VerticalStepper.module.css.cjs.map +1 -0
- package/dist/cjs/components/VerticalStepper/index.cjs +85 -110
- package/dist/cjs/components/VerticalStepper/index.cjs.map +1 -1
- package/dist/esm/click-ui.css +3521 -236
- package/dist/esm/components/Alert/index.js +2 -2
- package/dist/esm/components/Alert/index.js.map +1 -1
- package/dist/esm/components/Assets/Logos/Polaris.js +18 -0
- package/dist/esm/components/Assets/Logos/Polaris.js.map +1 -0
- package/dist/esm/components/Assets/Logos/system/LogosDark.js +2 -0
- package/dist/esm/components/Assets/Logos/system/LogosDark.js.map +1 -1
- package/dist/esm/components/Assets/Logos/system/LogosLight.js +2 -0
- package/dist/esm/components/Assets/Logos/system/LogosLight.js.map +1 -1
- package/dist/esm/components/AutoComplete/AutoComplete.css +97 -0
- package/dist/esm/components/AutoComplete/AutoComplete.module.css.js +14 -0
- package/dist/esm/components/AutoComplete/AutoComplete.module.css.js.map +1 -0
- package/dist/esm/components/AutoComplete/index.js +15 -75
- package/dist/esm/components/AutoComplete/index.js.map +1 -1
- package/dist/esm/components/BigStat/BigStat.css +77 -0
- package/dist/esm/components/BigStat/BigStat.module.css.js +18 -0
- package/dist/esm/components/BigStat/BigStat.module.css.js.map +1 -0
- package/dist/esm/components/BigStat/index.js +60 -52
- package/dist/esm/components/BigStat/index.js.map +1 -1
- package/dist/esm/components/Button/BaseButton.css +40 -0
- package/dist/esm/components/Button/BaseButton.js +11 -32
- package/dist/esm/components/Button/BaseButton.js.map +1 -1
- package/dist/esm/components/Button/BaseButton.module.css.js +6 -0
- package/dist/esm/components/Button/BaseButton.module.css.js.map +1 -0
- package/dist/esm/components/ButtonGroup/index.js +1 -1
- package/dist/esm/components/ButtonGroup/index.js.map +1 -1
- package/dist/esm/components/CardPromotion/CardPromotion.css +52 -0
- package/dist/esm/components/CardPromotion/CardPromotion.module.css.js +13 -0
- package/dist/esm/components/CardPromotion/CardPromotion.module.css.js.map +1 -0
- package/dist/esm/components/CardPromotion/index.js +8 -54
- package/dist/esm/components/CardPromotion/index.js.map +1 -1
- package/dist/esm/components/CardSecondary/CardSecondary.css +99 -0
- package/dist/esm/components/CardSecondary/CardSecondary.module.css.js +25 -0
- package/dist/esm/components/CardSecondary/CardSecondary.module.css.js.map +1 -0
- package/dist/esm/components/CardSecondary/index.js +35 -84
- package/dist/esm/components/CardSecondary/index.js.map +1 -1
- package/dist/esm/components/CodeBlock/CodeBlock.css +48 -0
- package/dist/esm/components/CodeBlock/CodeBlock.module.css.js +14 -0
- package/dist/esm/components/CodeBlock/CodeBlock.module.css.js.map +1 -0
- package/dist/esm/components/CodeBlock/InlineCodeBlock.css +10 -0
- package/dist/esm/components/CodeBlock/InlineCodeBlock.js +7 -14
- package/dist/esm/components/CodeBlock/InlineCodeBlock.js.map +1 -1
- package/dist/esm/components/CodeBlock/InlineCodeBlock.module.css.js +7 -0
- package/dist/esm/components/CodeBlock/InlineCodeBlock.module.css.js.map +1 -0
- package/dist/esm/components/CodeBlock/index.js +20 -51
- package/dist/esm/components/CodeBlock/index.js.map +1 -1
- package/dist/esm/components/CodeBlock/useColorStyle.js +14 -1
- package/dist/esm/components/CodeBlock/useColorStyle.js.map +1 -1
- package/dist/esm/components/ConfirmationDialog/ConfirmationDialog.css +20 -0
- package/dist/esm/components/ConfirmationDialog/ConfirmationDialog.module.css.js +9 -0
- package/dist/esm/components/ConfirmationDialog/ConfirmationDialog.module.css.js.map +1 -0
- package/dist/esm/components/ConfirmationDialog/index.js +6 -11
- package/dist/esm/components/ConfirmationDialog/index.js.map +1 -1
- package/dist/esm/components/ContextMenu/ContextMenu.css +40 -0
- package/dist/esm/components/ContextMenu/ContextMenu.module.css.js +11 -0
- package/dist/esm/components/ContextMenu/ContextMenu.module.css.js.map +1 -0
- package/dist/esm/components/ContextMenu/index.js +34 -48
- package/dist/esm/components/ContextMenu/index.js.map +1 -1
- package/dist/esm/components/CrossButton/CrossButton.css +12 -0
- package/dist/esm/components/CrossButton/CrossButton.module.css.js +6 -0
- package/dist/esm/components/CrossButton/CrossButton.module.css.js.map +1 -0
- package/dist/esm/components/CrossButton/index.js +11 -14
- package/dist/esm/components/CrossButton/index.js.map +1 -1
- package/dist/esm/components/DatePicker/Common.js +1 -1
- package/dist/esm/components/DatePicker/Common.js.map +1 -1
- package/dist/esm/components/DatePicker/DateTimeRangePicker.js +1 -1
- package/dist/esm/components/DatePicker/DateTimeRangePicker.js.map +1 -1
- package/dist/esm/components/Dropdown/Dropdown.css +36 -0
- package/dist/esm/components/Dropdown/Dropdown.module.css.js +9 -0
- package/dist/esm/components/Dropdown/Dropdown.module.css.js.map +1 -0
- package/dist/esm/components/Dropdown/index.js +28 -33
- package/dist/esm/components/Dropdown/index.js.map +1 -1
- package/dist/esm/components/EllipsisContent/EllipsisContent.css +21 -0
- package/dist/esm/components/EllipsisContent/EllipsisContent.module.css.js +6 -0
- package/dist/esm/components/EllipsisContent/EllipsisContent.module.css.js.map +1 -0
- package/dist/esm/components/EllipsisContent/index.js +7 -6
- package/dist/esm/components/EllipsisContent/index.js.map +1 -1
- package/dist/esm/components/EmptyButton/EmptyButton.css +21 -0
- package/dist/esm/components/EmptyButton/EmptyButton.module.css.js +6 -0
- package/dist/esm/components/EmptyButton/EmptyButton.module.css.js.map +1 -0
- package/dist/esm/components/EmptyButton/index.js +10 -4
- package/dist/esm/components/EmptyButton/index.js.map +1 -1
- package/dist/esm/components/FileTabs/FileTabs.css +167 -0
- package/dist/esm/components/FileTabs/FileTabs.module.css.js +26 -0
- package/dist/esm/components/FileTabs/FileTabs.module.css.js.map +1 -0
- package/dist/esm/components/FileTabs/index.js +51 -80
- package/dist/esm/components/FileTabs/index.js.map +1 -1
- package/dist/esm/components/FileUpload/FileMultiUpload.css +8 -0
- package/dist/esm/components/FileUpload/FileMultiUpload.js +3 -9
- package/dist/esm/components/FileUpload/FileMultiUpload.js.map +1 -1
- package/dist/esm/components/FileUpload/FileMultiUpload.module.css.js +6 -0
- package/dist/esm/components/FileUpload/FileMultiUpload.module.css.js.map +1 -0
- package/dist/esm/components/FileUpload/FileUpload.stories-common.css +14 -0
- package/dist/esm/components/FileUpload/FileUploadArea.css +130 -0
- package/dist/esm/components/FileUpload/FileUploadArea.js +87 -64
- package/dist/esm/components/FileUpload/FileUploadArea.js.map +1 -1
- package/dist/esm/components/FileUpload/FileUploadArea.module.css.js +32 -0
- package/dist/esm/components/FileUpload/FileUploadArea.module.css.js.map +1 -0
- package/dist/esm/components/FileUpload/FileUploadItem.css +82 -0
- package/dist/esm/components/FileUpload/FileUploadItem.js +56 -64
- package/dist/esm/components/FileUpload/FileUploadItem.js.map +1 -1
- package/dist/esm/components/FileUpload/FileUploadItem.module.css.js +21 -0
- package/dist/esm/components/FileUpload/FileUploadItem.module.css.js.map +1 -0
- package/dist/esm/components/Flyout/Flyout.css +231 -0
- package/dist/esm/components/Flyout/Flyout.module.css.js +62 -0
- package/dist/esm/components/Flyout/Flyout.module.css.js.map +1 -0
- package/dist/esm/components/Flyout/index.js +149 -127
- package/dist/esm/components/Flyout/index.js.map +1 -1
- package/dist/esm/components/FormContainer/Error.css +4 -0
- package/dist/esm/components/FormContainer/Error.js +8 -9
- package/dist/esm/components/FormContainer/Error.js.map +1 -1
- package/dist/esm/components/FormContainer/Error.module.css.js +7 -0
- package/dist/esm/components/FormContainer/Error.module.css.js.map +1 -0
- package/dist/esm/components/FormContainer/FormElementContainer.css +14 -0
- package/dist/esm/components/FormContainer/FormElementContainer.js +8 -6
- package/dist/esm/components/FormContainer/FormElementContainer.js.map +1 -1
- package/dist/esm/components/FormContainer/FormElementContainer.module.css.js +6 -0
- package/dist/esm/components/FormContainer/FormElementContainer.module.css.js.map +1 -0
- package/dist/esm/components/FormContainer/FormRoot.css +33 -0
- package/dist/esm/components/FormContainer/FormRoot.js +32 -18
- package/dist/esm/components/FormContainer/FormRoot.js.map +1 -1
- package/dist/esm/components/FormContainer/FormRoot.module.css.js +11 -0
- package/dist/esm/components/FormContainer/FormRoot.module.css.js.map +1 -0
- package/dist/esm/components/GenericMenu/GenericMenu.css +176 -0
- package/dist/esm/components/GenericMenu/GenericMenu.module.css.js +18 -0
- package/dist/esm/components/GenericMenu/GenericMenu.module.css.js.map +1 -0
- package/dist/esm/components/GenericMenu/index.js +93 -99
- package/dist/esm/components/GenericMenu/index.js.map +1 -1
- package/dist/esm/components/GridCenter/GridCenter.css +6 -0
- package/dist/esm/components/GridContainer/GridContainer.css +71 -0
- package/dist/esm/components/GridContainer/GridContainer.module.css.js +8 -0
- package/dist/esm/components/GridContainer/GridContainer.module.css.js.map +1 -0
- package/dist/esm/components/GridContainer/index.js +65 -65
- package/dist/esm/components/GridContainer/index.js.map +1 -1
- package/dist/esm/components/HoverCard/index.js +1 -1
- package/dist/esm/components/HoverCard/index.js.map +1 -1
- package/dist/esm/components/IconButton/index.js +2 -1
- package/dist/esm/components/IconButton/index.js.map +1 -1
- package/dist/esm/components/InputWrapper/InputWrapper.css +221 -0
- package/dist/esm/components/InputWrapper/InputWrapper.module.css.js +27 -0
- package/dist/esm/components/InputWrapper/InputWrapper.module.css.js.map +1 -0
- package/dist/esm/components/InputWrapper/index.js +84 -185
- package/dist/esm/components/InputWrapper/index.js.map +1 -1
- package/dist/esm/components/MiddleTruncator/MiddleTruncator.css +22 -0
- package/dist/esm/components/MiddleTruncator/MiddleTruncator.module.css.js +11 -0
- package/dist/esm/components/MiddleTruncator/MiddleTruncator.module.css.js.map +1 -0
- package/dist/esm/components/MiddleTruncator/index.js +5 -17
- package/dist/esm/components/MiddleTruncator/index.js.map +1 -1
- package/dist/esm/components/Pagination/Pagination.css +7 -0
- package/dist/esm/components/Pagination/Pagination.module.css.js +6 -0
- package/dist/esm/components/Pagination/Pagination.module.css.js.map +1 -0
- package/dist/esm/components/Pagination/index.js +3 -5
- package/dist/esm/components/Pagination/index.js.map +1 -1
- package/dist/esm/components/Panel/Panel.css +116 -0
- package/dist/esm/components/Panel/Panel.module.css.js +58 -0
- package/dist/esm/components/Panel/Panel.module.css.js.map +1 -0
- package/dist/esm/components/Panel/index.js +85 -35
- package/dist/esm/components/Panel/index.js.map +1 -1
- package/dist/esm/components/Popover/Popover.css +32 -0
- package/dist/esm/components/Popover/Popover.module.css.js +10 -0
- package/dist/esm/components/Popover/Popover.module.css.js.map +1 -0
- package/dist/esm/components/Popover/index.js +27 -36
- package/dist/esm/components/Popover/index.js.map +1 -1
- package/dist/esm/components/RadioGroup/RadioGroup.css +99 -0
- package/dist/esm/components/RadioGroup/RadioGroup.module.css.js +13 -0
- package/dist/esm/components/RadioGroup/RadioGroup.module.css.js.map +1 -0
- package/dist/esm/components/RadioGroup/index.js +28 -77
- package/dist/esm/components/RadioGroup/index.js.map +1 -1
- package/dist/esm/components/Select/MultiSelectValue.css +19 -0
- package/dist/esm/components/Select/MultiSelectValue.js +4 -9
- package/dist/esm/components/Select/MultiSelectValue.js.map +1 -1
- package/dist/esm/components/Select/MultiSelectValue.module.css.js +7 -0
- package/dist/esm/components/Select/MultiSelectValue.module.css.js.map +1 -0
- package/dist/esm/components/Select/SingleSelectValue.css +10 -0
- package/dist/esm/components/Select/SingleSelectValue.js +3 -5
- package/dist/esm/components/Select/SingleSelectValue.js.map +1 -1
- package/dist/esm/components/Select/SingleSelectValue.module.css.js +6 -0
- package/dist/esm/components/Select/SingleSelectValue.module.css.js.map +1 -0
- package/dist/esm/components/Select/common/InternalSelect.js +4 -9
- package/dist/esm/components/Select/common/InternalSelect.js.map +1 -1
- package/dist/esm/components/Select/common/SelectComponents.css +296 -0
- package/dist/esm/components/Select/common/SelectComponents.js +92 -0
- package/dist/esm/components/Select/common/SelectComponents.js.map +1 -0
- package/dist/esm/components/Select/common/SelectComponents.module.css.js +27 -0
- package/dist/esm/components/Select/common/SelectComponents.module.css.js.map +1 -0
- package/dist/esm/components/SplitButton/SplitButton.css +138 -0
- package/dist/esm/components/SplitButton/SplitButton.module.css.js +15 -0
- package/dist/esm/components/SplitButton/SplitButton.module.css.js.map +1 -0
- package/dist/esm/components/SplitButton/index.js +44 -89
- package/dist/esm/components/SplitButton/index.js.map +1 -1
- package/dist/esm/components/Table/Table.css +375 -0
- package/dist/esm/components/Table/Table.module.css.js +63 -0
- package/dist/esm/components/Table/Table.module.css.js.map +1 -0
- package/dist/esm/components/Table/index.js +132 -214
- package/dist/esm/components/Table/index.js.map +1 -1
- package/dist/esm/components/Toast/Toast.css +142 -0
- package/dist/esm/components/Toast/Toast.module.css.js +26 -0
- package/dist/esm/components/Toast/Toast.module.css.js.map +1 -0
- package/dist/esm/components/Toast/index.js +43 -96
- package/dist/esm/components/Toast/index.js.map +1 -1
- package/dist/esm/components/Tooltip/Tooltip.css +17 -0
- package/dist/esm/components/Tooltip/Tooltip.module.css.js +9 -0
- package/dist/esm/components/Tooltip/Tooltip.module.css.js.map +1 -0
- package/dist/esm/components/Tooltip/index.js +12 -24
- package/dist/esm/components/Tooltip/index.js.map +1 -1
- package/dist/esm/components/VerticalStepper/VerticalStepper.css +302 -0
- package/dist/esm/components/VerticalStepper/VerticalStepper.module.css.js +55 -0
- package/dist/esm/components/VerticalStepper/VerticalStepper.module.css.js.map +1 -0
- package/dist/esm/components/VerticalStepper/index.js +85 -110
- package/dist/esm/components/VerticalStepper/index.js.map +1 -1
- package/dist/types/components/Assets/Logos/Polaris.d.ts +3 -0
- package/dist/types/components/Assets/Logos/system/types.d.ts +1 -1
- package/dist/types/components/AutoComplete/AutoComplete.d.ts +1 -1
- package/dist/types/components/BigStat/BigStat.d.ts +1 -1
- package/dist/types/components/Button/BaseButton.d.ts +2 -1
- package/dist/types/components/CardPromotion/CardPromotion.d.ts +1 -1
- package/dist/types/components/CardSecondary/CardSecondary.d.ts +1 -1
- package/dist/types/components/CodeBlock/CodeBlock.d.ts +1 -1
- package/dist/types/components/CodeBlock/InlineCodeBlock.d.ts +1 -1
- package/dist/types/components/CodeBlock/useColorStyle.d.ts +6 -112
- package/dist/types/components/ConfirmationDialog/ConfirmationDialog.d.ts +1 -1
- package/dist/types/components/ContextMenu/ContextMenu.d.ts +1 -1
- package/dist/types/components/CrossButton/CrossButton.d.ts +2 -3
- package/dist/types/components/Dropdown/Dropdown.d.ts +2 -2
- package/dist/types/components/EmptyButton/EmptyButton.d.ts +2 -1
- package/dist/types/components/FileTabs/FileTabs.d.ts +3 -3
- package/dist/types/components/FileUpload/FileUpload.stories-common.d.ts +4 -1
- package/dist/types/components/Flyout/Flyout.d.ts +8 -6
- package/dist/types/components/Flyout/Flyout.types.d.ts +3 -0
- package/dist/types/components/FormContainer/Error.d.ts +2 -1
- package/dist/types/components/FormContainer/FormElementContainer.d.ts +2 -1
- package/dist/types/components/FormContainer/FormRoot.d.ts +6 -4
- package/dist/types/components/GenericMenu/GenericMenu.d.ts +29 -12
- package/dist/types/components/GridCenter/GridCenter.d.ts +9 -1
- package/dist/types/components/IconButton/IconButton.types.d.ts +3 -0
- package/dist/types/components/InputWrapper/InputWrapper.d.ts +17 -13
- package/dist/types/components/Panel/Panel.d.ts +2 -39
- package/dist/types/components/RadioGroup/RadioGroup.d.ts +2 -2
- package/dist/types/components/Select/common/SelectComponents.d.ts +33 -0
- package/dist/types/components/SplitButton/SplitButton.d.ts +1 -1
- package/dist/types/components/SplitButton/SplitButton.types.d.ts +3 -0
- package/dist/types/components/Toast/Toast.d.ts +1 -1
- package/dist/types/components/Tooltip/Tooltip.d.ts +1 -1
- package/dist/types/components/VerticalStepper/VerticalStepper.d.ts +2 -2
- package/package.json +1 -1
- package/dist/cjs/components/Select/common/SelectStyled.cjs +0 -194
- package/dist/cjs/components/Select/common/SelectStyled.cjs.map +0 -1
- package/dist/esm/components/Select/common/SelectStyled.js +0 -176
- package/dist/esm/components/Select/common/SelectStyled.js.map +0 -1
- package/dist/types/components/Select/common/SelectStyled.d.ts +0 -34
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
const styles = {
|
|
2
|
+
"select-value": "select-value__CxDXF",
|
|
3
|
+
"select-trigger": "select-trigger__k4Odp",
|
|
4
|
+
"select-trigger_error": "select-trigger_error__fZGGT",
|
|
5
|
+
"select-popover-content": "select-popover-content__30txk",
|
|
6
|
+
"select-popover-content_full-width": "select-popover-content_full-width__frIlp",
|
|
7
|
+
"search-bar-container": "search-bar-container__bidMt",
|
|
8
|
+
"search-bar-container_show-search": "search-bar-container_show-search__YLR4i",
|
|
9
|
+
"search-bar": "search-bar__J2qTl",
|
|
10
|
+
"search-bar_show-search": "search-bar_show-search__IhdJT",
|
|
11
|
+
"search-close": "search-close__dB1cs",
|
|
12
|
+
"search-close_show-close": "search-close_show-close__-Anjf",
|
|
13
|
+
"select-list": "select-list__CNYUb",
|
|
14
|
+
"select-list-content": "select-list-content__AJbe9",
|
|
15
|
+
"hidden-select-element": "hidden-select-element__YZlhL",
|
|
16
|
+
"select-group-container": "select-group-container__Pd5rW",
|
|
17
|
+
"select-group-name": "select-group-name__TrAy3",
|
|
18
|
+
"select-group-content": "select-group-content__OBO5d",
|
|
19
|
+
"select-no-data-container": "select-no-data-container__b2319",
|
|
20
|
+
"select-no-data-container_clickable": "select-no-data-container_clickable__J6Bkj",
|
|
21
|
+
"check-icon": "check-icon__ORxKK",
|
|
22
|
+
"check-icon_show-check": "check-icon_show-check__rVelk",
|
|
23
|
+
"select-item-description-text": "select-item-description-text__eKqEn"
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
export { styles as default };
|
|
27
|
+
//# sourceMappingURL=SelectComponents.module.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SelectComponents.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,138 @@
|
|
|
1
|
+
.split-button__EX3XI {
|
|
2
|
+
display: inline-flex;
|
|
3
|
+
width: revert;
|
|
4
|
+
overflow: hidden;
|
|
5
|
+
align-items: center;
|
|
6
|
+
border: 1px solid var(--split-stroke-default);
|
|
7
|
+
border-radius: var(--click-button-radii-all);
|
|
8
|
+
user-select: none;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
.split-button_type_primary__n4Kxb {
|
|
12
|
+
--split-stroke-default: var(--click-button-split-primary-stroke-default);
|
|
13
|
+
--split-stroke-hover: var(--click-button-split-primary-stroke-hover);
|
|
14
|
+
--split-stroke-active: var(--click-button-split-primary-stroke-active);
|
|
15
|
+
--split-stroke-disabled: var(--click-button-split-primary-stroke-disabled);
|
|
16
|
+
--split-bg-main-default: var(--click-button-split-primary-background-main-default);
|
|
17
|
+
--split-bg-main-hover: var(--click-button-split-primary-background-main-hover);
|
|
18
|
+
--split-bg-main-active: var(--click-button-split-primary-background-main-active);
|
|
19
|
+
--split-bg-main-disabled: var(--click-button-split-primary-background-main-disabled);
|
|
20
|
+
--split-bg-action-default: var(--click-button-split-primary-background-action-default);
|
|
21
|
+
--split-bg-action-hover: var(--click-button-split-primary-background-action-hover);
|
|
22
|
+
--split-bg-action-active: var(--click-button-split-primary-background-action-active);
|
|
23
|
+
--split-bg-action-disabled: var(--click-button-split-primary-background-action-disabled);
|
|
24
|
+
--split-text-default: var(--click-button-split-primary-text-default);
|
|
25
|
+
--split-text-hover: var(--click-button-split-primary-text-hover);
|
|
26
|
+
--split-text-active: var(--click-button-split-primary-text-active);
|
|
27
|
+
--split-text-disabled: var(--click-button-split-primary-text-disabled);
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.split-button_type_secondary__CMY5T {
|
|
31
|
+
--split-stroke-default: var(--click-button-split-secondary-stroke-default);
|
|
32
|
+
--split-stroke-hover: var(--click-button-split-secondary-stroke-hover);
|
|
33
|
+
--split-stroke-active: var(--click-button-split-secondary-stroke-active);
|
|
34
|
+
--split-stroke-disabled: var(--click-button-split-secondary-stroke-disabled);
|
|
35
|
+
--split-bg-main-default: var(--click-button-split-secondary-background-main-default);
|
|
36
|
+
--split-bg-main-hover: var(--click-button-split-secondary-background-main-hover);
|
|
37
|
+
--split-bg-main-active: var(--click-button-split-secondary-background-main-active);
|
|
38
|
+
--split-bg-main-disabled: var(--click-button-split-secondary-background-main-disabled);
|
|
39
|
+
--split-bg-action-default: var(--click-button-split-secondary-background-action-default);
|
|
40
|
+
--split-bg-action-hover: var(--click-button-split-secondary-background-action-hover);
|
|
41
|
+
--split-bg-action-active: var(--click-button-split-secondary-background-action-active);
|
|
42
|
+
--split-bg-action-disabled: var(--click-button-split-secondary-background-action-disabled);
|
|
43
|
+
--split-text-default: var(--click-button-split-secondary-text-default);
|
|
44
|
+
--split-text-hover: var(--click-button-split-secondary-text-hover);
|
|
45
|
+
--split-text-active: var(--click-button-split-secondary-text-active);
|
|
46
|
+
--split-text-disabled: var(--click-button-split-secondary-text-disabled);
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.split-button_fill-width__4-oog {
|
|
50
|
+
width: 100%;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.split-button__EX3XI:hover {
|
|
54
|
+
border-color: var(--split-stroke-hover);
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
.split-button__EX3XI:focus-within {
|
|
58
|
+
border-color: var(--split-stroke-active);
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
/* stylelint-disable no-descending-specificity -- disabled state intentionally
|
|
62
|
+
defined after hover/focus-within to mirror the source cascade order; the
|
|
63
|
+
pre-migration original omitted the hover/focus-within rules entirely when
|
|
64
|
+
disabled, so the disabled border-color must win over them. */
|
|
65
|
+
.split-button_disabled__597A-,
|
|
66
|
+
.split-button_disabled__597A-:hover,
|
|
67
|
+
.split-button_disabled__597A-:focus-within {
|
|
68
|
+
border-color: var(--split-stroke-disabled);
|
|
69
|
+
cursor: not-allowed;
|
|
70
|
+
}
|
|
71
|
+
/* stylelint-enable no-descending-specificity */
|
|
72
|
+
|
|
73
|
+
.split-button__primary__1RIoP {
|
|
74
|
+
width: revert;
|
|
75
|
+
padding: var(--click-button-split-space-y) var(--click-button-split-space-x);
|
|
76
|
+
justify-content: center;
|
|
77
|
+
align-items: center;
|
|
78
|
+
align-self: stretch;
|
|
79
|
+
border: none;
|
|
80
|
+
border-radius: 0;
|
|
81
|
+
background: var(--split-bg-main-default);
|
|
82
|
+
color: var(--split-text-default);
|
|
83
|
+
font: var(--click-button-split-typography-label-default);
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.split-button__primary_fill-width__RRkLi {
|
|
87
|
+
width: 100%;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.split-button__primary__1RIoP:hover {
|
|
91
|
+
background: var(--split-bg-main-hover);
|
|
92
|
+
color: var(--split-text-hover);
|
|
93
|
+
font: var(--click-button-split-typography-label-hover);
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
.split-button__primary__1RIoP:focus {
|
|
97
|
+
background: var(--split-bg-main-active);
|
|
98
|
+
color: var(--split-text-active);
|
|
99
|
+
font: var(--click-button-split-typography-label-active);
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
.split-button__primary__1RIoP:disabled {
|
|
103
|
+
background: var(--split-bg-main-disabled);
|
|
104
|
+
color: var(--split-text-disabled);
|
|
105
|
+
font: var(--click-button-split-typography-label-disabled);
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.split-button__secondary__CYtzX {
|
|
109
|
+
padding: var(--click-button-split-icon-space-y) var(--click-button-split-icon-space-x);
|
|
110
|
+
align-self: stretch;
|
|
111
|
+
border: none;
|
|
112
|
+
border-radius: 0;
|
|
113
|
+
background: var(--split-bg-action-default);
|
|
114
|
+
color: var(--split-text-default);
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.split-button__secondary__CYtzX:hover {
|
|
118
|
+
background: var(--split-bg-action-hover);
|
|
119
|
+
color: var(--split-text-hover);
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
.split-button__secondary__CYtzX:focus {
|
|
123
|
+
background: var(--split-bg-action-active);
|
|
124
|
+
color: var(--split-text-active);
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
.split-button__secondary__CYtzX[data-disabled] {
|
|
128
|
+
background: var(--split-bg-action-disabled);
|
|
129
|
+
color: var(--split-text-disabled);
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
.split-button__button-data__8yyZR {
|
|
133
|
+
width: auto;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
.split-button__dropdown-content__nmia- {
|
|
137
|
+
min-width: var(--split-button-dropdown-min-width, 0);
|
|
138
|
+
}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
const styles = {
|
|
2
|
+
"split-button": "split-button__EX3XI",
|
|
3
|
+
"split-button_type_primary": "split-button_type_primary__n4Kxb",
|
|
4
|
+
"split-button_type_secondary": "split-button_type_secondary__CMY5T",
|
|
5
|
+
"split-button_fill-width": "split-button_fill-width__4-oog",
|
|
6
|
+
"split-button_disabled": "split-button_disabled__597A-",
|
|
7
|
+
"split-button__primary": "split-button__primary__1RIoP",
|
|
8
|
+
"split-button__primary_fill-width": "split-button__primary_fill-width__RRkLi",
|
|
9
|
+
"split-button__secondary": "split-button__secondary__CYtzX",
|
|
10
|
+
"split-button__button-data": "split-button__button-data__8yyZR",
|
|
11
|
+
"split-button__dropdown-content": "split-button__dropdown-content__nmia-"
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
export { styles as default };
|
|
15
|
+
//# sourceMappingURL=SplitButton.module.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SplitButton.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;"}
|
|
@@ -1,13 +1,41 @@
|
|
|
1
|
+
import "./SplitButton.css";
|
|
1
2
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { useRef, useState, useEffect } from 'react';
|
|
3
|
-
import { styled } from 'styled-components';
|
|
3
|
+
import { useRef, useState, useEffect, useMemo } from 'react';
|
|
4
4
|
import { BaseButton } from '../Button/BaseButton.js';
|
|
5
5
|
import { IconWrapper } from '../IconWrapper/index.js';
|
|
6
|
+
import { cn } from '../../lib/cva.js';
|
|
7
|
+
import styles from './SplitButton.module.css.js';
|
|
6
8
|
import { Dropdown } from '../Dropdown/index.js';
|
|
7
9
|
import { Icon as SvgImage } from '../Icon/index.js';
|
|
10
|
+
import { cva } from 'class-variance-authority';
|
|
8
11
|
|
|
12
|
+
const triggerVariants = cva(styles["split-button"], {
|
|
13
|
+
variants: {
|
|
14
|
+
type: {
|
|
15
|
+
primary: styles["split-button_type_primary"],
|
|
16
|
+
secondary: styles["split-button_type_secondary"]
|
|
17
|
+
},
|
|
18
|
+
fillWidth: {
|
|
19
|
+
true: styles["split-button_fill-width"]
|
|
20
|
+
},
|
|
21
|
+
disabled: {
|
|
22
|
+
true: styles["split-button_disabled"]
|
|
23
|
+
}
|
|
24
|
+
},
|
|
25
|
+
defaultVariants: {
|
|
26
|
+
type: "primary"
|
|
27
|
+
}
|
|
28
|
+
});
|
|
29
|
+
const primaryVariants = cva(styles["split-button__primary"], {
|
|
30
|
+
variants: {
|
|
31
|
+
fillWidth: {
|
|
32
|
+
true: styles["split-button__primary_fill-width"]
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
});
|
|
9
36
|
const SplitButton = ({
|
|
10
37
|
type = "primary",
|
|
38
|
+
htmlType,
|
|
11
39
|
disabled,
|
|
12
40
|
menu,
|
|
13
41
|
dir,
|
|
@@ -20,6 +48,7 @@ const SplitButton = ({
|
|
|
20
48
|
children,
|
|
21
49
|
icon,
|
|
22
50
|
iconDir = "start",
|
|
51
|
+
className,
|
|
23
52
|
...props
|
|
24
53
|
}) => {
|
|
25
54
|
const ref = useRef(null);
|
|
@@ -39,19 +68,23 @@ const SplitButton = ({
|
|
|
39
68
|
resizeObserver.unobserve(targetDiv);
|
|
40
69
|
};
|
|
41
70
|
}, []);
|
|
71
|
+
const contentStyle = useMemo(() => ({
|
|
72
|
+
"--split-button-dropdown-min-width": `${width}px`
|
|
73
|
+
}), [width]);
|
|
42
74
|
return /* @__PURE__ */ jsxs(Dropdown, { dir, open, defaultOpen, onOpenChange, modal, children: [
|
|
43
|
-
/* @__PURE__ */ jsxs(
|
|
44
|
-
|
|
45
|
-
|
|
75
|
+
/* @__PURE__ */ jsxs("div", { ref, className: cn(triggerVariants({
|
|
76
|
+
type,
|
|
77
|
+
fillWidth,
|
|
78
|
+
disabled
|
|
79
|
+
})), children: [
|
|
80
|
+
/* @__PURE__ */ jsx(BaseButton, { disabled, ...props, type: htmlType, className: cn(primaryVariants({
|
|
81
|
+
fillWidth
|
|
82
|
+
}), className), children: /* @__PURE__ */ jsx(IconWrapper, { className: styles["split-button__button-data"], icon, iconDir, children }) }),
|
|
83
|
+
/* @__PURE__ */ jsx(Dropdown.Trigger, { disabled, asChild: true, "data-testid": "split-button-dropdown", className: styles["split-button__secondary"], children: /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(SvgImage, { name: "chevron-down", size: "sm" }) }) })
|
|
46
84
|
] }),
|
|
47
|
-
/* @__PURE__ */ jsx(
|
|
85
|
+
/* @__PURE__ */ jsx(Dropdown.Content, { side, sideOffset: 4, align: "end", className: styles["split-button__dropdown-content"], style: contentStyle, children: menu.map((item, index) => /* @__PURE__ */ jsx(MenuContentItem, { parentKey: `split-menu-option-${index}`, ...item }, `split-menu-option-${index}`)) })
|
|
48
86
|
] });
|
|
49
87
|
};
|
|
50
|
-
const DropdownContent = styled.div.withConfig({
|
|
51
|
-
componentId: "sc-85zs9e-0"
|
|
52
|
-
})(["min-width:", "px;"], ({
|
|
53
|
-
$width
|
|
54
|
-
}) => $width);
|
|
55
88
|
const MenuContentItem = ({
|
|
56
89
|
items = [],
|
|
57
90
|
type = "item",
|
|
@@ -74,84 +107,6 @@ const MenuContentItem = ({
|
|
|
74
107
|
] });
|
|
75
108
|
}
|
|
76
109
|
};
|
|
77
|
-
const SplitButtonTrigger = styled.div.withConfig({
|
|
78
|
-
componentId: "sc-85zs9e-1"
|
|
79
|
-
})(["display:inline-flex;align-items:center;overflow:hidden;user-select:none;", ""], ({
|
|
80
|
-
theme,
|
|
81
|
-
$disabled = false,
|
|
82
|
-
$type,
|
|
83
|
-
$fillWidth
|
|
84
|
-
}) => `
|
|
85
|
-
width: ${$fillWidth ? "100%" : "revert"};
|
|
86
|
-
border-radius: ${theme.click.button.radii.all};
|
|
87
|
-
border: 1px solid ${theme.click.button.split[$type].stroke.default};
|
|
88
|
-
${$disabled ? `
|
|
89
|
-
cursor: not-allowed;
|
|
90
|
-
border-color: ${theme.click.button.split[$type].stroke.disabled};
|
|
91
|
-
` : `
|
|
92
|
-
&:hover {
|
|
93
|
-
border-color: ${theme.click.button.split[$type].stroke.hover};
|
|
94
|
-
}
|
|
95
|
-
&:focus-within {
|
|
96
|
-
border-color: ${theme.click.button.split[$type].stroke.active};
|
|
97
|
-
}
|
|
98
|
-
`}
|
|
99
|
-
`);
|
|
100
|
-
const PrimaryButton = styled(BaseButton).withConfig({
|
|
101
|
-
componentId: "sc-85zs9e-2"
|
|
102
|
-
})(["border:none;align-self:stretch;border-radius:0;align-items:center;padding:", ";", ""], ({
|
|
103
|
-
theme
|
|
104
|
-
}) => `${theme.click.button.split.space.y} ${theme.click.button.split.space.x}`, ({
|
|
105
|
-
theme,
|
|
106
|
-
$type,
|
|
107
|
-
$fillWidth
|
|
108
|
-
}) => `
|
|
109
|
-
width: ${$fillWidth ? "100%" : "revert"};
|
|
110
|
-
justify-content: center;
|
|
111
|
-
background: ${theme.click.button.split[$type].background.main.default};
|
|
112
|
-
color: ${theme.click.button.split[$type].text.default};
|
|
113
|
-
font: ${theme.click.button.split.typography.label.default};
|
|
114
|
-
&:hover {
|
|
115
|
-
background: ${theme.click.button.split[$type].background.main.hover};
|
|
116
|
-
color: ${theme.click.button.split[$type].text.hover};
|
|
117
|
-
font: ${theme.click.button.split.typography.label.hover};
|
|
118
|
-
}
|
|
119
|
-
&:focus {
|
|
120
|
-
background: ${theme.click.button.split[$type].background.main.active};
|
|
121
|
-
color: ${theme.click.button.split[$type].text.active};
|
|
122
|
-
font: ${theme.click.button.split.typography.label.active};
|
|
123
|
-
}
|
|
124
|
-
&:disabled {
|
|
125
|
-
background: ${theme.click.button.split[$type].background.main.disabled};
|
|
126
|
-
color: ${theme.click.button.split[$type].text.disabled};
|
|
127
|
-
font: ${theme.click.button.split.typography.label.disabled};
|
|
128
|
-
}
|
|
129
|
-
`);
|
|
130
|
-
const SecondaryButton = styled(BaseButton).withConfig({
|
|
131
|
-
componentId: "sc-85zs9e-3"
|
|
132
|
-
})(["border:none;align-self:stretch;border-radius:0;", ""], ({
|
|
133
|
-
theme,
|
|
134
|
-
$type
|
|
135
|
-
}) => `
|
|
136
|
-
padding: ${theme.click.button.split.icon.space.y} ${theme.click.button.split.icon.space.x};
|
|
137
|
-
background: ${theme.click.button.split[$type].background.action.default};
|
|
138
|
-
color: ${theme.click.button.split[$type].text.default};
|
|
139
|
-
&:hover {
|
|
140
|
-
background: ${theme.click.button.split[$type].background.action.hover};
|
|
141
|
-
color: ${theme.click.button.split[$type].text.hover};
|
|
142
|
-
}
|
|
143
|
-
&:focus {
|
|
144
|
-
background: ${theme.click.button.split[$type].background.action.active};
|
|
145
|
-
color: ${theme.click.button.split[$type].text.active};
|
|
146
|
-
}
|
|
147
|
-
&[data-disabled] {
|
|
148
|
-
background: ${theme.click.button.split[$type].background.action.disabled};
|
|
149
|
-
color: ${theme.click.button.split[$type].text.disabled};
|
|
150
|
-
}
|
|
151
|
-
`);
|
|
152
|
-
const ButtonData = styled.div.withConfig({
|
|
153
|
-
componentId: "sc-85zs9e-4"
|
|
154
|
-
})(["width:auto;"]);
|
|
155
110
|
|
|
156
111
|
export { SplitButton };
|
|
157
112
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { styled } from 'styled-components';\nimport { Dropdown } from '@/components/Dropdown';\nimport { BaseButton } from '@/components/Button/BaseButton';\nimport { IconWrapper } from '@/components/IconWrapper';\nimport { Icon } from '@/components/Icon';\nimport { SplitButtonProps, Menu, ButtonType } from './SplitButton.types';\n\nexport const SplitButton = ({\n type = 'primary',\n disabled,\n menu,\n dir,\n open,\n defaultOpen,\n onOpenChange,\n modal,\n side,\n fillWidth,\n children,\n icon,\n iconDir = 'start',\n ...props\n}: SplitButtonProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const [width, setWidth] = useState(0);\n\n useEffect(() => {\n const targetDiv = ref.current;\n if (!targetDiv) {\n return;\n }\n\n const resizeObserver = new ResizeObserver(entries => {\n for (const entry of entries) {\n setWidth(entry.target.clientWidth);\n }\n });\n\n resizeObserver.observe(targetDiv);\n\n return () => {\n resizeObserver.unobserve(targetDiv);\n };\n }, []);\n\n return (\n <Dropdown\n dir={dir}\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n modal={modal}\n >\n <SplitButtonTrigger\n $disabled={disabled}\n $fillWidth={fillWidth}\n ref={ref}\n $type={type}\n >\n <PrimaryButton\n disabled={disabled}\n $type={type}\n $fillWidth={fillWidth}\n {...props}\n >\n <ButtonData\n as={IconWrapper}\n icon={icon}\n iconDir={iconDir}\n >\n {children}\n </ButtonData>\n </PrimaryButton>\n <SecondaryButton\n as={Dropdown.Trigger}\n disabled={disabled}\n $type={type}\n asChild\n data-testid=\"split-button-dropdown\"\n >\n <span>\n <Icon\n name=\"chevron-down\"\n size=\"sm\"\n />\n </span>\n </SecondaryButton>\n </SplitButtonTrigger>\n <DropdownContent\n as={Dropdown.Content}\n side={side}\n $width={width}\n sideOffset={4}\n align=\"end\"\n >\n {menu.map((item: Menu, index: number) => (\n <MenuContentItem\n key={`split-menu-option-${index}`}\n parentKey={`split-menu-option-${index}`}\n {...item}\n />\n ))}\n </DropdownContent>\n </Dropdown>\n );\n};\n\nconst DropdownContent = styled.div<{ $width: number }>`\n min-width: ${({ $width }) => $width}px;\n`;\n\nconst MenuContentItem = ({\n items = [],\n type = 'item',\n label,\n icon,\n iconDir = 'start',\n parentKey,\n ...props\n}: Menu & { parentKey: string }) => {\n if (type === 'item') {\n return (\n <Dropdown.Item {...props}>\n <IconWrapper\n icon={icon}\n iconDir={iconDir}\n >\n {label}\n </IconWrapper>\n </Dropdown.Item>\n );\n }\n if (type === 'group') {\n return (\n <Dropdown.Group>\n {items.map((item, index) => (\n <MenuContentItem\n key={`${parentKey}-group-${index}`}\n parentKey={`${parentKey}-group-${index}`}\n {...item}\n />\n ))}\n </Dropdown.Group>\n );\n }\n if (type === 'sub-menu') {\n return (\n <Dropdown.Sub>\n <Dropdown.Trigger\n sub\n {...props}\n >\n <IconWrapper\n icon={icon}\n iconDir={iconDir}\n >\n {label}\n </IconWrapper>\n </Dropdown.Trigger>\n <Dropdown.Content sub>\n {items.map((item, index) => (\n <MenuContentItem\n key={`${parentKey}-sub-menu-${index}`}\n parentKey={`${parentKey}-sub-menu-${index}`}\n {...item}\n />\n ))}\n </Dropdown.Content>\n </Dropdown.Sub>\n );\n }\n};\n\nconst SplitButtonTrigger = styled.div<{\n $disabled?: boolean;\n $type: ButtonType;\n $fillWidth?: boolean;\n}>`\n display: inline-flex;\n align-items: center;\n overflow: hidden;\n user-select: none;\n ${({ theme, $disabled = false, $type, $fillWidth }) => `\n width: ${$fillWidth ? '100%' : 'revert'};\n border-radius: ${theme.click.button.radii.all};\n border: 1px solid ${theme.click.button.split[$type].stroke.default};\n ${\n $disabled\n ? `\n cursor: not-allowed;\n border-color: ${theme.click.button.split[$type].stroke.disabled};\n `\n : `\n &:hover {\n border-color: ${theme.click.button.split[$type].stroke.hover};\n }\n &:focus-within {\n border-color: ${theme.click.button.split[$type].stroke.active};\n }\n `\n }\n `}\n`;\n\nconst PrimaryButton = styled(BaseButton)<{\n $type: ButtonType;\n $fillWidth?: boolean;\n}>`\n border: none;\n align-self: stretch;\n border-radius: 0;\n align-items: center;\n padding: ${({ theme }) =>\n `${theme.click.button.split.space.y} ${theme.click.button.split.space.x}`};\n ${({ theme, $type, $fillWidth }) => `\n width: ${$fillWidth ? '100%' : 'revert'};\n justify-content: center;\n background: ${theme.click.button.split[$type].background.main.default};\n color: ${theme.click.button.split[$type].text.default};\n font: ${theme.click.button.split.typography.label.default};\n &:hover {\n background: ${theme.click.button.split[$type].background.main.hover};\n color: ${theme.click.button.split[$type].text.hover};\n font: ${theme.click.button.split.typography.label.hover};\n }\n &:focus {\n background: ${theme.click.button.split[$type].background.main.active};\n color: ${theme.click.button.split[$type].text.active};\n font: ${theme.click.button.split.typography.label.active};\n }\n &:disabled {\n background: ${theme.click.button.split[$type].background.main.disabled};\n color: ${theme.click.button.split[$type].text.disabled};\n font: ${theme.click.button.split.typography.label.disabled};\n }\n `}\n`;\n\nconst SecondaryButton = styled(BaseButton)<{ $type: ButtonType }>`\n border: none;\n align-self: stretch;\n border-radius: 0;\n ${({ theme, $type }) => `\n padding: ${theme.click.button.split.icon.space.y} ${theme.click.button.split.icon.space.x};\n background: ${theme.click.button.split[$type].background.action.default};\n color: ${theme.click.button.split[$type].text.default};\n &:hover {\n background: ${theme.click.button.split[$type].background.action.hover};\n color: ${theme.click.button.split[$type].text.hover};\n }\n &:focus {\n background: ${theme.click.button.split[$type].background.action.active};\n color: ${theme.click.button.split[$type].text.active};\n }\n &[data-disabled] {\n background: ${theme.click.button.split[$type].background.action.disabled};\n color: ${theme.click.button.split[$type].text.disabled};\n }\n `}\n`;\n\nconst ButtonData = styled.div`\n width: auto;\n`;\n"],"names":["SplitButton","type","disabled","menu","dir","open","defaultOpen","onOpenChange","modal","side","fillWidth","children","icon","iconDir","props","ref","useRef","width","setWidth","useState","useEffect","targetDiv","current","resizeObserver","ResizeObserver","entries","entry","target","clientWidth","observe","unobserve","IconWrapper","Dropdown","Trigger","Icon","Content","map","item","index","DropdownContent","styled","div","withConfig","componentId","$width","MenuContentItem","items","label","parentKey","SplitButtonTrigger","theme","$disabled","$type","$fillWidth","click","button","radii","all","split","stroke","default","hover","active","PrimaryButton","BaseButton","space","y","x","background","main","text","typography","SecondaryButton","action","ButtonData"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["import { CSSProperties, useEffect, useMemo, useRef, useState } from 'react';\nimport { Dropdown } from '@/components/Dropdown';\nimport { BaseButton } from '@/components/Button/BaseButton';\nimport { IconWrapper } from '@/components/IconWrapper';\nimport { Icon } from '@/components/Icon';\nimport { cn, cva } from '@/lib/cva';\nimport { SplitButtonProps, Menu } from './SplitButton.types';\nimport styles from './SplitButton.module.css';\n\nconst triggerVariants = cva(styles['split-button'], {\n variants: {\n type: {\n primary: styles['split-button_type_primary'],\n secondary: styles['split-button_type_secondary'],\n },\n fillWidth: {\n true: styles['split-button_fill-width'],\n },\n disabled: {\n true: styles['split-button_disabled'],\n },\n },\n defaultVariants: {\n type: 'primary',\n },\n});\n\nconst primaryVariants = cva(styles['split-button__primary'], {\n variants: {\n fillWidth: {\n true: styles['split-button__primary_fill-width'],\n },\n },\n});\n\nexport const SplitButton = ({\n type = 'primary',\n htmlType,\n disabled,\n menu,\n dir,\n open,\n defaultOpen,\n onOpenChange,\n modal,\n side,\n fillWidth,\n children,\n icon,\n iconDir = 'start',\n className,\n ...props\n}: SplitButtonProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const [width, setWidth] = useState(0);\n\n useEffect(() => {\n const targetDiv = ref.current;\n if (!targetDiv) {\n return;\n }\n\n const resizeObserver = new ResizeObserver(entries => {\n for (const entry of entries) {\n setWidth(entry.target.clientWidth);\n }\n });\n\n resizeObserver.observe(targetDiv);\n\n return () => {\n resizeObserver.unobserve(targetDiv);\n };\n }, []);\n\n const contentStyle = useMemo(\n () =>\n ({\n '--split-button-dropdown-min-width': `${width}px`,\n }) as CSSProperties,\n [width]\n );\n\n return (\n <Dropdown\n dir={dir}\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n modal={modal}\n >\n <div\n ref={ref}\n className={cn(triggerVariants({ type, fillWidth, disabled }))}\n >\n <BaseButton\n disabled={disabled}\n {...props}\n type={htmlType}\n className={cn(primaryVariants({ fillWidth }), className)}\n >\n <IconWrapper\n className={styles['split-button__button-data']}\n icon={icon}\n iconDir={iconDir}\n >\n {children}\n </IconWrapper>\n </BaseButton>\n <Dropdown.Trigger\n disabled={disabled}\n asChild\n data-testid=\"split-button-dropdown\"\n className={styles['split-button__secondary']}\n >\n <span>\n <Icon\n name=\"chevron-down\"\n size=\"sm\"\n />\n </span>\n </Dropdown.Trigger>\n </div>\n <Dropdown.Content\n side={side}\n sideOffset={4}\n align=\"end\"\n className={styles['split-button__dropdown-content']}\n style={contentStyle}\n >\n {menu.map((item: Menu, index: number) => (\n <MenuContentItem\n key={`split-menu-option-${index}`}\n parentKey={`split-menu-option-${index}`}\n {...item}\n />\n ))}\n </Dropdown.Content>\n </Dropdown>\n );\n};\n\nconst MenuContentItem = ({\n items = [],\n type = 'item',\n label,\n icon,\n iconDir = 'start',\n parentKey,\n ...props\n}: Menu & { parentKey: string }) => {\n if (type === 'item') {\n return (\n <Dropdown.Item {...props}>\n <IconWrapper\n icon={icon}\n iconDir={iconDir}\n >\n {label}\n </IconWrapper>\n </Dropdown.Item>\n );\n }\n if (type === 'group') {\n return (\n <Dropdown.Group>\n {items.map((item, index) => (\n <MenuContentItem\n key={`${parentKey}-group-${index}`}\n parentKey={`${parentKey}-group-${index}`}\n {...item}\n />\n ))}\n </Dropdown.Group>\n );\n }\n if (type === 'sub-menu') {\n return (\n <Dropdown.Sub>\n <Dropdown.Trigger\n sub\n {...props}\n >\n <IconWrapper\n icon={icon}\n iconDir={iconDir}\n >\n {label}\n </IconWrapper>\n </Dropdown.Trigger>\n <Dropdown.Content sub>\n {items.map((item, index) => (\n <MenuContentItem\n key={`${parentKey}-sub-menu-${index}`}\n parentKey={`${parentKey}-sub-menu-${index}`}\n {...item}\n />\n ))}\n </Dropdown.Content>\n </Dropdown.Sub>\n );\n }\n};\n"],"names":["triggerVariants","cva","styles","variants","type","primary","secondary","fillWidth","true","disabled","defaultVariants","primaryVariants","SplitButton","htmlType","menu","dir","open","defaultOpen","onOpenChange","modal","side","children","icon","iconDir","className","props","ref","useRef","width","setWidth","useState","useEffect","targetDiv","current","resizeObserver","ResizeObserver","entries","entry","target","clientWidth","observe","unobserve","contentStyle","useMemo","cn","Icon","map","item","index","MenuContentItem","items","label","parentKey"],"mappings":"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"}
|