@seeqdev/qomponents 0.0.161 → 0.0.162
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/index.esm.js +4 -3
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +4 -3
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
- package/dist/Accordion/Accordion.d.ts +0 -4
- package/dist/Accordion/Accordion.js +0 -7
- package/dist/Accordion/Accordion.js.map +0 -1
- package/dist/Accordion/Accordion.stories.d.ts +0 -5
- package/dist/Accordion/Accordion.stories.js +0 -75
- package/dist/Accordion/Accordion.stories.js.map +0 -1
- package/dist/Accordion/Accordion.test.d.ts +0 -1
- package/dist/Accordion/Accordion.test.js +0 -55
- package/dist/Accordion/Accordion.test.js.map +0 -1
- package/dist/Accordion/Accordion.types.d.ts +0 -86
- package/dist/Accordion/Accordion.types.js +0 -2
- package/dist/Accordion/Accordion.types.js.map +0 -1
- package/dist/Accordion/index.d.ts +0 -1
- package/dist/Accordion/index.js +0 -2
- package/dist/Accordion/index.js.map +0 -1
- package/dist/Alert/Alert.d.ts +0 -7
- package/dist/Alert/Alert.js +0 -32
- package/dist/Alert/Alert.js.map +0 -1
- package/dist/Alert/Alert.stories.d.ts +0 -5
- package/dist/Alert/Alert.stories.js +0 -57
- package/dist/Alert/Alert.stories.js.map +0 -1
- package/dist/Alert/Alert.test.d.ts +0 -1
- package/dist/Alert/Alert.test.js +0 -50
- package/dist/Alert/Alert.test.js.map +0 -1
- package/dist/Alert/Alert.types.d.ts +0 -63
- package/dist/Alert/Alert.types.js +0 -2
- package/dist/Alert/Alert.types.js.map +0 -1
- package/dist/Alert/index.d.ts +0 -1
- package/dist/Alert/index.js +0 -2
- package/dist/Alert/index.js.map +0 -1
- package/dist/Button/Button.d.ts +0 -10
- package/dist/Button/Button.js +0 -89
- package/dist/Button/Button.js.map +0 -1
- package/dist/Button/Button.stories.d.ts +0 -8
- package/dist/Button/Button.stories.js +0 -25
- package/dist/Button/Button.stories.js.map +0 -1
- package/dist/Button/Button.test.d.ts +0 -1
- package/dist/Button/Button.test.js +0 -47
- package/dist/Button/Button.test.js.map +0 -1
- package/dist/Button/Button.types.d.ts +0 -148
- package/dist/Button/Button.types.js +0 -5
- package/dist/Button/Button.types.js.map +0 -1
- package/dist/Button/index.d.ts +0 -1
- package/dist/Button/index.js +0 -2
- package/dist/Button/index.js.map +0 -1
- package/dist/ButtonGroup/ButtonGroup.d.ts +0 -7
- package/dist/ButtonGroup/ButtonGroup.js +0 -35
- package/dist/ButtonGroup/ButtonGroup.js.map +0 -1
- package/dist/ButtonGroup/ButtonGroup.stories.d.ts +0 -5
- package/dist/ButtonGroup/ButtonGroup.stories.js +0 -317
- package/dist/ButtonGroup/ButtonGroup.stories.js.map +0 -1
- package/dist/ButtonGroup/ButtonGroup.test.d.ts +0 -1
- package/dist/ButtonGroup/ButtonGroup.test.js +0 -66
- package/dist/ButtonGroup/ButtonGroup.test.js.map +0 -1
- package/dist/ButtonGroup/ButtonGroup.types.d.ts +0 -81
- package/dist/ButtonGroup/ButtonGroup.types.js +0 -2
- package/dist/ButtonGroup/ButtonGroup.types.js.map +0 -1
- package/dist/ButtonGroup/index.d.ts +0 -1
- package/dist/ButtonGroup/index.js +0 -2
- package/dist/ButtonGroup/index.js.map +0 -1
- package/dist/ButtonWithDropdown/ButtonWithDropdown.d.ts +0 -4
- package/dist/ButtonWithDropdown/ButtonWithDropdown.js +0 -36
- package/dist/ButtonWithDropdown/ButtonWithDropdown.js.map +0 -1
- package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.d.ts +0 -5
- package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js +0 -104
- package/dist/ButtonWithDropdown/ButtonWithDropdown.stories.js.map +0 -1
- package/dist/ButtonWithDropdown/ButtonWithDropdown.test.d.ts +0 -1
- package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js +0 -93
- package/dist/ButtonWithDropdown/ButtonWithDropdown.test.js.map +0 -1
- package/dist/ButtonWithDropdown/ButtonWithDropdown.types.d.ts +0 -233
- package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js +0 -2
- package/dist/ButtonWithDropdown/ButtonWithDropdown.types.js.map +0 -1
- package/dist/ButtonWithDropdown/index.d.ts +0 -1
- package/dist/ButtonWithDropdown/index.js +0 -2
- package/dist/ButtonWithDropdown/index.js.map +0 -1
- package/dist/ButtonWithPopover/ButtonWithPopover.d.ts +0 -4
- package/dist/ButtonWithPopover/ButtonWithPopover.js +0 -55
- package/dist/ButtonWithPopover/ButtonWithPopover.js.map +0 -1
- package/dist/ButtonWithPopover/ButtonWithPopover.stories.d.ts +0 -5
- package/dist/ButtonWithPopover/ButtonWithPopover.stories.js +0 -25
- package/dist/ButtonWithPopover/ButtonWithPopover.stories.js.map +0 -1
- package/dist/ButtonWithPopover/ButtonWithPopover.test.d.ts +0 -1
- package/dist/ButtonWithPopover/ButtonWithPopover.test.js +0 -81
- package/dist/ButtonWithPopover/ButtonWithPopover.test.js.map +0 -1
- package/dist/ButtonWithPopover/ButtonWithPopover.types.d.ts +0 -134
- package/dist/ButtonWithPopover/ButtonWithPopover.types.js +0 -2
- package/dist/ButtonWithPopover/ButtonWithPopover.types.js.map +0 -1
- package/dist/ButtonWithPopover/index.d.ts +0 -1
- package/dist/ButtonWithPopover/index.js +0 -2
- package/dist/ButtonWithPopover/index.js.map +0 -1
- package/dist/Carousel/Carousel.d.ts +0 -9
- package/dist/Carousel/Carousel.js +0 -75
- package/dist/Carousel/Carousel.js.map +0 -1
- package/dist/Carousel/Carousel.stories.d.ts +0 -5
- package/dist/Carousel/Carousel.stories.js +0 -63
- package/dist/Carousel/Carousel.stories.js.map +0 -1
- package/dist/Carousel/Carousel.test.d.ts +0 -1
- package/dist/Carousel/Carousel.test.js +0 -48
- package/dist/Carousel/Carousel.test.js.map +0 -1
- package/dist/Carousel/Carousel.types.d.ts +0 -86
- package/dist/Carousel/Carousel.types.js +0 -2
- package/dist/Carousel/Carousel.types.js.map +0 -1
- package/dist/Carousel/index.d.ts +0 -1
- package/dist/Carousel/index.js +0 -2
- package/dist/Carousel/index.js.map +0 -1
- package/dist/Checkbox/Checkbox.d.ts +0 -7
- package/dist/Checkbox/Checkbox.js +0 -24
- package/dist/Checkbox/Checkbox.js.map +0 -1
- package/dist/Checkbox/Checkbox.stories.d.ts +0 -5
- package/dist/Checkbox/Checkbox.stories.js +0 -12
- package/dist/Checkbox/Checkbox.stories.js.map +0 -1
- package/dist/Checkbox/Checkbox.test.d.ts +0 -1
- package/dist/Checkbox/Checkbox.test.js +0 -94
- package/dist/Checkbox/Checkbox.test.js.map +0 -1
- package/dist/Checkbox/Checkbox.types.d.ts +0 -92
- package/dist/Checkbox/Checkbox.types.js +0 -2
- package/dist/Checkbox/Checkbox.types.js.map +0 -1
- package/dist/Checkbox/index.d.ts +0 -1
- package/dist/Checkbox/index.js +0 -2
- package/dist/Checkbox/index.js.map +0 -1
- package/dist/Collapse/Collapse.d.ts +0 -4
- package/dist/Collapse/Collapse.js +0 -17
- package/dist/Collapse/Collapse.js.map +0 -1
- package/dist/Collapse/Collapse.stories.d.ts +0 -5
- package/dist/Collapse/Collapse.stories.js +0 -15
- package/dist/Collapse/Collapse.stories.js.map +0 -1
- package/dist/Collapse/Collapse.test.d.ts +0 -1
- package/dist/Collapse/Collapse.test.js +0 -17
- package/dist/Collapse/Collapse.test.js.map +0 -1
- package/dist/Collapse/Collapse.types.d.ts +0 -19
- package/dist/Collapse/Collapse.types.js +0 -2
- package/dist/Collapse/Collapse.types.js.map +0 -1
- package/dist/Collapse/index.d.ts +0 -1
- package/dist/Collapse/index.js +0 -2
- package/dist/Collapse/index.js.map +0 -1
- package/dist/Icon/Icon.d.ts +0 -10
- package/dist/Icon/Icon.js +0 -55
- package/dist/Icon/Icon.js.map +0 -1
- package/dist/Icon/Icon.stories.d.ts +0 -5
- package/dist/Icon/Icon.stories.js +0 -15
- package/dist/Icon/Icon.stories.js.map +0 -1
- package/dist/Icon/Icon.test.d.ts +0 -1
- package/dist/Icon/Icon.test.js +0 -55
- package/dist/Icon/Icon.test.js.map +0 -1
- package/dist/Icon/Icon.types.d.ts +0 -87
- package/dist/Icon/Icon.types.js +0 -16
- package/dist/Icon/Icon.types.js.map +0 -1
- package/dist/Icon/index.d.ts +0 -1
- package/dist/Icon/index.js +0 -2
- package/dist/Icon/index.js.map +0 -1
- package/dist/InputGroup/InputGroup.d.ts +0 -7
- package/dist/InputGroup/InputGroup.js +0 -34
- package/dist/InputGroup/InputGroup.js.map +0 -1
- package/dist/InputGroup/InputGroup.stories.d.ts +0 -5
- package/dist/InputGroup/InputGroup.stories.js +0 -129
- package/dist/InputGroup/InputGroup.stories.js.map +0 -1
- package/dist/InputGroup/InputGroup.test.d.ts +0 -1
- package/dist/InputGroup/InputGroup.test.js +0 -42
- package/dist/InputGroup/InputGroup.test.js.map +0 -1
- package/dist/InputGroup/InputGroup.types.d.ts +0 -62
- package/dist/InputGroup/InputGroup.types.js +0 -2
- package/dist/InputGroup/InputGroup.types.js.map +0 -1
- package/dist/InputGroup/index.d.ts +0 -2
- package/dist/InputGroup/index.js +0 -2
- package/dist/InputGroup/index.js.map +0 -1
- package/dist/Modal/Modal.d.ts +0 -5
- package/dist/Modal/Modal.js +0 -76
- package/dist/Modal/Modal.js.map +0 -1
- package/dist/Modal/Modal.stories.d.ts +0 -10
- package/dist/Modal/Modal.stories.js +0 -44
- package/dist/Modal/Modal.stories.js.map +0 -1
- package/dist/Modal/Modal.test.d.ts +0 -1
- package/dist/Modal/Modal.test.js +0 -108
- package/dist/Modal/Modal.test.js.map +0 -1
- package/dist/Modal/Modal.types.d.ts +0 -244
- package/dist/Modal/Modal.types.js +0 -2
- package/dist/Modal/Modal.types.js.map +0 -1
- package/dist/Modal/index.d.ts +0 -1
- package/dist/Modal/index.js +0 -2
- package/dist/Modal/index.js.map +0 -1
- package/dist/ProgressBar/ProgressBar.d.ts +0 -4
- package/dist/ProgressBar/ProgressBar.js +0 -72
- package/dist/ProgressBar/ProgressBar.js.map +0 -1
- package/dist/ProgressBar/ProgressBar.stories.d.ts +0 -5
- package/dist/ProgressBar/ProgressBar.stories.js +0 -35
- package/dist/ProgressBar/ProgressBar.stories.js.map +0 -1
- package/dist/ProgressBar/ProgressBar.test.d.ts +0 -1
- package/dist/ProgressBar/ProgressBar.test.js +0 -43
- package/dist/ProgressBar/ProgressBar.test.js.map +0 -1
- package/dist/ProgressBar/ProgressBar.types.d.ts +0 -77
- package/dist/ProgressBar/ProgressBar.types.js +0 -2
- package/dist/ProgressBar/ProgressBar.types.js.map +0 -1
- package/dist/ProgressBar/index.d.ts +0 -1
- package/dist/ProgressBar/index.js +0 -2
- package/dist/ProgressBar/index.js.map +0 -1
- package/dist/SeeqActionDropdown/SeeqActionDropdown.d.ts +0 -4
- package/dist/SeeqActionDropdown/SeeqActionDropdown.js +0 -39
- package/dist/SeeqActionDropdown/SeeqActionDropdown.js.map +0 -1
- package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.d.ts +0 -5
- package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js +0 -56
- package/dist/SeeqActionDropdown/SeeqActionDropdown.stories.js.map +0 -1
- package/dist/SeeqActionDropdown/SeeqActionDropdown.test.d.ts +0 -1
- package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js +0 -73
- package/dist/SeeqActionDropdown/SeeqActionDropdown.test.js.map +0 -1
- package/dist/SeeqActionDropdown/SeeqActionDropdown.types.d.ts +0 -160
- package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js +0 -2
- package/dist/SeeqActionDropdown/SeeqActionDropdown.types.js.map +0 -1
- package/dist/SeeqActionDropdown/index.d.ts +0 -1
- package/dist/SeeqActionDropdown/index.js +0 -2
- package/dist/SeeqActionDropdown/index.js.map +0 -1
- package/dist/SeeqActionDropdown/variants.d.ts +0 -5
- package/dist/SeeqActionDropdown/variants.js +0 -29
- package/dist/SeeqActionDropdown/variants.js.map +0 -1
- package/dist/Select/Select.d.ts +0 -15
- package/dist/Select/Select.js +0 -177
- package/dist/Select/Select.js.map +0 -1
- package/dist/Select/Select.stories.d.ts +0 -5
- package/dist/Select/Select.stories.js +0 -40
- package/dist/Select/Select.stories.js.map +0 -1
- package/dist/Select/Select.test.d.ts +0 -1
- package/dist/Select/Select.test.js +0 -175
- package/dist/Select/Select.test.js.map +0 -1
- package/dist/Select/Select.types.d.ts +0 -220
- package/dist/Select/Select.types.js +0 -2
- package/dist/Select/Select.types.js.map +0 -1
- package/dist/Select/index.d.ts +0 -2
- package/dist/Select/index.js +0 -3
- package/dist/Select/index.js.map +0 -1
- package/dist/Slider/Slider.d.ts +0 -6
- package/dist/Slider/Slider.js +0 -10
- package/dist/Slider/Slider.js.map +0 -1
- package/dist/Slider/Slider.stories.d.ts +0 -5
- package/dist/Slider/Slider.stories.js +0 -14
- package/dist/Slider/Slider.stories.js.map +0 -1
- package/dist/Slider/Slider.test.d.ts +0 -1
- package/dist/Slider/Slider.test.js +0 -32
- package/dist/Slider/Slider.test.js.map +0 -1
- package/dist/Slider/Slider.types.d.ts +0 -85
- package/dist/Slider/Slider.types.js +0 -2
- package/dist/Slider/Slider.types.js.map +0 -1
- package/dist/Slider/index.d.ts +0 -1
- package/dist/Slider/index.js +0 -2
- package/dist/Slider/index.js.map +0 -1
- package/dist/SvgIcon/SvgIcon.d.ts +0 -20
- package/dist/SvgIcon/SvgIcon.js +0 -28
- package/dist/SvgIcon/SvgIcon.js.map +0 -1
- package/dist/SvgIcon/SvgIcon.stories.d.ts +0 -5
- package/dist/SvgIcon/SvgIcon.stories.js +0 -18
- package/dist/SvgIcon/SvgIcon.stories.js.map +0 -1
- package/dist/SvgIcon/SvgIcon.test.d.ts +0 -1
- package/dist/SvgIcon/SvgIcon.test.js +0 -41
- package/dist/SvgIcon/SvgIcon.test.js.map +0 -1
- package/dist/SvgIcon/SvgIcon.types.d.ts +0 -76
- package/dist/SvgIcon/SvgIcon.types.js +0 -3
- package/dist/SvgIcon/SvgIcon.types.js.map +0 -1
- package/dist/SvgIcon/index.d.ts +0 -1
- package/dist/SvgIcon/index.js +0 -2
- package/dist/SvgIcon/index.js.map +0 -1
- package/dist/Tabs/Tabs.d.ts +0 -4
- package/dist/Tabs/Tabs.js +0 -17
- package/dist/Tabs/Tabs.js.map +0 -1
- package/dist/Tabs/Tabs.stories.d.ts +0 -5
- package/dist/Tabs/Tabs.stories.js +0 -73
- package/dist/Tabs/Tabs.stories.js.map +0 -1
- package/dist/Tabs/Tabs.test.d.ts +0 -1
- package/dist/Tabs/Tabs.test.js +0 -86
- package/dist/Tabs/Tabs.test.js.map +0 -1
- package/dist/Tabs/Tabs.types.d.ts +0 -95
- package/dist/Tabs/Tabs.types.js +0 -2
- package/dist/Tabs/Tabs.types.js.map +0 -1
- package/dist/Tabs/index.d.ts +0 -1
- package/dist/Tabs/index.js +0 -2
- package/dist/Tabs/index.js.map +0 -1
- package/dist/TextArea/TextArea.d.ts +0 -7
- package/dist/TextArea/TextArea.js +0 -25
- package/dist/TextArea/TextArea.js.map +0 -1
- package/dist/TextArea/TextArea.stories.d.ts +0 -5
- package/dist/TextArea/TextArea.stories.js +0 -10
- package/dist/TextArea/TextArea.stories.js.map +0 -1
- package/dist/TextArea/TextArea.test.d.ts +0 -1
- package/dist/TextArea/TextArea.test.js +0 -68
- package/dist/TextArea/TextArea.test.js.map +0 -1
- package/dist/TextArea/TextArea.types.d.ts +0 -105
- package/dist/TextArea/TextArea.types.js +0 -2
- package/dist/TextArea/TextArea.types.js.map +0 -1
- package/dist/TextArea/index.d.ts +0 -1
- package/dist/TextArea/index.js +0 -2
- package/dist/TextArea/index.js.map +0 -1
- package/dist/TextField/TextField.d.ts +0 -7
- package/dist/TextField/TextField.js +0 -85
- package/dist/TextField/TextField.js.map +0 -1
- package/dist/TextField/TextField.stories.d.ts +0 -5
- package/dist/TextField/TextField.stories.js +0 -11
- package/dist/TextField/TextField.stories.js.map +0 -1
- package/dist/TextField/TextField.test.d.ts +0 -1
- package/dist/TextField/TextField.test.js +0 -41
- package/dist/TextField/TextField.test.js.map +0 -1
- package/dist/TextField/TextField.types.d.ts +0 -199
- package/dist/TextField/TextField.types.js +0 -2
- package/dist/TextField/TextField.types.js.map +0 -1
- package/dist/TextField/index.d.ts +0 -1
- package/dist/TextField/index.js +0 -2
- package/dist/TextField/index.js.map +0 -1
- package/dist/ToolbarButton/ToolbarButton.d.ts +0 -3
- package/dist/ToolbarButton/ToolbarButton.js +0 -57
- package/dist/ToolbarButton/ToolbarButton.js.map +0 -1
- package/dist/ToolbarButton/ToolbarButton.stories.d.ts +0 -5
- package/dist/ToolbarButton/ToolbarButton.stories.js +0 -28
- package/dist/ToolbarButton/ToolbarButton.stories.js.map +0 -1
- package/dist/ToolbarButton/ToolbarButton.test.d.ts +0 -1
- package/dist/ToolbarButton/ToolbarButton.test.js +0 -85
- package/dist/ToolbarButton/ToolbarButton.test.js.map +0 -1
- package/dist/ToolbarButton/ToolbarButton.types.d.ts +0 -122
- package/dist/ToolbarButton/ToolbarButton.types.js +0 -2
- package/dist/ToolbarButton/ToolbarButton.types.js.map +0 -1
- package/dist/ToolbarButton/index.d.ts +0 -1
- package/dist/ToolbarButton/index.js +0 -2
- package/dist/ToolbarButton/index.js.map +0 -1
- package/dist/Tooltip/QTip.stories.d.ts +0 -5
- package/dist/Tooltip/QTip.stories.js +0 -19
- package/dist/Tooltip/QTip.stories.js.map +0 -1
- package/dist/Tooltip/QTip.types.d.ts +0 -13
- package/dist/Tooltip/QTip.types.js +0 -2
- package/dist/Tooltip/QTip.types.js.map +0 -1
- package/dist/Tooltip/QTipPerformance.stories.d.ts +0 -5
- package/dist/Tooltip/QTipPerformance.stories.js +0 -26
- package/dist/Tooltip/QTipPerformance.stories.js.map +0 -1
- package/dist/Tooltip/Qtip.d.ts +0 -26
- package/dist/Tooltip/Qtip.js +0 -168
- package/dist/Tooltip/Qtip.js.map +0 -1
- package/dist/Tooltip/Tooltip.d.ts +0 -13
- package/dist/Tooltip/Tooltip.js +0 -34
- package/dist/Tooltip/Tooltip.js.map +0 -1
- package/dist/Tooltip/Tooltip.stories.d.ts +0 -5
- package/dist/Tooltip/Tooltip.stories.js +0 -15
- package/dist/Tooltip/Tooltip.stories.js.map +0 -1
- package/dist/Tooltip/Tooltip.types.d.ts +0 -22
- package/dist/Tooltip/Tooltip.types.js +0 -3
- package/dist/Tooltip/Tooltip.types.js.map +0 -1
- package/dist/Tooltip/TooltipPerformance.stories.d.ts +0 -5
- package/dist/Tooltip/TooltipPerformance.stories.js +0 -26
- package/dist/Tooltip/TooltipPerformance.stories.js.map +0 -1
- package/dist/Tooltip/index.d.ts +0 -2
- package/dist/Tooltip/index.js +0 -3
- package/dist/Tooltip/index.js.map +0 -1
- package/dist/Tooltip/qTip.utilities.d.ts +0 -3
- package/dist/Tooltip/qTip.utilities.js +0 -11
- package/dist/Tooltip/qTip.utilities.js.map +0 -1
- package/dist/index.d.ts +0 -46
- package/dist/setupTests.d.ts +0 -1
- package/dist/setupTests.js +0 -6
- package/dist/setupTests.js.map +0 -1
- package/dist/types.d.ts +0 -27
- package/dist/types.js +0 -26
- package/dist/types.js.map +0 -1
- package/dist/utils/browserId.d.ts +0 -9
- package/dist/utils/browserId.js +0 -29
- package/dist/utils/browserId.js.map +0 -1
- package/dist/utils/svg.d.ts +0 -15
- package/dist/utils/svg.js +0 -20
- package/dist/utils/svg.js.map +0 -1
- package/dist/utils/validateStyleDimension.d.ts +0 -2
- package/dist/utils/validateStyleDimension.js +0 -14
- package/dist/utils/validateStyleDimension.js.map +0 -1
- package/dist/utils/validateStyleDimension.test.d.ts +0 -1
- package/dist/utils/validateStyleDimension.test.js +0 -20
- package/dist/utils/validateStyleDimension.test.js.map +0 -1
|
@@ -1,317 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import { QTip } from '../Tooltip/Qtip';
|
|
4
|
-
import { ButtonGroup } from './ButtonGroup';
|
|
5
|
-
import ToolbarButton from '../ToolbarButton';
|
|
6
|
-
export default {
|
|
7
|
-
title: 'ButtonGroup',
|
|
8
|
-
};
|
|
9
|
-
export const AllButtonGroups = () => {
|
|
10
|
-
const [value, setValue] = React.useState('provided-1');
|
|
11
|
-
const renderAllVariations = () => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "light", children: [_jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { onChange: () => { }, buttons: [
|
|
12
|
-
{
|
|
13
|
-
variant: 'button',
|
|
14
|
-
buttonProps: {
|
|
15
|
-
variant: 'outline',
|
|
16
|
-
icon: 'fc-annotate',
|
|
17
|
-
iconStyle: 'theme',
|
|
18
|
-
value: 'provided-1',
|
|
19
|
-
},
|
|
20
|
-
},
|
|
21
|
-
{
|
|
22
|
-
variant: 'button',
|
|
23
|
-
buttonProps: {
|
|
24
|
-
variant: 'outline',
|
|
25
|
-
icon: 'fc-trash',
|
|
26
|
-
iconStyle: 'theme',
|
|
27
|
-
value: 'provided-2',
|
|
28
|
-
},
|
|
29
|
-
},
|
|
30
|
-
{
|
|
31
|
-
variant: 'button',
|
|
32
|
-
buttonProps: {
|
|
33
|
-
variant: 'outline',
|
|
34
|
-
icon: 'fc-formula-ai',
|
|
35
|
-
iconStyle: 'theme',
|
|
36
|
-
value: 'provided-3',
|
|
37
|
-
},
|
|
38
|
-
},
|
|
39
|
-
] }) }), _jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { onChange: (newValue) => setValue(newValue), buttons: [
|
|
40
|
-
{
|
|
41
|
-
variant: 'button',
|
|
42
|
-
buttonProps: {
|
|
43
|
-
variant: 'outline',
|
|
44
|
-
icon: 'fc-annotate',
|
|
45
|
-
extraClassNames: 'tw-border-none',
|
|
46
|
-
iconStyle: 'theme',
|
|
47
|
-
value: 'provided-1',
|
|
48
|
-
},
|
|
49
|
-
},
|
|
50
|
-
{
|
|
51
|
-
variant: 'button',
|
|
52
|
-
buttonProps: {
|
|
53
|
-
variant: 'outline',
|
|
54
|
-
icon: 'fc-trash',
|
|
55
|
-
extraClassNames: 'tw-border-none',
|
|
56
|
-
iconStyle: 'theme',
|
|
57
|
-
value: 'provided-2',
|
|
58
|
-
},
|
|
59
|
-
},
|
|
60
|
-
{
|
|
61
|
-
variant: 'button',
|
|
62
|
-
buttonProps: {
|
|
63
|
-
variant: 'outline',
|
|
64
|
-
extraClassNames: 'tw-border-none',
|
|
65
|
-
icon: 'fc-formula-ai',
|
|
66
|
-
iconStyle: 'theme',
|
|
67
|
-
value: 'provided-3',
|
|
68
|
-
},
|
|
69
|
-
},
|
|
70
|
-
] }) }), _jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { onChange: (newValue) => setValue(newValue), buttons: [
|
|
71
|
-
{
|
|
72
|
-
variant: 'button',
|
|
73
|
-
buttonProps: {
|
|
74
|
-
variant: 'theme',
|
|
75
|
-
icon: 'fc-annotate',
|
|
76
|
-
iconStyle: 'white',
|
|
77
|
-
value: 'provided-1',
|
|
78
|
-
},
|
|
79
|
-
},
|
|
80
|
-
{
|
|
81
|
-
variant: 'button',
|
|
82
|
-
buttonProps: {
|
|
83
|
-
variant: 'theme',
|
|
84
|
-
icon: 'fc-trash',
|
|
85
|
-
iconStyle: 'white',
|
|
86
|
-
value: 'provided-2',
|
|
87
|
-
},
|
|
88
|
-
},
|
|
89
|
-
{
|
|
90
|
-
variant: 'button',
|
|
91
|
-
buttonProps: {
|
|
92
|
-
variant: 'theme',
|
|
93
|
-
icon: 'fc-formula-ai',
|
|
94
|
-
iconStyle: 'white',
|
|
95
|
-
value: 'provided-3',
|
|
96
|
-
},
|
|
97
|
-
},
|
|
98
|
-
] }) }), _jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { onChange: (newValue) => setValue(newValue), buttons: [
|
|
99
|
-
{
|
|
100
|
-
variant: 'button',
|
|
101
|
-
buttonProps: {
|
|
102
|
-
variant: 'theme',
|
|
103
|
-
label: 'annotate',
|
|
104
|
-
value: 'provided-1',
|
|
105
|
-
},
|
|
106
|
-
},
|
|
107
|
-
{
|
|
108
|
-
variant: 'button',
|
|
109
|
-
buttonProps: {
|
|
110
|
-
variant: 'theme',
|
|
111
|
-
label: 'trash',
|
|
112
|
-
value: 'provided-2',
|
|
113
|
-
},
|
|
114
|
-
},
|
|
115
|
-
{
|
|
116
|
-
variant: 'button',
|
|
117
|
-
buttonProps: {
|
|
118
|
-
variant: 'theme',
|
|
119
|
-
label: 'formula-ai',
|
|
120
|
-
value: 'provided-3',
|
|
121
|
-
},
|
|
122
|
-
},
|
|
123
|
-
] }) }), _jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { onChange: () => { }, buttons: [
|
|
124
|
-
{
|
|
125
|
-
variant: 'element',
|
|
126
|
-
element: (_jsx(ToolbarButton, { icon: "fc-y-axis", label: "Popover", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: _jsx("div", { className: "tw-text-sm dark:tw-text-white", children: _jsx("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2", children: "Flavors" }) }) })),
|
|
127
|
-
},
|
|
128
|
-
{
|
|
129
|
-
variant: 'element',
|
|
130
|
-
element: (_jsx(ToolbarButton, { icon: "fc-trash", label: "Trash", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: _jsx("div", { className: "tw-text-sm dark:tw-text-white", children: _jsx("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2", children: "Flavors" }) }) })),
|
|
131
|
-
},
|
|
132
|
-
{
|
|
133
|
-
variant: 'element',
|
|
134
|
-
element: (_jsx(ToolbarButton, { icon: "fc-formula-ai", label: "Formula", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: _jsx("div", { className: "tw-text-sm dark:tw-text-white", children: _jsx("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2", children: "Flavors" }) }) })),
|
|
135
|
-
},
|
|
136
|
-
] }) }), _jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { buttons: [
|
|
137
|
-
{
|
|
138
|
-
variant: 'button',
|
|
139
|
-
buttonProps: {
|
|
140
|
-
size: 'sm',
|
|
141
|
-
icon: 'fc-annotate',
|
|
142
|
-
value: 'left',
|
|
143
|
-
isActive: true,
|
|
144
|
-
},
|
|
145
|
-
},
|
|
146
|
-
{
|
|
147
|
-
variant: 'button',
|
|
148
|
-
buttonProps: {
|
|
149
|
-
size: 'sm',
|
|
150
|
-
icon: 'fc-trash',
|
|
151
|
-
value: 'center',
|
|
152
|
-
isActive: false,
|
|
153
|
-
},
|
|
154
|
-
},
|
|
155
|
-
{
|
|
156
|
-
variant: 'button',
|
|
157
|
-
buttonProps: {
|
|
158
|
-
size: 'sm',
|
|
159
|
-
icon: 'fc-formula-ai',
|
|
160
|
-
value: 'right',
|
|
161
|
-
isActive: false,
|
|
162
|
-
},
|
|
163
|
-
},
|
|
164
|
-
] }) })] }), _jsxs("div", { className: "tw-dark tw-bg-sq-dark-background", children: [_jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { onChange: (newValue) => setValue(newValue), buttons: [
|
|
165
|
-
{
|
|
166
|
-
variant: 'button',
|
|
167
|
-
buttonProps: {
|
|
168
|
-
variant: 'outline',
|
|
169
|
-
icon: 'fc-annotate',
|
|
170
|
-
iconStyle: 'theme',
|
|
171
|
-
value: 'provided-1',
|
|
172
|
-
},
|
|
173
|
-
},
|
|
174
|
-
{
|
|
175
|
-
variant: 'button',
|
|
176
|
-
buttonProps: {
|
|
177
|
-
variant: 'outline',
|
|
178
|
-
icon: 'fc-trash',
|
|
179
|
-
iconStyle: 'theme',
|
|
180
|
-
value: 'provided-2',
|
|
181
|
-
},
|
|
182
|
-
},
|
|
183
|
-
{
|
|
184
|
-
variant: 'button',
|
|
185
|
-
buttonProps: {
|
|
186
|
-
variant: 'outline',
|
|
187
|
-
icon: 'fc-formula-ai',
|
|
188
|
-
iconStyle: 'theme',
|
|
189
|
-
value: 'provided-3',
|
|
190
|
-
},
|
|
191
|
-
},
|
|
192
|
-
] }) }), _jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { onChange: (newValue) => setValue(newValue), buttons: [
|
|
193
|
-
{
|
|
194
|
-
variant: 'button',
|
|
195
|
-
buttonProps: {
|
|
196
|
-
variant: 'no-border',
|
|
197
|
-
icon: 'fc-annotate',
|
|
198
|
-
iconStyle: 'theme',
|
|
199
|
-
value: 'provided-1',
|
|
200
|
-
},
|
|
201
|
-
},
|
|
202
|
-
{
|
|
203
|
-
variant: 'button',
|
|
204
|
-
buttonProps: {
|
|
205
|
-
variant: 'no-border',
|
|
206
|
-
icon: 'fc-trash',
|
|
207
|
-
iconStyle: 'theme',
|
|
208
|
-
value: 'provided-2',
|
|
209
|
-
},
|
|
210
|
-
},
|
|
211
|
-
{
|
|
212
|
-
variant: 'button',
|
|
213
|
-
buttonProps: {
|
|
214
|
-
variant: 'no-border',
|
|
215
|
-
icon: 'fc-formula-ai',
|
|
216
|
-
iconStyle: 'theme',
|
|
217
|
-
value: 'provided-3',
|
|
218
|
-
},
|
|
219
|
-
},
|
|
220
|
-
] }) }), _jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { onChange: (newValue) => setValue(newValue), buttons: [
|
|
221
|
-
{
|
|
222
|
-
variant: 'button',
|
|
223
|
-
buttonProps: {
|
|
224
|
-
variant: 'theme',
|
|
225
|
-
icon: 'fc-annotate',
|
|
226
|
-
iconStyle: 'white',
|
|
227
|
-
value: 'provided-1',
|
|
228
|
-
},
|
|
229
|
-
},
|
|
230
|
-
{
|
|
231
|
-
variant: 'button',
|
|
232
|
-
buttonProps: {
|
|
233
|
-
variant: 'theme',
|
|
234
|
-
icon: 'fc-trash',
|
|
235
|
-
iconStyle: 'white',
|
|
236
|
-
value: 'provided-2',
|
|
237
|
-
},
|
|
238
|
-
},
|
|
239
|
-
{
|
|
240
|
-
variant: 'button',
|
|
241
|
-
buttonProps: {
|
|
242
|
-
variant: 'theme',
|
|
243
|
-
icon: 'fc-formula-ai',
|
|
244
|
-
iconStyle: 'white',
|
|
245
|
-
value: 'provided-3',
|
|
246
|
-
},
|
|
247
|
-
},
|
|
248
|
-
] }) }), _jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { onChange: (newValue) => setValue(newValue), buttons: [
|
|
249
|
-
{
|
|
250
|
-
variant: 'button',
|
|
251
|
-
buttonProps: {
|
|
252
|
-
variant: 'theme',
|
|
253
|
-
label: 'annotate',
|
|
254
|
-
value: 'provided-1',
|
|
255
|
-
},
|
|
256
|
-
},
|
|
257
|
-
{
|
|
258
|
-
variant: 'button',
|
|
259
|
-
buttonProps: {
|
|
260
|
-
variant: 'theme',
|
|
261
|
-
label: 'trash',
|
|
262
|
-
value: 'provided-2',
|
|
263
|
-
},
|
|
264
|
-
},
|
|
265
|
-
{
|
|
266
|
-
variant: 'button',
|
|
267
|
-
buttonProps: {
|
|
268
|
-
variant: 'theme',
|
|
269
|
-
label: 'formula-ai',
|
|
270
|
-
value: 'provided-3',
|
|
271
|
-
},
|
|
272
|
-
},
|
|
273
|
-
] }) }), _jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { onChange: () => { }, buttons: [
|
|
274
|
-
{
|
|
275
|
-
variant: 'element',
|
|
276
|
-
element: (_jsx(ToolbarButton, { icon: "fc-y-axis", label: "Popover", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: _jsx("div", { className: "tw-text-sm dark:tw-text-white", children: _jsx("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2", children: "Flavors" }) }) })),
|
|
277
|
-
},
|
|
278
|
-
{
|
|
279
|
-
variant: 'element',
|
|
280
|
-
element: (_jsx(ToolbarButton, { icon: "fc-trash", label: "Trash", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: _jsx("div", { className: "tw-text-sm dark:tw-text-white", children: _jsx("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2", children: "Flavors" }) }) })),
|
|
281
|
-
},
|
|
282
|
-
{
|
|
283
|
-
variant: 'element',
|
|
284
|
-
element: (_jsx(ToolbarButton, { icon: "fc-formula-ai", label: "Formula", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: _jsx("div", { className: "tw-text-sm dark:tw-text-white", children: _jsx("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2", children: "Flavors" }) }) })),
|
|
285
|
-
},
|
|
286
|
-
] }) }), _jsx("div", { className: "tw-p-4", children: _jsx(ButtonGroup, { buttons: [
|
|
287
|
-
{
|
|
288
|
-
variant: 'button',
|
|
289
|
-
buttonProps: {
|
|
290
|
-
size: 'sm',
|
|
291
|
-
icon: 'fc-annotate',
|
|
292
|
-
value: 'left',
|
|
293
|
-
isActive: true,
|
|
294
|
-
},
|
|
295
|
-
},
|
|
296
|
-
{
|
|
297
|
-
variant: 'button',
|
|
298
|
-
buttonProps: {
|
|
299
|
-
size: 'sm',
|
|
300
|
-
icon: 'fc-trash',
|
|
301
|
-
value: 'center',
|
|
302
|
-
isActive: false,
|
|
303
|
-
},
|
|
304
|
-
},
|
|
305
|
-
{
|
|
306
|
-
variant: 'button',
|
|
307
|
-
buttonProps: {
|
|
308
|
-
size: 'sm',
|
|
309
|
-
icon: 'fc-formula-ai',
|
|
310
|
-
value: 'right',
|
|
311
|
-
isActive: false,
|
|
312
|
-
},
|
|
313
|
-
},
|
|
314
|
-
] }) })] })] }));
|
|
315
|
-
return (_jsxs("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4", children: [_jsx(QTip, {}), _jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderAllVariations()] })] }));
|
|
316
|
-
};
|
|
317
|
-
//# sourceMappingURL=ButtonGroup.stories.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonGroup.stories.js","sourceRoot":"","sources":["../../src/ButtonGroup/ButtonGroup.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,66 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { fireEvent, render } from '@testing-library/react';
|
|
3
|
-
import { ButtonGroup } from './ButtonGroup';
|
|
4
|
-
describe('ButtonGroup', () => {
|
|
5
|
-
const mockOnChange = jest.fn();
|
|
6
|
-
const defaultProps = {
|
|
7
|
-
id: 'test-id',
|
|
8
|
-
extraClassNames: 'extra-class',
|
|
9
|
-
testId: 'button-group',
|
|
10
|
-
onChange: mockOnChange,
|
|
11
|
-
buttons: [
|
|
12
|
-
{
|
|
13
|
-
variant: 'button',
|
|
14
|
-
buttonProps: {
|
|
15
|
-
testId: 'button1',
|
|
16
|
-
value: 'button1',
|
|
17
|
-
variant: 'outline',
|
|
18
|
-
extraClassNames: 'button-class',
|
|
19
|
-
isActive: true,
|
|
20
|
-
},
|
|
21
|
-
},
|
|
22
|
-
{
|
|
23
|
-
variant: 'button',
|
|
24
|
-
buttonProps: {
|
|
25
|
-
testId: 'button2',
|
|
26
|
-
value: 'button2',
|
|
27
|
-
variant: 'theme',
|
|
28
|
-
extraClassNames: 'button-class',
|
|
29
|
-
},
|
|
30
|
-
},
|
|
31
|
-
{
|
|
32
|
-
variant: 'element',
|
|
33
|
-
element: _jsx("span", { children: "Custom Element" }),
|
|
34
|
-
},
|
|
35
|
-
],
|
|
36
|
-
};
|
|
37
|
-
it('renders ButtonGroup with buttons and custom elements', () => {
|
|
38
|
-
const { getByTestId } = render(_jsx(ButtonGroup, { ...defaultProps }));
|
|
39
|
-
const buttonGroup = getByTestId('button-group');
|
|
40
|
-
expect(buttonGroup).toBeInTheDocument();
|
|
41
|
-
expect(buttonGroup).toHaveClass('tw-flex tw-outline-none tw-w-full tw-relative tw-flex-wrap extra-class');
|
|
42
|
-
const button1 = getByTestId('button1');
|
|
43
|
-
expect(button1).toBeInTheDocument();
|
|
44
|
-
expect(button1).toHaveClass('button-class');
|
|
45
|
-
const button2 = getByTestId('button2');
|
|
46
|
-
expect(button2).toBeInTheDocument();
|
|
47
|
-
expect(button2).toHaveClass('button-class');
|
|
48
|
-
});
|
|
49
|
-
it('calls onChange when a button is clicked', () => {
|
|
50
|
-
const { getByTestId } = render(_jsx(ButtonGroup, { ...defaultProps }));
|
|
51
|
-
const button1 = getByTestId('button1');
|
|
52
|
-
fireEvent.click(button1);
|
|
53
|
-
expect(mockOnChange).toHaveBeenCalledWith('button1');
|
|
54
|
-
const button2 = getByTestId('button2');
|
|
55
|
-
fireEvent.click(button2);
|
|
56
|
-
expect(mockOnChange).toHaveBeenCalledWith('button2');
|
|
57
|
-
});
|
|
58
|
-
it('applies active classes based on value and variant', () => {
|
|
59
|
-
const { getByTestId } = render(_jsx(ButtonGroup, { ...defaultProps }));
|
|
60
|
-
const button1 = getByTestId('button1');
|
|
61
|
-
expect(button1).toHaveClass('!tw-bg-sq-disabled-gray tw-border-sq-color-dark');
|
|
62
|
-
const button2 = getByTestId('button2');
|
|
63
|
-
expect(button2).not.toHaveClass('tw-bg-sq-color-highlight');
|
|
64
|
-
});
|
|
65
|
-
});
|
|
66
|
-
//# sourceMappingURL=ButtonGroup.test.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonGroup.test.js","sourceRoot":"","sources":["../../src/ButtonGroup/ButtonGroup.test.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,81 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { ButtonProps } from '../Button/Button.types';
|
|
3
|
-
import { TooltipComponentProps } from '../Tooltip/Tooltip.types';
|
|
4
|
-
/**
|
|
5
|
-
* Interface representing the properties for a button within a ButtonGroup.
|
|
6
|
-
* Used when you want to include an interactive button as part of the group.
|
|
7
|
-
*/
|
|
8
|
-
interface AppendedButtonProps {
|
|
9
|
-
/**
|
|
10
|
-
* Specifies that this group item is a clickable button.
|
|
11
|
-
* Button items can be selected, have active states, and trigger onChange events.
|
|
12
|
-
*/
|
|
13
|
-
variant: 'button';
|
|
14
|
-
/**
|
|
15
|
-
* Configuration properties for the button component.
|
|
16
|
-
* Omits the onClick handler since ButtonGroup manages selection internally.
|
|
17
|
-
* Requires a value for selection tracking and optionally an isActive state.
|
|
18
|
-
*/
|
|
19
|
-
buttonProps: Omit<ButtonProps, 'onClick'> & {
|
|
20
|
-
/** Unique value used to identify this button when selected */
|
|
21
|
-
value: string;
|
|
22
|
-
/** Whether this button is currently in the active/selected state */
|
|
23
|
-
isActive?: boolean;
|
|
24
|
-
};
|
|
25
|
-
}
|
|
26
|
-
/**
|
|
27
|
-
* Interface for including custom React elements within a ButtonGroup.
|
|
28
|
-
* Used when you need to add non-button content like separators, labels, or custom components.
|
|
29
|
-
*/
|
|
30
|
-
interface ElementProps {
|
|
31
|
-
/**
|
|
32
|
-
* Specifies that this group item is a custom React element.
|
|
33
|
-
* Element items are purely presentational and don't participate in selection logic.
|
|
34
|
-
*/
|
|
35
|
-
variant: 'element';
|
|
36
|
-
/**
|
|
37
|
-
* The React content to render within the button group.
|
|
38
|
-
* Can be any valid React node including text, icons, separators, or complex components.
|
|
39
|
-
*/
|
|
40
|
-
element: React.ReactNode;
|
|
41
|
-
/**
|
|
42
|
-
* Additional CSS classes to apply to the element's container.
|
|
43
|
-
* Use this to style the element consistently with the button group's appearance.
|
|
44
|
-
*/
|
|
45
|
-
extraClassNames?: string;
|
|
46
|
-
}
|
|
47
|
-
type Props = AppendedButtonProps | ElementProps | undefined;
|
|
48
|
-
/**
|
|
49
|
-
* Props for the ButtonGroup component that creates a cohesive group of related buttons.
|
|
50
|
-
* Extends TooltipComponentProps to support tooltip functionality on the entire group.
|
|
51
|
-
*/
|
|
52
|
-
export interface ButtonGroupProps extends TooltipComponentProps {
|
|
53
|
-
/**
|
|
54
|
-
* Array of items to display in the button group.
|
|
55
|
-
* Each item can be either a button (for interactive elements) or an element (for decorative content).
|
|
56
|
-
* Buttons within the group share consistent styling and spacing for a unified appearance.
|
|
57
|
-
*/
|
|
58
|
-
buttons: Props[];
|
|
59
|
-
/**
|
|
60
|
-
* HTML ID attribute for the button group container.
|
|
61
|
-
* Should be unique across the page for proper HTML semantics and accessibility.
|
|
62
|
-
*/
|
|
63
|
-
id?: string;
|
|
64
|
-
/**
|
|
65
|
-
* Additional CSS classes to apply to the button group container.
|
|
66
|
-
* Use this to customize the group's appearance, spacing, or layout beyond default styling.
|
|
67
|
-
*/
|
|
68
|
-
extraClassNames?: string;
|
|
69
|
-
/**
|
|
70
|
-
* Callback function triggered when a button within the group is selected.
|
|
71
|
-
* Receives the value of the selected button as defined in its buttonProps.value.
|
|
72
|
-
* Use this to handle selection changes and update your application state.
|
|
73
|
-
*/
|
|
74
|
-
onChange?: (value: string) => void;
|
|
75
|
-
/**
|
|
76
|
-
* Test ID attribute for the button group container used in automated testing.
|
|
77
|
-
* Applied to the group's root element for test targeting and interaction.
|
|
78
|
-
*/
|
|
79
|
-
testId?: string;
|
|
80
|
-
}
|
|
81
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonGroup.types.js","sourceRoot":"","sources":["../../src/ButtonGroup/ButtonGroup.types.ts"],"names":[],"mappings":""}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { ButtonGroup as default } from './ButtonGroup';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/ButtonGroup/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,IAAI,OAAO,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
|
|
3
|
-
import Icon from '../Icon';
|
|
4
|
-
import { getQTipData } from '../Tooltip/qTip.utilities';
|
|
5
|
-
const borderStyles = [
|
|
6
|
-
'tw-border-solid',
|
|
7
|
-
'tw-border',
|
|
8
|
-
'tw-rounded-popover',
|
|
9
|
-
'tw-border-sq-disabled-gray',
|
|
10
|
-
'dark:tw-border-gray-500',
|
|
11
|
-
].join(' ');
|
|
12
|
-
const bgStyles = ['tw-bg-sq-white', 'dark:tw-bg-sq-dark-background'].join(' ');
|
|
13
|
-
const disabledClasses = ['tw-opacity-50', 'tw-cursor-not-allowed'].join(' ');
|
|
14
|
-
const ButtonWithDropdown = ({ dropdownItems, triggerIcon, id, extraClassNames = '', contentExtraClassNames = '', containerTestId, disabled = false, align = 'end', placement = 'bottom', placementOffset = 5, alignOffset = -35, hasArrow = false, onOpenChange, isOpen, setFocusOnTriggerOnClose = true, keepFocusInsideDropdown = true, onContainerClick, ...tooltipProps }) => {
|
|
15
|
-
const tooltipData = getQTipData(tooltipProps);
|
|
16
|
-
return (_jsxs(DropdownMenu.Root, { defaultOpen: false, open: isOpen, onOpenChange: onOpenChange, modal: keepFocusInsideDropdown, children: [_jsx(DropdownMenu.Trigger, { id: id, className: `tw-border-none focus-visible:tw-outline-none focus:tw-outline-none focus-within:tw-outline-none`, disabled: disabled, children: _jsx("div", { ...tooltipData, className: `tw-bg-transparent tw-flex tw-flex-col tw-items-center focus-visible:tw-outline-none focus:tw-outline-none focus-within:tw-outline-none ${disabled ? disabledClasses : ''} ${extraClassNames}`, children: triggerIcon }) }), _jsx(DropdownMenu.Portal, { children: _jsx(DropdownMenu.Content, { onClick: onContainerClick, sideOffset: placementOffset, side: placement, align: align, alignOffset: alignOffset, asChild: true, onCloseAutoFocus: (e) => !setFocusOnTriggerOnClose && e.preventDefault(), className: "focus-visible:tw-outline-none tw-outline-none", children: _jsxs("div", { "data-testid": containerTestId, className: `${bgStyles} tw-relative tw-z-[1200] tw-min-w-6 tw-py-2 focus-visible:tw-outline-none tw-outline-none data-[state=open]:tw-animate-in data-[state=closed]:tw-animate-out forceFont data-[side=top]:tw-animate-slideDownAndFade data-[side=right]:tw-animate-slideLeftAndFade data-[side=bottom]:tw-animate-slideUpAndFade data-[side=left]:tw-animate-slideRightAndFade ${borderStyles} ${contentExtraClassNames}`, children: [hasArrow && (_jsx(DropdownMenu.Arrow, { asChild: true, children: _jsx("div", { className: " tw-fill-transparent tw-bg-white tw-w-[15px] tw-h-[15px] tw-rotate-45 dark:tw-bg-sq-dark-background tw-border-b tw-border-r tw-border-sq-disabled-gray dark:tw-border-gray-500 tw-mt-[-7px]" }) })), dropdownItems.map((item, index) => {
|
|
17
|
-
const tooltipData = getQTipData(item);
|
|
18
|
-
if (item.isLabel) {
|
|
19
|
-
return (_jsxs(DropdownMenu.Label, { className: item.itemExtraClassNames, ...tooltipData, children: [item.icon && (_jsx(Icon, { icon: item.icon, testId: item.iconTestId, type: "text", color: item.iconColor, extraClassNames: "tw-text-sq-text-color dark:tw-text-sq-white tw-w-[18px]" })), _jsx("div", { "data-testid": item.labelTestId, className: `tw-text-[0.8125rem] tw-ml-1 ${item.disabled ? 'tw-text-sq-disabled-gray' : 'tw-text-sq-text-color dark:tw-text-sq-white'} tw-not-italic tw-font-normal ${item.labelClasses}`, children: item.label })] }, (item.id || '') + index));
|
|
20
|
-
}
|
|
21
|
-
if (Array.isArray(item.subMenuItems) && item.subMenuItems.length > 0) {
|
|
22
|
-
return (_jsxs(DropdownMenu.Sub, { children: [_jsxs(DropdownMenu.SubTrigger, { id: id, className: `tw-cursor-pointer tw-flex tw-justify-between dark:tw-text-sq-white hover:tw-bg-sq-gray-highlight dark:hover:tw-bg-sq-gray-highlight-dark tw-leading-none tw-items-center tw-h-[27px] tw-pl-[19px] tw-relative tw-select-none tw-outline-none data-[disabled]:tw-pointer-events-none ${item.itemExtraClassNames || ''}`, "data-testid": item.testId, disabled: item.disabled, ...tooltipData, children: [_jsxs("div", { className: "tw-flex", children: [item.icon && (_jsx(Icon, { icon: item.icon, extraClassNames: `tw-w-[18px] ${item.disabled
|
|
23
|
-
? '!tw-text-sq-disabled-gray'
|
|
24
|
-
: 'tw-text-sq-text-color dark:tw-text-sq-white'} ${item.iconExtraClassNames || ''}` })), _jsx("div", { "data-testid": item.labelTestId, "data-customid": item.labelCustomId, className: `tw-text-[0.8125rem] tw-ml-1 ${item.disabled && '!tw-opacity-30'} tw-not-italic tw-font-semibold ${item.labelClasses}`, children: item.label })] }), _jsx(Icon, { small: true, icon: "fc-arrow-dropdown -tw-rotate-90", extraClassNames: `${item.disabled ? 'tw-text-sq-disabled-gray' : 'tw-text-sq-text-color dark:tw-text-sq-white'} tw-w-[18px] tw-ml-4 tw-text-[0.5rem] tw-justify-center tw-flex` })] }), _jsx(DropdownMenu.Portal, { children: _jsx(DropdownMenu.SubContent, { className: "focus-visible:tw-outline-none tw-outline-none", children: _jsx("div", { "data-testid": containerTestId, className: `${bgStyles} tw-relative tw-z-[1000] tw-min-w-6 tw-py-2 focus-visible:tw-outline-none tw-outline-none data-[state=open]:tw-animate-in data-[state=closed]:tw-animate-out forceFont data-[side=top]:tw-animate-slideDownAndFade data-[side=right]:tw-animate-slideLeftAndFade data-[side=bottom]:tw-animate-slideUpAndFade data-[side=left]:tw-animate-slideRightAndFade ${borderStyles}`, children: item.subMenuItems.map((subItem, subIndex) => {
|
|
25
|
-
return (_jsxs(DropdownMenu.Item, { onSelect: subItem.onClick, "data-qtip-text": subItem.tooltip, className: "tw-cursor-pointer tw-flex dark:tw-text-sq-white hover:tw-bg-sq-gray-highlight dark:hover:tw-bg-sq-gray-highlight-dark tw-leading-none tw-items-center tw-h-[27px] tw-px-[19px] tw-relative tw-select-none tw-outline-none data-[disabled]:tw-pointer-events-none", disabled: subItem.disabled, children: [subItem.iconClass && (_jsx(Icon, { icon: subItem.iconClass, type: "text", extraClassNames: `tw-w-[18px] ${item.disabled && '!tw-opacity-30'}` })), _jsx("div", { className: `tw-text-[0.8125rem] tw-ml-1 ${subItem.disabled
|
|
26
|
-
? 'tw-text-sq-disabled-gray'
|
|
27
|
-
: 'tw-text-sq-text-color dark:tw-text-sq-white'} tw-not-italic tw-font-normal ${item.labelClasses}`, children: subItem.label })] }, subItem.label + subIndex));
|
|
28
|
-
}) }) }) })] }, (item.id || item.icon || '') + index));
|
|
29
|
-
}
|
|
30
|
-
return (_jsxs("div", { ...tooltipData, children: [_jsxs(DropdownMenu.Item, { "data-customid": item.itemCustomId, onSelect: (e) => {
|
|
31
|
-
item.onClick(e);
|
|
32
|
-
}, className: `tw-cursor-pointer tw-flex dark:tw-text-sq-white hover:tw-bg-sq-gray-highlight dark:hover:tw-bg-sq-gray-highlight-dark tw-leading-none tw-items-center tw-min-h-[27px] tw-px-[19px] tw-relative tw-select-none tw-outline-none data-[disabled]:tw-pointer-events-none ${item.itemExtraClassNames || ''}`, "data-testid": item.testId, disabled: item.disabled, children: [item.icon && (_jsx(Icon, { icon: item.icon, testId: item.iconTestId, type: (item.iconType || 'text'), color: item.iconColor, customId: item.iconCustomId, extraClassNames: `tw-w-[18px] ${item.disabled && '!tw-opacity-30'} ${item.iconExtraClassNames || ''}` })), _jsx("div", { "data-testid": item.labelTestId, "data-customid": item.labelCustomId, className: `tw-text-[0.8125rem] tw-ml-1 ${item.disabled ? 'tw-text-sq-disabled-gray' : 'tw-text-sq-text-color dark:tw-text-sq-white'} tw-not-italic tw-font-normal ${item.labelClasses || ''}`, children: item.label })] }, (item.id || item.icon || '') + index), item.hasDivider && (_jsx(DropdownMenu.Separator, { "data-testid": `dropdown-divider-${index}`, className: "tw-h-[1px] tw-bg-sq-disabled-gray dark:tw-bg-gray-500 tw-my-[8px]" }))] }, (item.id || '') + index));
|
|
33
|
-
})] }) }) })] }));
|
|
34
|
-
};
|
|
35
|
-
export default ButtonWithDropdown;
|
|
36
|
-
//# sourceMappingURL=ButtonWithDropdown.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonWithDropdown.js","sourceRoot":"","sources":["../../src/ButtonWithDropdown/ButtonWithDropdown.tsx"],"names":[],"mappings":"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"}
|