@seeqdev/qomponents 0.0.156 → 0.0.158
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/README.md +135 -135
- package/dist/Accordion/Accordion.js +7 -0
- package/dist/Accordion/Accordion.js.map +1 -0
- package/dist/Accordion/Accordion.stories.js +75 -0
- package/dist/Accordion/Accordion.stories.js.map +1 -0
- package/dist/Accordion/Accordion.test.js +55 -0
- package/dist/Accordion/Accordion.test.js.map +1 -0
- package/dist/Accordion/Accordion.types.js +2 -0
- package/dist/Accordion/Accordion.types.js.map +1 -0
- package/dist/Accordion/index.js +2 -0
- package/dist/Accordion/index.js.map +1 -0
- package/dist/Alert/Alert.js +32 -0
- package/dist/Alert/Alert.js.map +1 -0
- package/dist/Alert/Alert.stories.js +57 -0
- package/dist/Alert/Alert.stories.js.map +1 -0
- package/dist/Alert/Alert.test.js +50 -0
- package/dist/Alert/Alert.test.js.map +1 -0
- package/dist/Alert/Alert.types.js +2 -0
- package/dist/Alert/Alert.types.js.map +1 -0
- package/dist/Alert/index.js +2 -0
- package/dist/Alert/index.js.map +1 -0
- package/dist/Button/Button.js +89 -0
- package/dist/Button/Button.js.map +1 -0
- package/dist/Button/Button.stories.js +25 -0
- package/dist/Button/Button.stories.js.map +1 -0
- package/dist/Button/Button.test.js +47 -0
- package/dist/Button/Button.test.js.map +1 -0
- package/dist/Button/Button.types.js +5 -0
- package/dist/Button/Button.types.js.map +1 -0
- package/dist/Button/index.js +2 -0
- package/dist/Button/index.js.map +1 -0
- package/dist/ButtonGroup/ButtonGroup.js +35 -0
- package/dist/ButtonGroup/ButtonGroup.js.map +1 -0
- package/dist/ButtonGroup/ButtonGroup.stories.js +317 -0
- package/dist/ButtonGroup/ButtonGroup.stories.js.map +1 -0
- package/dist/ButtonGroup/ButtonGroup.test.js +66 -0
- package/dist/ButtonGroup/ButtonGroup.test.js.map +1 -0
- package/dist/ButtonGroup/ButtonGroup.types.js +2 -0
- package/dist/ButtonGroup/ButtonGroup.types.js.map +1 -0
- package/dist/ButtonGroup/index.js +2 -0
- package/dist/ButtonGroup/index.js.map +1 -0
- package/dist/ButtonWithDropdown/ButtonWithDropdown.js +36 -0
- package/dist/ButtonWithDropdown/ButtonWithDropdown.js.map +1 -0
- package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js +104 -0
- package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js.map +1 -0
- package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js +93 -0
- package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js.map +1 -0
- package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js +2 -0
- package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js.map +1 -0
- package/dist/ButtonWithDropdown/index.js +2 -0
- package/dist/ButtonWithDropdown/index.js.map +1 -0
- package/dist/ButtonWithPopover/ButtonWithPopover.js +55 -0
- package/dist/ButtonWithPopover/ButtonWithPopover.js.map +1 -0
- package/dist/ButtonWithPopover/ButtonWithPopover.stories.js +25 -0
- package/dist/ButtonWithPopover/ButtonWithPopover.stories.js.map +1 -0
- package/dist/ButtonWithPopover/ButtonWithPopover.test.js +81 -0
- package/dist/ButtonWithPopover/ButtonWithPopover.test.js.map +1 -0
- package/dist/ButtonWithPopover/ButtonWithPopover.types.js +2 -0
- package/dist/ButtonWithPopover/ButtonWithPopover.types.js.map +1 -0
- package/dist/ButtonWithPopover/index.js +2 -0
- package/dist/ButtonWithPopover/index.js.map +1 -0
- package/dist/Carousel/Carousel.js +75 -0
- package/dist/Carousel/Carousel.js.map +1 -0
- package/dist/Carousel/Carousel.stories.js +63 -0
- package/dist/Carousel/Carousel.stories.js.map +1 -0
- package/dist/Carousel/Carousel.test.js +48 -0
- package/dist/Carousel/Carousel.test.js.map +1 -0
- package/dist/Carousel/Carousel.types.js +2 -0
- package/dist/Carousel/Carousel.types.js.map +1 -0
- package/dist/Carousel/index.js +2 -0
- package/dist/Carousel/index.js.map +1 -0
- package/dist/Checkbox/Checkbox.js +24 -0
- package/dist/Checkbox/Checkbox.js.map +1 -0
- package/dist/Checkbox/Checkbox.stories.js +12 -0
- package/dist/Checkbox/Checkbox.stories.js.map +1 -0
- package/dist/Checkbox/Checkbox.test.js +94 -0
- package/dist/Checkbox/Checkbox.test.js.map +1 -0
- package/dist/Checkbox/Checkbox.types.js +2 -0
- package/dist/Checkbox/Checkbox.types.js.map +1 -0
- package/dist/Checkbox/index.js +2 -0
- package/dist/Checkbox/index.js.map +1 -0
- package/dist/Collapse/Collapse.js +17 -0
- package/dist/Collapse/Collapse.js.map +1 -0
- package/dist/Collapse/Collapse.stories.js +15 -0
- package/dist/Collapse/Collapse.stories.js.map +1 -0
- package/dist/Collapse/Collapse.test.js +17 -0
- package/dist/Collapse/Collapse.test.js.map +1 -0
- package/dist/Collapse/Collapse.types.js +2 -0
- package/dist/Collapse/Collapse.types.js.map +1 -0
- package/dist/Collapse/index.js +2 -0
- package/dist/Collapse/index.js.map +1 -0
- package/dist/Icon/Icon.js +55 -0
- package/dist/Icon/Icon.js.map +1 -0
- package/dist/Icon/Icon.stories.js +15 -0
- package/dist/Icon/Icon.stories.js.map +1 -0
- package/dist/Icon/Icon.test.js +55 -0
- package/dist/Icon/Icon.test.js.map +1 -0
- package/dist/Icon/Icon.types.js +16 -0
- package/dist/Icon/Icon.types.js.map +1 -0
- package/dist/Icon/index.js +2 -0
- package/dist/Icon/index.js.map +1 -0
- package/dist/InputGroup/InputGroup.js +34 -0
- package/dist/InputGroup/InputGroup.js.map +1 -0
- package/dist/InputGroup/InputGroup.stories.js +129 -0
- package/dist/InputGroup/InputGroup.stories.js.map +1 -0
- package/dist/InputGroup/InputGroup.test.js +42 -0
- package/dist/InputGroup/InputGroup.test.js.map +1 -0
- package/dist/InputGroup/InputGroup.types.js +2 -0
- package/dist/InputGroup/InputGroup.types.js.map +1 -0
- package/dist/InputGroup/index.js +2 -0
- package/dist/InputGroup/index.js.map +1 -0
- package/dist/Modal/Modal.js +76 -0
- package/dist/Modal/Modal.js.map +1 -0
- package/dist/Modal/Modal.stories.js +44 -0
- package/dist/Modal/Modal.stories.js.map +1 -0
- package/dist/Modal/Modal.test.js +108 -0
- package/dist/Modal/Modal.test.js.map +1 -0
- package/dist/Modal/Modal.types.js +2 -0
- package/dist/Modal/Modal.types.js.map +1 -0
- package/dist/Modal/index.js +2 -0
- package/dist/Modal/index.js.map +1 -0
- package/dist/ProgressBar/ProgressBar.js +72 -0
- package/dist/ProgressBar/ProgressBar.js.map +1 -0
- package/dist/ProgressBar/ProgressBar.stories.js +35 -0
- package/dist/ProgressBar/ProgressBar.stories.js.map +1 -0
- package/dist/ProgressBar/ProgressBar.test.js +43 -0
- package/dist/ProgressBar/ProgressBar.test.js.map +1 -0
- package/dist/ProgressBar/ProgressBar.types.js +2 -0
- package/dist/ProgressBar/ProgressBar.types.js.map +1 -0
- package/dist/ProgressBar/index.js +2 -0
- package/dist/ProgressBar/index.js.map +1 -0
- package/dist/SeeqActionDropdown/SeeqActionDropdown.js +39 -0
- package/dist/SeeqActionDropdown/SeeqActionDropdown.js.map +1 -0
- package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js +56 -0
- package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js.map +1 -0
- package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js +73 -0
- package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js.map +1 -0
- package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js +2 -0
- package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js.map +1 -0
- package/dist/SeeqActionDropdown/index.js +2 -0
- package/dist/SeeqActionDropdown/index.js.map +1 -0
- package/dist/SeeqActionDropdown/variants.js +29 -0
- package/dist/SeeqActionDropdown/variants.js.map +1 -0
- package/dist/Select/Select.js +177 -0
- package/dist/Select/Select.js.map +1 -0
- package/dist/Select/Select.stories.js +40 -0
- package/dist/Select/Select.stories.js.map +1 -0
- package/dist/Select/Select.test.js +175 -0
- package/dist/Select/Select.test.js.map +1 -0
- package/dist/Select/Select.types.js +2 -0
- package/dist/Select/Select.types.js.map +1 -0
- package/dist/Select/index.js +3 -0
- package/dist/Select/index.js.map +1 -0
- package/dist/Slider/Slider.js +10 -0
- package/dist/Slider/Slider.js.map +1 -0
- package/dist/Slider/Slider.stories.js +14 -0
- package/dist/Slider/Slider.stories.js.map +1 -0
- package/dist/Slider/Slider.test.js +32 -0
- package/dist/Slider/Slider.test.js.map +1 -0
- package/dist/Slider/Slider.types.js +2 -0
- package/dist/Slider/Slider.types.js.map +1 -0
- package/dist/Slider/index.js +2 -0
- package/dist/Slider/index.js.map +1 -0
- package/dist/SvgIcon/SvgIcon.js +28 -0
- package/dist/SvgIcon/SvgIcon.js.map +1 -0
- package/dist/SvgIcon/SvgIcon.stories.js +18 -0
- package/dist/SvgIcon/SvgIcon.stories.js.map +1 -0
- package/dist/SvgIcon/SvgIcon.test.js +41 -0
- package/dist/SvgIcon/SvgIcon.test.js.map +1 -0
- package/dist/SvgIcon/SvgIcon.types.js +6 -0
- package/dist/SvgIcon/SvgIcon.types.js.map +1 -0
- package/dist/SvgIcon/index.js +2 -0
- package/dist/SvgIcon/index.js.map +1 -0
- package/dist/Tabs/Tabs.js +17 -0
- package/dist/Tabs/Tabs.js.map +1 -0
- package/dist/Tabs/Tabs.stories.js +73 -0
- package/dist/Tabs/Tabs.stories.js.map +1 -0
- package/dist/Tabs/Tabs.test.js +86 -0
- package/dist/Tabs/Tabs.test.js.map +1 -0
- package/dist/Tabs/Tabs.types.js +2 -0
- package/dist/Tabs/Tabs.types.js.map +1 -0
- package/dist/Tabs/index.js +2 -0
- package/dist/Tabs/index.js.map +1 -0
- package/dist/TextArea/TextArea.js +25 -0
- package/dist/TextArea/TextArea.js.map +1 -0
- package/dist/TextArea/TextArea.stories.js +10 -0
- package/dist/TextArea/TextArea.stories.js.map +1 -0
- package/dist/TextArea/TextArea.test.js +68 -0
- package/dist/TextArea/TextArea.test.js.map +1 -0
- package/dist/TextArea/TextArea.types.js +2 -0
- package/dist/TextArea/TextArea.types.js.map +1 -0
- package/dist/TextArea/index.js +2 -0
- package/dist/TextArea/index.js.map +1 -0
- package/dist/TextField/TextField.js +85 -0
- package/dist/TextField/TextField.js.map +1 -0
- package/dist/TextField/TextField.stories.js +11 -0
- package/dist/TextField/TextField.stories.js.map +1 -0
- package/dist/TextField/TextField.test.js +41 -0
- package/dist/TextField/TextField.test.js.map +1 -0
- package/dist/TextField/TextField.types.js +2 -0
- package/dist/TextField/TextField.types.js.map +1 -0
- package/dist/TextField/index.js +2 -0
- package/dist/TextField/index.js.map +1 -0
- package/dist/ToolbarButton/ToolbarButton.js +57 -0
- package/dist/ToolbarButton/ToolbarButton.js.map +1 -0
- package/dist/ToolbarButton/ToolbarButton.stories.js +28 -0
- package/dist/ToolbarButton/ToolbarButton.stories.js.map +1 -0
- package/dist/ToolbarButton/ToolbarButton.test.js +85 -0
- package/dist/ToolbarButton/ToolbarButton.test.js.map +1 -0
- package/dist/ToolbarButton/ToolbarButton.types.js +2 -0
- package/dist/ToolbarButton/ToolbarButton.types.js.map +1 -0
- package/dist/ToolbarButton/index.js +2 -0
- package/dist/ToolbarButton/index.js.map +1 -0
- package/dist/Tooltip/QTip.stories.js +18 -0
- package/dist/Tooltip/QTip.stories.js.map +1 -0
- package/dist/Tooltip/QTip.types.js +2 -0
- package/dist/Tooltip/QTip.types.js.map +1 -0
- package/dist/Tooltip/QTipPerformance.stories.js +26 -0
- package/dist/Tooltip/QTipPerformance.stories.js.map +1 -0
- package/dist/Tooltip/Qtip.js +168 -0
- package/dist/Tooltip/Qtip.js.map +1 -0
- package/dist/Tooltip/Tooltip.js +34 -0
- package/dist/Tooltip/Tooltip.js.map +1 -0
- package/dist/Tooltip/Tooltip.stories.js +15 -0
- package/dist/Tooltip/Tooltip.stories.js.map +1 -0
- package/dist/Tooltip/Tooltip.types.js +3 -0
- package/dist/Tooltip/Tooltip.types.js.map +1 -0
- package/dist/Tooltip/TooltipPerformance.stories.js +26 -0
- package/dist/Tooltip/TooltipPerformance.stories.js.map +1 -0
- package/dist/Tooltip/index.js +3 -0
- package/dist/Tooltip/index.js.map +1 -0
- package/dist/Tooltip/qTip.utilities.js +11 -0
- package/dist/Tooltip/qTip.utilities.js.map +1 -0
- package/dist/example/.eslintrc.cjs +14 -14
- package/dist/example/README.md +33 -33
- package/dist/example/index.html +13 -13
- package/dist/example/package.json +32 -30
- package/dist/example/src/ComplexSelectExample.tsx +81 -81
- package/dist/example/src/Example.tsx +638 -408
- package/dist/example/src/index.css +103 -102
- package/dist/example/src/main.tsx +10 -10
- package/dist/example/src/vite-env.d.ts +1 -1
- package/dist/example/tsconfig.json +33 -33
- package/dist/example/tsconfig.node.json +12 -12
- package/dist/example/vite.config.ts +13 -12
- package/dist/index.esm.js +18318 -11863
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +18312 -11857
- package/dist/index.js.map +1 -1
- package/dist/setupTests.d.ts +1 -0
- package/dist/setupTests.js +6 -0
- package/dist/setupTests.js.map +1 -0
- package/dist/{Accordion → src/Accordion}/Accordion.d.ts +4 -4
- package/dist/src/Accordion/Accordion.stories.d.ts +5 -0
- package/dist/{Accordion → src/Accordion}/Accordion.test.d.ts +1 -1
- package/dist/src/Accordion/Accordion.types.d.ts +86 -0
- package/dist/{Accordion → src/Accordion}/index.d.ts +1 -1
- package/dist/{Alert → src/Alert}/Alert.d.ts +7 -7
- package/dist/src/Alert/Alert.stories.d.ts +5 -0
- package/dist/src/Alert/Alert.test.d.ts +1 -0
- package/dist/src/Alert/Alert.types.d.ts +63 -0
- package/dist/{Alert → src/Alert}/index.d.ts +1 -1
- package/dist/{Button → src/Button}/Button.d.ts +10 -10
- package/dist/src/Button/Button.stories.d.ts +8 -0
- package/dist/{Button → src/Button}/Button.test.d.ts +1 -1
- package/dist/src/Button/Button.types.d.ts +148 -0
- package/dist/{Button → src/Button}/index.d.ts +1 -1
- package/dist/{ButtonGroup → src/ButtonGroup}/ButtonGroup.d.ts +7 -7
- package/dist/src/ButtonGroup/ButtonGroup.stories.d.ts +5 -0
- package/dist/src/ButtonGroup/ButtonGroup.test.d.ts +1 -0
- package/dist/src/ButtonGroup/ButtonGroup.types.d.ts +81 -0
- package/dist/{ButtonGroup → src/ButtonGroup}/index.d.ts +1 -1
- package/dist/{ButtonWithDropdown → src/ButtonWithDropdown}/ButtonWithDropdown.d.ts +4 -4
- package/dist/src/ButtonWithDropdown/ButtonWithDropdown.stories.d.ts +5 -0
- package/dist/{ButtonWithDropdown → src/ButtonWithDropdown}/ButtonWithDropdown.test.d.ts +1 -1
- package/dist/src/ButtonWithDropdown/ButtonWithDropdown.types.d.ts +233 -0
- package/dist/{ButtonWithDropdown → src/ButtonWithDropdown}/index.d.ts +1 -1
- package/dist/{ButtonWithPopover → src/ButtonWithPopover}/ButtonWithPopover.d.ts +4 -4
- package/dist/src/ButtonWithPopover/ButtonWithPopover.stories.d.ts +5 -0
- package/dist/{ButtonWithPopover → src/ButtonWithPopover}/ButtonWithPopover.test.d.ts +1 -1
- package/dist/src/ButtonWithPopover/ButtonWithPopover.types.d.ts +134 -0
- package/dist/{ButtonWithPopover → src/ButtonWithPopover}/index.d.ts +1 -1
- package/dist/{Carousel → src/Carousel}/Carousel.d.ts +9 -9
- package/dist/src/Carousel/Carousel.stories.d.ts +5 -0
- package/dist/{Carousel → src/Carousel}/Carousel.test.d.ts +1 -1
- package/dist/src/Carousel/Carousel.types.d.ts +86 -0
- package/dist/{Carousel → src/Carousel}/index.d.ts +1 -1
- package/dist/{Checkbox → src/Checkbox}/Checkbox.d.ts +7 -7
- package/dist/src/Checkbox/Checkbox.stories.d.ts +5 -0
- package/dist/{Checkbox → src/Checkbox}/Checkbox.test.d.ts +1 -1
- package/dist/src/Checkbox/Checkbox.types.d.ts +92 -0
- package/dist/{Checkbox → src/Checkbox}/index.d.ts +1 -1
- package/dist/{Collapse → src/Collapse}/Collapse.d.ts +4 -4
- package/dist/src/Collapse/Collapse.stories.d.ts +5 -0
- package/dist/{Collapse → src/Collapse}/Collapse.test.d.ts +1 -1
- package/dist/src/Collapse/Collapse.types.d.ts +19 -0
- package/dist/{Collapse → src/Collapse}/index.d.ts +1 -1
- package/dist/{Icon → src/Icon}/Icon.d.ts +10 -10
- package/dist/src/Icon/Icon.stories.d.ts +5 -0
- package/dist/{Icon → src/Icon}/Icon.test.d.ts +1 -1
- package/dist/src/Icon/Icon.types.d.ts +87 -0
- package/dist/{Icon → src/Icon}/index.d.ts +1 -1
- package/dist/{InputGroup → src/InputGroup}/InputGroup.d.ts +7 -7
- package/dist/src/InputGroup/InputGroup.stories.d.ts +5 -0
- package/dist/src/InputGroup/InputGroup.test.d.ts +1 -0
- package/dist/src/InputGroup/InputGroup.types.d.ts +62 -0
- package/dist/{InputGroup → src/InputGroup}/index.d.ts +2 -2
- package/dist/{Modal → src/Modal}/Modal.d.ts +5 -5
- package/dist/{Modal → src/Modal}/Modal.stories.d.ts +10 -10
- package/dist/{Modal → src/Modal}/Modal.test.d.ts +1 -1
- package/dist/src/Modal/Modal.types.d.ts +244 -0
- package/dist/{Modal → src/Modal}/index.d.ts +1 -1
- package/dist/{ProgressBar → src/ProgressBar}/ProgressBar.d.ts +4 -4
- package/dist/src/ProgressBar/ProgressBar.stories.d.ts +5 -0
- package/dist/src/ProgressBar/ProgressBar.test.d.ts +1 -0
- package/dist/src/ProgressBar/ProgressBar.types.d.ts +77 -0
- package/dist/src/ProgressBar/index.d.ts +1 -0
- package/dist/{SeeqActionDropdown → src/SeeqActionDropdown}/SeeqActionDropdown.d.ts +4 -4
- package/dist/src/SeeqActionDropdown/SeeqActionDropdown.stories.d.ts +5 -0
- package/dist/{SeeqActionDropdown → src/SeeqActionDropdown}/SeeqActionDropdown.test.d.ts +1 -1
- package/dist/src/SeeqActionDropdown/SeeqActionDropdown.types.d.ts +160 -0
- package/dist/{SeeqActionDropdown → src/SeeqActionDropdown}/index.d.ts +1 -1
- package/dist/{SeeqActionDropdown → src/SeeqActionDropdown}/variants.d.ts +5 -5
- package/dist/{Select → src/Select}/Select.d.ts +15 -15
- package/dist/src/Select/Select.stories.d.ts +5 -0
- package/dist/{Select → src/Select}/Select.test.d.ts +1 -1
- package/dist/src/Select/Select.types.d.ts +220 -0
- package/dist/{Select → src/Select}/index.d.ts +2 -2
- package/dist/{Slider → src/Slider}/Slider.d.ts +6 -6
- package/dist/src/Slider/Slider.stories.d.ts +5 -0
- package/dist/src/Slider/Slider.test.d.ts +1 -0
- package/dist/src/Slider/Slider.types.d.ts +85 -0
- package/dist/{Slider → src/Slider}/index.d.ts +1 -1
- package/dist/{SvgIcon → src/SvgIcon}/SvgIcon.d.ts +20 -20
- package/dist/src/SvgIcon/SvgIcon.stories.d.ts +5 -0
- package/dist/{SvgIcon → src/SvgIcon}/SvgIcon.test.d.ts +1 -1
- package/dist/src/SvgIcon/SvgIcon.types.d.ts +76 -0
- package/dist/{SvgIcon → src/SvgIcon}/index.d.ts +1 -1
- package/dist/{Tabs → src/Tabs}/Tabs.d.ts +4 -4
- package/dist/src/Tabs/Tabs.stories.d.ts +5 -0
- package/dist/{Tabs → src/Tabs}/Tabs.test.d.ts +1 -1
- package/dist/src/Tabs/Tabs.types.d.ts +95 -0
- package/dist/{Tabs → src/Tabs}/index.d.ts +1 -1
- package/dist/{TextArea → src/TextArea}/TextArea.d.ts +7 -7
- package/dist/src/TextArea/TextArea.stories.d.ts +5 -0
- package/dist/{TextArea → src/TextArea}/TextArea.test.d.ts +1 -1
- package/dist/src/TextArea/TextArea.types.d.ts +105 -0
- package/dist/{TextArea → src/TextArea}/index.d.ts +1 -1
- package/dist/{TextField → src/TextField}/TextField.d.ts +7 -7
- package/dist/src/TextField/TextField.stories.d.ts +5 -0
- package/dist/{TextField → src/TextField}/TextField.test.d.ts +1 -1
- package/dist/src/TextField/TextField.types.d.ts +199 -0
- package/dist/{TextField → src/TextField}/index.d.ts +1 -1
- package/dist/{ToolbarButton → src/ToolbarButton}/ToolbarButton.d.ts +3 -3
- package/dist/src/ToolbarButton/ToolbarButton.stories.d.ts +5 -0
- package/dist/{ToolbarButton → src/ToolbarButton}/ToolbarButton.test.d.ts +1 -1
- package/dist/src/ToolbarButton/ToolbarButton.types.d.ts +124 -0
- package/dist/{ToolbarButton → src/ToolbarButton}/index.d.ts +1 -1
- package/dist/src/Tooltip/QTip.stories.d.ts +5 -0
- package/dist/{Tooltip → src/Tooltip}/QTip.types.d.ts +13 -13
- package/dist/src/Tooltip/QTipPerformance.stories.d.ts +5 -0
- package/dist/{Tooltip → src/Tooltip}/Qtip.d.ts +26 -26
- package/dist/{Tooltip → src/Tooltip}/Tooltip.d.ts +13 -13
- package/dist/src/Tooltip/Tooltip.stories.d.ts +5 -0
- package/dist/{Tooltip → src/Tooltip}/Tooltip.types.d.ts +22 -21
- package/dist/src/Tooltip/TooltipPerformance.stories.d.ts +5 -0
- package/dist/{Tooltip → src/Tooltip}/index.d.ts +2 -2
- package/dist/{Tooltip → src/Tooltip}/qTip.utilities.d.ts +3 -3
- package/dist/{index.d.ts → src/index.d.ts} +45 -46
- package/dist/src/setupTests.d.ts +1 -0
- package/dist/{types.d.ts → src/types.d.ts} +2 -2
- package/dist/{utils → src/utils}/browserId.d.ts +9 -9
- package/dist/{utils → src/utils}/svg.d.ts +15 -15
- package/dist/{utils → src/utils}/validateStyleDimension.d.ts +2 -2
- package/dist/{utils → src/utils}/validateStyleDimension.test.d.ts +1 -1
- package/dist/styles.css +3855 -4011
- package/dist/types.js +2 -0
- package/dist/types.js.map +1 -0
- package/dist/utils/browserId.js +29 -0
- package/dist/utils/browserId.js.map +1 -0
- package/dist/utils/svg.js +20 -0
- package/dist/utils/svg.js.map +1 -0
- package/dist/utils/validateStyleDimension.js +14 -0
- package/dist/utils/validateStyleDimension.js.map +1 -0
- package/dist/utils/validateStyleDimension.test.js +20 -0
- package/dist/utils/validateStyleDimension.test.js.map +1 -0
- package/package.json +91 -88
- package/dist/Accordion/Accordion.stories.d.ts +0 -5
- package/dist/Accordion/Accordion.types.d.ts +0 -20
- package/dist/Alert/Alert.stories.d.ts +0 -5
- package/dist/Alert/Alert.test.d.ts +0 -1
- package/dist/Alert/Alert.types.d.ts +0 -13
- package/dist/Button/Button.stories.d.ts +0 -8
- package/dist/Button/Button.types.d.ts +0 -53
- package/dist/ButtonGroup/ButtonGroup.stories.d.ts +0 -5
- package/dist/ButtonGroup/ButtonGroup.test.d.ts +0 -1
- package/dist/ButtonGroup/ButtonGroup.types.d.ts +0 -39
- package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.d.ts +0 -5
- package/dist/ButtonWithDropdown/ButtonWithDropdown.types.d.ts +0 -89
- package/dist/ButtonWithPopover/ButtonWithPopover.stories.d.ts +0 -5
- package/dist/ButtonWithPopover/ButtonWithPopover.types.d.ts +0 -48
- package/dist/Carousel/Carousel.stories.d.ts +0 -5
- package/dist/Carousel/Carousel.types.d.ts +0 -23
- package/dist/Checkbox/Checkbox.stories.d.ts +0 -5
- package/dist/Checkbox/Checkbox.types.d.ts +0 -19
- package/dist/Collapse/Collapse.stories.d.ts +0 -5
- package/dist/Collapse/Collapse.types.d.ts +0 -4
- package/dist/Icon/Icon.stories.d.ts +0 -5
- package/dist/Icon/Icon.types.d.ts +0 -30
- package/dist/InputGroup/InputGroup.stories.d.ts +0 -5
- package/dist/InputGroup/InputGroup.test.d.ts +0 -1
- package/dist/InputGroup/InputGroup.types.d.ts +0 -35
- package/dist/Modal/Modal.types.d.ts +0 -48
- package/dist/ProgressBar/ProgressBar.stories.d.ts +0 -7
- package/dist/ProgressBar/ProgressBar.test.d.ts +0 -1
- package/dist/ProgressBar/ProgressBar.types.d.ts +0 -40
- package/dist/ProgressBar/index.d.ts +0 -2
- package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.d.ts +0 -5
- package/dist/SeeqActionDropdown/SeeqActionDropdown.types.d.ts +0 -57
- package/dist/Select/Select.stories.d.ts +0 -5
- package/dist/Select/Select.types.d.ts +0 -89
- package/dist/Slider/Slider.stories.d.ts +0 -5
- package/dist/Slider/Slider.test.d.ts +0 -1
- package/dist/Slider/Slider.types.d.ts +0 -16
- package/dist/SvgIcon/SvgIcon.stories.d.ts +0 -5
- package/dist/SvgIcon/SvgIcon.types.d.ts +0 -24
- package/dist/Tabs/Tabs.stories.d.ts +0 -5
- package/dist/Tabs/Tabs.types.d.ts +0 -20
- package/dist/TextArea/TextArea.stories.d.ts +0 -5
- package/dist/TextArea/TextArea.types.d.ts +0 -34
- package/dist/TextField/TextField.stories.d.ts +0 -5
- package/dist/TextField/TextField.types.d.ts +0 -39
- package/dist/ToolbarButton/ToolbarButton.stories.d.ts +0 -5
- package/dist/ToolbarButton/ToolbarButton.types.d.ts +0 -53
- package/dist/Tooltip/QTip.stories.d.ts +0 -5
- package/dist/Tooltip/QTipPerformance.stories.d.ts +0 -5
- package/dist/Tooltip/Tooltip.stories.d.ts +0 -5
- package/dist/Tooltip/TooltipPerformance.stories.d.ts +0 -5
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
/**
|
|
3
|
+
* Props for the Collapse component that creates smooth expand/collapse animations.
|
|
4
|
+
*/
|
|
5
|
+
export interface CollapseProps {
|
|
6
|
+
/**
|
|
7
|
+
* Controls whether the collapse content is visible and expanded.
|
|
8
|
+
* When true, the content smoothly expands to full height.
|
|
9
|
+
* When false, the content smoothly collapses to zero height.
|
|
10
|
+
* Use this to control the collapse state from parent components.
|
|
11
|
+
*/
|
|
12
|
+
isVisible: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* Content to display inside the collapsible area.
|
|
15
|
+
* Can be any React elements that you want to show/hide with animation.
|
|
16
|
+
* The content will be measured and animated when expanding or collapsing.
|
|
17
|
+
*/
|
|
18
|
+
children: React.ReactNode;
|
|
19
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default } from './Collapse';
|
|
1
|
+
export { default } from './Collapse';
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import '../styles.css';
|
|
3
|
-
import { IconProps } from './Icon.types';
|
|
4
|
-
/**
|
|
5
|
-
* Icon:
|
|
6
|
-
* - access to Seeq custom icons by providing the desired icon
|
|
7
|
-
* - leverage "type" to style your icon
|
|
8
|
-
*/
|
|
9
|
-
declare const Icon: React.FunctionComponent<IconProps>;
|
|
10
|
-
export default Icon;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import '../styles.css';
|
|
3
|
+
import { IconProps } from './Icon.types';
|
|
4
|
+
/**
|
|
5
|
+
* Icon:
|
|
6
|
+
* - access to Seeq custom icons by providing the desired icon
|
|
7
|
+
* - leverage "type" to style your icon
|
|
8
|
+
*/
|
|
9
|
+
declare const Icon: React.FunctionComponent<IconProps>;
|
|
10
|
+
export default Icon;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import '@testing-library/jest-dom';
|
|
1
|
+
import '@testing-library/jest-dom';
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { TooltipComponentProps } from '../Tooltip/Tooltip.types';
|
|
3
|
+
export declare const iconTypes: readonly ["theme", "white", "dark-gray", "darkish-gray", "gray", "color", "info", "text", "warning", "inherit", "danger", "theme-light", "success"];
|
|
4
|
+
export type IconType = (typeof iconTypes)[number];
|
|
5
|
+
/**
|
|
6
|
+
* Props for the Icon component that renders customizable icons with various styling options.
|
|
7
|
+
* Extends TooltipComponentProps to support tooltip functionality on the icon.
|
|
8
|
+
*/
|
|
9
|
+
export interface IconProps extends TooltipComponentProps {
|
|
10
|
+
/**
|
|
11
|
+
* Icon class name to display, typically from FontAwesome.
|
|
12
|
+
* Examples: 'fc-zoom', 'fc-delete', 'fc-save'. This determines which icon is rendered.
|
|
13
|
+
*/
|
|
14
|
+
icon: string;
|
|
15
|
+
/**
|
|
16
|
+
* Custom prefix for the icon class when not using standard FontAwesome icons.
|
|
17
|
+
* By default, icons are prefixed with 'fa-sharp fa-regular', but some icons
|
|
18
|
+
* from different icon sets require specific prefixes. Use this to override the default.
|
|
19
|
+
*/
|
|
20
|
+
iconPrefix?: string;
|
|
21
|
+
/**
|
|
22
|
+
* Visual style type that determines the icon's color and appearance:
|
|
23
|
+
* - `theme`: Uses primary theme colors (default)
|
|
24
|
+
* - `white`: Pure white color
|
|
25
|
+
* - `text`: Uses standard text color
|
|
26
|
+
* - `dark-gray`: Dark gray color
|
|
27
|
+
* - `darkish-gray`: Medium-dark gray color
|
|
28
|
+
* - `gray`: Standard gray color
|
|
29
|
+
* - `color`: Uses custom color specified in `color` prop
|
|
30
|
+
* - `info`: Blue informational color
|
|
31
|
+
* - `warning`: Yellow/orange warning color
|
|
32
|
+
* - `danger`: Red error/danger color
|
|
33
|
+
* - `success`: Green success color
|
|
34
|
+
* - `theme-light`: Lighter version of theme color
|
|
35
|
+
* - `inherit`: Inherits color from parent element
|
|
36
|
+
* @default 'theme'
|
|
37
|
+
*/
|
|
38
|
+
type?: IconType;
|
|
39
|
+
/**
|
|
40
|
+
* Custom color value for the icon when `type` is set to 'color'.
|
|
41
|
+
* Can be any valid CSS color (hex, rgb, color names, etc.).
|
|
42
|
+
* This property is required when type is 'color'.
|
|
43
|
+
*/
|
|
44
|
+
color?: string;
|
|
45
|
+
/**
|
|
46
|
+
* Callback function triggered when the icon is clicked.
|
|
47
|
+
* Receives the mouse event as a parameter. Use this to make icons interactive
|
|
48
|
+
* for actions like opening menus, triggering functions, or navigation.
|
|
49
|
+
*/
|
|
50
|
+
onClick?: (e?: React.MouseEvent<HTMLElement, MouseEvent>) => any;
|
|
51
|
+
/**
|
|
52
|
+
* Additional CSS classes to apply to the icon element.
|
|
53
|
+
* Use this to customize the icon's appearance, spacing, or behavior beyond built-in options.
|
|
54
|
+
*/
|
|
55
|
+
extraClassNames?: string;
|
|
56
|
+
/**
|
|
57
|
+
* HTML ID attribute for the icon element.
|
|
58
|
+
* Should be unique across the page for proper HTML semantics and accessibility.
|
|
59
|
+
*/
|
|
60
|
+
id?: string;
|
|
61
|
+
/**
|
|
62
|
+
* When true, applies the 'fa-lg' class to make the icon larger than normal size.
|
|
63
|
+
* Cannot be used together with the `small` prop. Useful for emphasis or better visibility.
|
|
64
|
+
*/
|
|
65
|
+
large?: boolean;
|
|
66
|
+
/**
|
|
67
|
+
* When true, applies the 'fa-sm' class to make the icon smaller than normal size.
|
|
68
|
+
* Cannot be used together with the `large` prop. Useful for compact layouts or inline text.
|
|
69
|
+
*/
|
|
70
|
+
small?: boolean;
|
|
71
|
+
/**
|
|
72
|
+
* Test ID attribute for the icon element used in automated testing.
|
|
73
|
+
* Applied to the `data-testid` attribute for element selection in test suites.
|
|
74
|
+
*/
|
|
75
|
+
testId?: string;
|
|
76
|
+
/**
|
|
77
|
+
* Custom identifier placed in the `data-customid` attribute on the icon element.
|
|
78
|
+
* Useful for identifying the specific icon in event handlers when multiple icons
|
|
79
|
+
* share the same click handler. Helps distinguish which icon was clicked.
|
|
80
|
+
*/
|
|
81
|
+
customId?: string;
|
|
82
|
+
/**
|
|
83
|
+
* Numeric value associated with the icon, purpose depends on specific use case.
|
|
84
|
+
* Can be used for ordering, counting, or any numeric data related to the icon.
|
|
85
|
+
*/
|
|
86
|
+
number?: number;
|
|
87
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default } from './Icon';
|
|
1
|
+
export { default } from './Icon';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { InputGroupProps } from './InputGroup.types';
|
|
3
|
-
import '../styles.css';
|
|
4
|
-
/**
|
|
5
|
-
* InputGroup.
|
|
6
|
-
*/
|
|
7
|
-
export declare const InputGroup: React.FunctionComponent<InputGroupProps>;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { InputGroupProps } from './InputGroup.types';
|
|
3
|
+
import '../styles.css';
|
|
4
|
+
/**
|
|
5
|
+
* InputGroup.
|
|
6
|
+
*/
|
|
7
|
+
export declare const InputGroup: React.FunctionComponent<InputGroupProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { ButtonProps } from '../Button/Button.types';
|
|
3
|
+
import { InputLengthStyleProps, TextFieldProps } from '../TextField/TextField.types';
|
|
4
|
+
import { TooltipComponentProps } from '../Tooltip/Tooltip.types';
|
|
5
|
+
/**
|
|
6
|
+
* Interface for button elements that can be appended to an InputGroup.
|
|
7
|
+
* Used when you want to add interactive buttons alongside the input field.
|
|
8
|
+
*/
|
|
9
|
+
interface AppendedButtonProps {
|
|
10
|
+
/**
|
|
11
|
+
* Specifies that this appended item is an interactive button.
|
|
12
|
+
* Button items can trigger actions and provide additional functionality to the input.
|
|
13
|
+
*/
|
|
14
|
+
variant: 'button';
|
|
15
|
+
/**
|
|
16
|
+
* Configuration properties for the button component.
|
|
17
|
+
* Uses all standard Button props including click handlers, styling, icons, and tooltips.
|
|
18
|
+
*/
|
|
19
|
+
buttonProps: ButtonProps;
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* Interface for custom React elements that can be appended to an InputGroup.
|
|
23
|
+
* Used when you need to add non-button content like icons, labels, or decorative elements.
|
|
24
|
+
*/
|
|
25
|
+
interface ElementProps {
|
|
26
|
+
/**
|
|
27
|
+
* Specifies that this appended item is a custom React element.
|
|
28
|
+
* Element items are typically decorative or informational and don't have built-in interactivity.
|
|
29
|
+
*/
|
|
30
|
+
variant: 'element';
|
|
31
|
+
/**
|
|
32
|
+
* The React content to render alongside the input field.
|
|
33
|
+
* Can be any valid React node including text, icons, indicators, or complex components.
|
|
34
|
+
*/
|
|
35
|
+
element: React.ReactNode;
|
|
36
|
+
}
|
|
37
|
+
export type AppendedProps = AppendedButtonProps | ElementProps | undefined;
|
|
38
|
+
/**
|
|
39
|
+
* Base interface for InputGroup component properties.
|
|
40
|
+
* Extends TextFieldProps to inherit all text input functionality while adding group-specific features.
|
|
41
|
+
*/
|
|
42
|
+
interface BaseInputGroupProps extends TextFieldProps {
|
|
43
|
+
/**
|
|
44
|
+
* Array of elements to append to the right side of the input field.
|
|
45
|
+
* Each item can be either a button (for interactive functionality) or an element (for decoration).
|
|
46
|
+
* Items are displayed in the order they appear in the array, creating a cohesive input group.
|
|
47
|
+
*/
|
|
48
|
+
append: AppendedProps[];
|
|
49
|
+
/**
|
|
50
|
+
* Custom input field component to render instead of the default TextField.
|
|
51
|
+
* Use this when you need specialized input behavior while maintaining the group styling.
|
|
52
|
+
* The field will be integrated seamlessly with the appended elements.
|
|
53
|
+
*/
|
|
54
|
+
field?: React.ReactNode;
|
|
55
|
+
}
|
|
56
|
+
/**
|
|
57
|
+
* Complete props interface for the InputGroup component.
|
|
58
|
+
* Combines base input group functionality with tooltip support and text length constraints.
|
|
59
|
+
* Creates a cohesive input control with attached buttons or decorative elements.
|
|
60
|
+
*/
|
|
61
|
+
export type InputGroupProps = BaseInputGroupProps & TooltipComponentProps & InputLengthStyleProps;
|
|
62
|
+
export {};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { InputGroup as default } from './InputGroup';
|
|
2
|
-
export type { AppendedProps } from './InputGroup.types';
|
|
1
|
+
export { InputGroup as default } from './InputGroup';
|
|
2
|
+
export type { AppendedProps } from './InputGroup.types';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import '../styles.css';
|
|
3
|
-
import { ModalProps } from './Modal.types';
|
|
4
|
-
declare const Modal: React.FunctionComponent<ModalProps>;
|
|
5
|
-
export default Modal;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import '../styles.css';
|
|
3
|
+
import { ModalProps } from './Modal.types';
|
|
4
|
+
declare const Modal: React.FunctionComponent<ModalProps>;
|
|
5
|
+
export default Modal;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
declare const _default: {
|
|
3
|
-
title: string;
|
|
4
|
-
};
|
|
5
|
-
export default _default;
|
|
6
|
-
export declare const AllModalsVariants: React.FunctionComponent;
|
|
7
|
-
export declare const ModalsWithDisabledSubmit: React.FunctionComponent;
|
|
8
|
-
export declare const ModalsWithEditableTitle: React.FunctionComponent;
|
|
9
|
-
export declare const ModalsWithCustomButton: React.FunctionComponent;
|
|
10
|
-
export declare const ModalsWithVariantButton: React.FunctionComponent;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
};
|
|
5
|
+
export default _default;
|
|
6
|
+
export declare const AllModalsVariants: React.FunctionComponent;
|
|
7
|
+
export declare const ModalsWithDisabledSubmit: React.FunctionComponent;
|
|
8
|
+
export declare const ModalsWithEditableTitle: React.FunctionComponent;
|
|
9
|
+
export declare const ModalsWithCustomButton: React.FunctionComponent;
|
|
10
|
+
export declare const ModalsWithVariantButton: React.FunctionComponent;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import '@testing-library/jest-dom';
|
|
1
|
+
import '@testing-library/jest-dom';
|
|
@@ -0,0 +1,244 @@
|
|
|
1
|
+
import { FormControlElement } from '../types';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { ButtonVariant } from '../Button/Button.types';
|
|
4
|
+
export type ModalSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl';
|
|
5
|
+
export type TitleIconPosition = 'left' | 'right';
|
|
6
|
+
export interface ModalProps {
|
|
7
|
+
/**
|
|
8
|
+
* Main title text displayed prominently in the modal header.
|
|
9
|
+
* This is the primary heading that identifies the purpose or content of the modal.
|
|
10
|
+
*/
|
|
11
|
+
title: string;
|
|
12
|
+
/**
|
|
13
|
+
* Additional text to append after the main title.
|
|
14
|
+
* Useful for adding context, version numbers, or secondary information to the title.
|
|
15
|
+
*/
|
|
16
|
+
titleSuffixLabel?: string;
|
|
17
|
+
/**
|
|
18
|
+
* Secondary text displayed below the main title in the header.
|
|
19
|
+
* Use this for additional context, descriptions, or instructions for the modal content.
|
|
20
|
+
*/
|
|
21
|
+
subtitle?: string;
|
|
22
|
+
/**
|
|
23
|
+
* Icon to display next to the title in the header.
|
|
24
|
+
* Can be an icon class name (string) for font icons or a React element for custom icons.
|
|
25
|
+
* Helps provide visual context for the modal's purpose.
|
|
26
|
+
*/
|
|
27
|
+
titleIcon?: string | React.ReactElement;
|
|
28
|
+
/**
|
|
29
|
+
* Position of the title icon relative to the title text:
|
|
30
|
+
* - `left`: Icon appears before the title text
|
|
31
|
+
* - `right`: Icon appears after the title text
|
|
32
|
+
* @default 'left'
|
|
33
|
+
*/
|
|
34
|
+
titleIconPosition?: TitleIconPosition;
|
|
35
|
+
/**
|
|
36
|
+
* Main content of the modal body.
|
|
37
|
+
* This is where you place the primary content, forms, information, or interactive elements.
|
|
38
|
+
* Must be a single React element (wrap multiple elements in a container if needed).
|
|
39
|
+
*/
|
|
40
|
+
children: React.ReactElement;
|
|
41
|
+
/**
|
|
42
|
+
* Custom footer content that completely replaces the default button footer.
|
|
43
|
+
* When provided, all default buttons (submit, cancel, custom) are hidden.
|
|
44
|
+
* Use this when you need complete control over the footer layout and actions.
|
|
45
|
+
*/
|
|
46
|
+
modalFooter?: React.ReactElement;
|
|
47
|
+
/**
|
|
48
|
+
* Controls whether the modal is currently visible and open.
|
|
49
|
+
* When true, the modal is displayed with overlay. When false, the modal is hidden.
|
|
50
|
+
* Use this prop to control modal visibility from parent components.
|
|
51
|
+
*/
|
|
52
|
+
open: boolean;
|
|
53
|
+
/**
|
|
54
|
+
* Callback function triggered when the user attempts to close the modal.
|
|
55
|
+
* Called when clicking the X button, cancel button, or clicking outside the modal.
|
|
56
|
+
* Use this to handle modal closure logic and update the `open` state.
|
|
57
|
+
*/
|
|
58
|
+
onClose?: () => any;
|
|
59
|
+
/**
|
|
60
|
+
* When true, displays an additional custom button in the footer alongside default buttons.
|
|
61
|
+
* The custom button appears before the submit and cancel buttons.
|
|
62
|
+
* Configure the button's appearance and behavior with related custom button props.
|
|
63
|
+
*/
|
|
64
|
+
customButton?: boolean;
|
|
65
|
+
/**
|
|
66
|
+
* Text label for the custom button when `customButton` is true.
|
|
67
|
+
* This text will be displayed on the button to indicate its purpose or action.
|
|
68
|
+
*/
|
|
69
|
+
customButtonLabel?: string;
|
|
70
|
+
/**
|
|
71
|
+
* Callback function triggered when the custom button is clicked.
|
|
72
|
+
* Use this to define the action that should occur when users click the custom button.
|
|
73
|
+
*/
|
|
74
|
+
onClickCustomButton?: () => any;
|
|
75
|
+
/**
|
|
76
|
+
* Text label for the primary submit/confirmation button.
|
|
77
|
+
* This button typically confirms the modal action or submits form data.
|
|
78
|
+
* @default "OK"
|
|
79
|
+
*/
|
|
80
|
+
submitButtonLabel?: string;
|
|
81
|
+
/**
|
|
82
|
+
* Text label for the cancel/dismiss button.
|
|
83
|
+
* This button typically closes the modal without saving changes or performing actions.
|
|
84
|
+
* @default "Cancel"
|
|
85
|
+
*/
|
|
86
|
+
cancelButtonLabel?: string;
|
|
87
|
+
/**
|
|
88
|
+
* When true, disables the submit button preventing user interaction.
|
|
89
|
+
* Useful when form validation fails or when an operation is in progress.
|
|
90
|
+
* The button will appear visually disabled and won't respond to clicks.
|
|
91
|
+
*/
|
|
92
|
+
disableSubmitButton?: boolean;
|
|
93
|
+
/**
|
|
94
|
+
* Controls whether the submit button click event should stop propagation.
|
|
95
|
+
* When true, prevents the click event from bubbling up to parent elements.
|
|
96
|
+
* @default true
|
|
97
|
+
*/
|
|
98
|
+
stopPropagationSubmitButton?: boolean;
|
|
99
|
+
/**
|
|
100
|
+
* Callback function triggered when the submit button is clicked.
|
|
101
|
+
* Receives the click event as a parameter for additional event handling.
|
|
102
|
+
* Use this to handle form submission, data processing, or confirmation actions.
|
|
103
|
+
*/
|
|
104
|
+
onSubmit?: (event: React.MouseEvent) => any;
|
|
105
|
+
/**
|
|
106
|
+
* When true, allows the title text to be edited inline by clicking on it.
|
|
107
|
+
* The title becomes an input field that users can modify directly in the modal header.
|
|
108
|
+
* Useful for renaming operations or title customization workflows.
|
|
109
|
+
*/
|
|
110
|
+
isTitleEditable?: boolean;
|
|
111
|
+
/**
|
|
112
|
+
* Callback function triggered when the editable title text changes.
|
|
113
|
+
* Only relevant when `isTitleEditable` is true. Receives the change event
|
|
114
|
+
* which contains the new title value. Use this to update your title state.
|
|
115
|
+
*/
|
|
116
|
+
onTitleChanged?: React.ChangeEventHandler<FormControlElement>;
|
|
117
|
+
/**
|
|
118
|
+
* Additional CSS classes to apply to the title input field.
|
|
119
|
+
* Only used when `isTitleEditable` is true. Use this to customize
|
|
120
|
+
* the appearance of the editable title input beyond default styling.
|
|
121
|
+
*/
|
|
122
|
+
inputExtraClassNames?: string;
|
|
123
|
+
/**
|
|
124
|
+
* When true, hides the X close icon button in the modal header.
|
|
125
|
+
* Users will only be able to close the modal using footer buttons or by clicking outside.
|
|
126
|
+
* Useful when you want to force users to make an explicit choice via footer buttons.
|
|
127
|
+
*/
|
|
128
|
+
hideCloseIcon?: boolean;
|
|
129
|
+
/**
|
|
130
|
+
* Size variant that controls the modal's width and maximum dimensions:
|
|
131
|
+
* - `xs`: Extra small modal (280px max width)
|
|
132
|
+
* - `sm`: Small modal (384px max width)
|
|
133
|
+
* - `md`: Medium modal (448px max width)
|
|
134
|
+
* - `lg`: Large modal (512px max width)
|
|
135
|
+
* - `xl`: Extra large modal (576px max width)
|
|
136
|
+
* - `2xl` through `6xl`: Progressively larger sizes up to full screen
|
|
137
|
+
*/
|
|
138
|
+
size?: ModalSize;
|
|
139
|
+
/**
|
|
140
|
+
* When true, completely hides all default footer buttons (submit, cancel, custom).
|
|
141
|
+
* The modal will only have header and body content. Useful when you provide
|
|
142
|
+
* custom actions within the modal body or use a custom footer.
|
|
143
|
+
*/
|
|
144
|
+
hideFooterButtons?: boolean;
|
|
145
|
+
/**
|
|
146
|
+
* When true, hides only the submit button while keeping other footer buttons visible.
|
|
147
|
+
* Useful for information-only modals that don't require a confirmation action.
|
|
148
|
+
*/
|
|
149
|
+
hideSubmitButton?: boolean;
|
|
150
|
+
/**
|
|
151
|
+
* When true, hides only the cancel button while keeping other footer buttons visible.
|
|
152
|
+
* Useful for critical operations where cancellation should not be easily accessible.
|
|
153
|
+
*/
|
|
154
|
+
hideCancelButton?: boolean;
|
|
155
|
+
/**
|
|
156
|
+
* Test ID attribute for the modal container element.
|
|
157
|
+
* Used for automated testing to identify and interact with the modal.
|
|
158
|
+
* Applied to the modal's root element for test targeting.
|
|
159
|
+
*/
|
|
160
|
+
testId?: string;
|
|
161
|
+
/**
|
|
162
|
+
* Additional CSS classes to apply to the modal dialog container.
|
|
163
|
+
* Use this to customize the modal's positioning, sizing, or appearance
|
|
164
|
+
* beyond the built-in size variants and default styling.
|
|
165
|
+
*/
|
|
166
|
+
dialogClassName?: string;
|
|
167
|
+
/**
|
|
168
|
+
* Placeholder text displayed in the title input when `isTitleEditable` is true.
|
|
169
|
+
* Shows helpful text when the title field is empty, guiding users on what to enter.
|
|
170
|
+
*/
|
|
171
|
+
titlePlaceholder?: string;
|
|
172
|
+
/**
|
|
173
|
+
* When true, makes the title field required when `isTitleEditable` is true.
|
|
174
|
+
* Prevents submission or validation if the title is empty. Usually combined
|
|
175
|
+
* with validation feedback and error handling.
|
|
176
|
+
*/
|
|
177
|
+
titleRequired?: boolean;
|
|
178
|
+
/**
|
|
179
|
+
* Error message to display when the editable title has validation issues.
|
|
180
|
+
* Only shown when `isTitleEditable` is true and there's a title validation error.
|
|
181
|
+
* Provides user feedback about what needs to be corrected.
|
|
182
|
+
*/
|
|
183
|
+
titleError?: string;
|
|
184
|
+
/**
|
|
185
|
+
* Tooltip text to display when hovering over the submit button.
|
|
186
|
+
* Provides additional context or instructions about what the submit action will do.
|
|
187
|
+
* Helpful for clarifying the button's purpose in complex workflows.
|
|
188
|
+
*/
|
|
189
|
+
submitButtonTooltip?: string;
|
|
190
|
+
/**
|
|
191
|
+
* Tooltip text to display when hovering over the cancel button.
|
|
192
|
+
* Can provide information about what happens when canceling or any data loss warnings.
|
|
193
|
+
*/
|
|
194
|
+
cancelButtonTooltip?: string;
|
|
195
|
+
/**
|
|
196
|
+
* When true, disables the custom button preventing user interaction.
|
|
197
|
+
* Only relevant when `customButton` is true. The button will appear
|
|
198
|
+
* visually disabled and won't respond to clicks.
|
|
199
|
+
*/
|
|
200
|
+
disableCustomButton?: boolean;
|
|
201
|
+
/**
|
|
202
|
+
* Custom header content that completely replaces the default modal header.
|
|
203
|
+
* When provided, the default title, subtitle, and close button are not rendered.
|
|
204
|
+
* Use this when you need complete control over the header layout and content.
|
|
205
|
+
*/
|
|
206
|
+
customHeader?: React.ReactElement;
|
|
207
|
+
/**
|
|
208
|
+
* Content to display in the center area of the footer between buttons.
|
|
209
|
+
* Useful for adding status messages, progress indicators, or additional
|
|
210
|
+
* information that should be visible alongside the action buttons.
|
|
211
|
+
*/
|
|
212
|
+
middleFooterSection?: React.ReactElement;
|
|
213
|
+
/**
|
|
214
|
+
* Visual style variant for the custom button when `customButton` is true.
|
|
215
|
+
* Determines the button's appearance and color scheme. Uses the same
|
|
216
|
+
* variants as the standard Button component (outline, theme, danger, etc.).
|
|
217
|
+
*/
|
|
218
|
+
customButtonVariant?: ButtonVariant;
|
|
219
|
+
/**
|
|
220
|
+
* Controls whether focus should be trapped within the modal when open.
|
|
221
|
+
* When true (default), focus cycles through modal elements only. Set to false
|
|
222
|
+
* if you need to interact with elements outside the modal (like tooltips with inputs).
|
|
223
|
+
* @default true
|
|
224
|
+
*/
|
|
225
|
+
keepFocusInsideModal?: boolean;
|
|
226
|
+
/**
|
|
227
|
+
* Visual style variant for the submit button.
|
|
228
|
+
* Determines the button's appearance and color scheme. Use 'theme' for primary
|
|
229
|
+
* actions, 'danger' for destructive actions, or other variants as appropriate.
|
|
230
|
+
*/
|
|
231
|
+
submitButtonVariant?: ButtonVariant;
|
|
232
|
+
/**
|
|
233
|
+
* Callback function triggered when the user clicks/taps outside the modal dialog.
|
|
234
|
+
* Receives the pointer event. Use this to customize outside-click behavior,
|
|
235
|
+
* such as preventing closure in certain conditions or showing warnings.
|
|
236
|
+
*/
|
|
237
|
+
onPointerDownOutside?: (e: Event) => void;
|
|
238
|
+
/**
|
|
239
|
+
* Callback function triggered when the user interacts outside the modal.
|
|
240
|
+
* This includes clicks, taps, and other interactions outside the modal area.
|
|
241
|
+
* More general than `onPointerDownOutside` and covers additional interaction types.
|
|
242
|
+
*/
|
|
243
|
+
onInteractOutside?: (e: Event) => void;
|
|
244
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default } from './Modal';
|
|
1
|
+
export { default } from './Modal';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ProgressBarProps } from './ProgressBar.types';
|
|
3
|
-
declare const ProgressBar: React.FunctionComponent<ProgressBarProps>;
|
|
4
|
-
export default ProgressBar;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ProgressBarProps } from './ProgressBar.types';
|
|
3
|
+
declare const ProgressBar: React.FunctionComponent<ProgressBarProps>;
|
|
4
|
+
export default ProgressBar;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
import { TooltipComponentProps } from '../Tooltip/Tooltip.types';
|
|
2
|
+
/**
|
|
3
|
+
* Props for individual progress indicators within a ProgressBar.
|
|
4
|
+
* Each indicator represents a segment of the overall progress with its own value and styling.
|
|
5
|
+
* Extends TooltipComponentProps to support tooltip functionality on individual indicators.
|
|
6
|
+
*/
|
|
7
|
+
export interface ProgressIndicatorProps extends TooltipComponentProps {
|
|
8
|
+
/**
|
|
9
|
+
* Additional CSS classes to apply to this specific progress indicator.
|
|
10
|
+
* Use this to customize the appearance of individual indicators within the progress bar.
|
|
11
|
+
*/
|
|
12
|
+
extraClasses?: string;
|
|
13
|
+
/**
|
|
14
|
+
* Test ID attribute for this progress indicator used in automated testing.
|
|
15
|
+
* Helps identify and interact with specific indicators in test suites.
|
|
16
|
+
*/
|
|
17
|
+
testId?: string;
|
|
18
|
+
/**
|
|
19
|
+
* Current value of this progress indicator.
|
|
20
|
+
* Should be between 0 and the progress bar's max value. The indicator's width
|
|
21
|
+
* will be calculated as a percentage based on this value relative to the max.
|
|
22
|
+
*/
|
|
23
|
+
value: number;
|
|
24
|
+
/**
|
|
25
|
+
* Custom color for this progress indicator.
|
|
26
|
+
* Can be any valid CSS color value (hex, rgb, color names, etc.).
|
|
27
|
+
* If not provided, uses the default theme color for progress indicators.
|
|
28
|
+
*/
|
|
29
|
+
color?: string;
|
|
30
|
+
/**
|
|
31
|
+
* Text label to display on or next to this progress indicator.
|
|
32
|
+
* Useful for showing the indicator's name, category, or current value.
|
|
33
|
+
* Can be positioned and styled using labelClasses.
|
|
34
|
+
*/
|
|
35
|
+
label?: string;
|
|
36
|
+
/**
|
|
37
|
+
* Additional CSS classes to apply specifically to the indicator's label.
|
|
38
|
+
* Use this to customize the label's typography, positioning, or styling
|
|
39
|
+
* independently from the indicator itself.
|
|
40
|
+
*/
|
|
41
|
+
labelClasses?: string;
|
|
42
|
+
}
|
|
43
|
+
/**
|
|
44
|
+
* Props for the ProgressBar component that displays one or more progress indicators.
|
|
45
|
+
* Supports multiple indicators for showing different categories or segments of progress.
|
|
46
|
+
*/
|
|
47
|
+
export interface ProgressBarProps {
|
|
48
|
+
/**
|
|
49
|
+
* Array of progress indicators to display within the progress bar.
|
|
50
|
+
* Each indicator can have its own value, color, label, and styling.
|
|
51
|
+
* Indicators are rendered in the order they appear in the array.
|
|
52
|
+
*/
|
|
53
|
+
values: ProgressIndicatorProps[];
|
|
54
|
+
/**
|
|
55
|
+
* Maximum value for the progress bar scale.
|
|
56
|
+
* All indicator values are calculated as percentages relative to this maximum.
|
|
57
|
+
* Determines the full width (100%) of the progress bar.
|
|
58
|
+
* @default 100
|
|
59
|
+
*/
|
|
60
|
+
max?: number;
|
|
61
|
+
/**
|
|
62
|
+
* Additional CSS classes to apply to the progress bar container.
|
|
63
|
+
* Use this to customize the overall appearance, spacing, or layout of the entire progress bar.
|
|
64
|
+
*/
|
|
65
|
+
containerExtraClasses?: string;
|
|
66
|
+
/**
|
|
67
|
+
* Test ID attribute for the progress bar container used in automated testing.
|
|
68
|
+
* Applied to the main container element for test targeting and interaction.
|
|
69
|
+
*/
|
|
70
|
+
testId?: string;
|
|
71
|
+
/**
|
|
72
|
+
* Text label to display when all progress indicators have a value of zero.
|
|
73
|
+
* Useful for providing context or instructions when no progress has been made.
|
|
74
|
+
* Only shown when the total progress is zero.
|
|
75
|
+
*/
|
|
76
|
+
zeroValueLabel?: string;
|
|
77
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './ProgressBar';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { SeeqActionDropdownProps } from './SeeqActionDropdown.types';
|
|
3
|
-
declare const SeeqActionDropdown: React.FunctionComponent<SeeqActionDropdownProps>;
|
|
4
|
-
export default SeeqActionDropdown;
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { SeeqActionDropdownProps } from './SeeqActionDropdown.types';
|
|
3
|
+
declare const SeeqActionDropdown: React.FunctionComponent<SeeqActionDropdownProps>;
|
|
4
|
+
export default SeeqActionDropdown;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import '@testing-library/jest-dom';
|
|
1
|
+
import '@testing-library/jest-dom';
|