@seeqdev/qomponents 0.0.155-react-19-v8 → 0.0.155-react-19-v10

package/dist/Button/Button.test.js

@@ -0,0 +1,49 @@
+import React from 'react';
+import '@testing-library/jest-dom';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import Button from './Button';
+describe('Button', () => {
+    class Context {
+        testId = 'buttonTestId';
+        label = 'button label';
+        props = {
+            label: this.label,
+            onClick: jest.fn(),
+            testId: this.testId,
+        };
+    }
+    let tc;
+    beforeEach(() => {
+        tc = new Context();
+    });
+    const renderButton = (props) => render(React.createElement(Button, { ...props }));
+    it('renders button label', () => {
+        renderButton(tc.props);
+        expect(screen.getByText(tc.label)).toBeInTheDocument();
+    });
+    it('calls on click', async () => {
+        renderButton(tc.props);
+        await userEvent.click(screen.getByTestId(tc.testId));
+        expect(tc.props.onClick).toHaveBeenCalled();
+    });
+    it('renders disabled button', () => {
+        renderButton({ ...tc.props, disabled: true });
+        expect(screen.getByText(tc.label)).toBeDisabled();
+    });
+    it('respects stopPropagation default', async () => {
+        const callOnPropagation = jest.fn();
+        render(React.createElement("div", { onClick: callOnPropagation },
+            React.createElement(Button, { ...tc.props })));
+        await userEvent.click(screen.getByTestId(tc.testId));
+        expect(callOnPropagation).not.toHaveBeenCalled();
+    });
+    it('propagates click event if not told not to', async () => {
+        const callOnPropagation = jest.fn();
+        render(React.createElement("div", { onClick: callOnPropagation },
+            React.createElement(Button, { ...{ ...tc.props, stopPropagation: false } })));
+        await userEvent.click(screen.getByTestId(tc.testId));
+        expect(callOnPropagation).toHaveBeenCalled();
+    });
+});
+//# sourceMappingURL=Button.test.js.map

package/dist/Button/Button.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.test.js","sourceRoot":"","sources":["../../src/Button/Button.test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,SAAS,MAAM,6BAA6B,CAAC;AAEpD,OAAO,MAAM,MAAM,UAAU,CAAC;AAG9B,QAAQ,CAAC,QAAQ,EAAE,GAAG,EAAE;IACtB,MAAM,OAAO;QACX,MAAM,GAAG,cAAc,CAAC;QACxB,KAAK,GAAG,cAAc,CAAC;QACvB,KAAK,GAAgB;YACnB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE;YAClB,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC;KACH;IAED,IAAI,EAAW,CAAC;IAChB,UAAU,CAAC,GAAG,EAAE;QACd,EAAE,GAAG,IAAI,OAAO,EAAE,CAAC;IACrB,CAAC,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,MAAM,CAAC,oBAAC,MAAM,OAAK,KAAK,GAAI,CAAC,CAAC;IAE3E,EAAE,CAAC,sBAAsB,EAAE,GAAG,EAAE;QAC9B,YAAY,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QACvB,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IACzD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gBAAgB,EAAE,KAAK,IAAI,EAAE;QAC9B,YAAY,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QACvB,MAAM,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;QACrD,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,gBAAgB,EAAE,CAAC;IAC9C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yBAAyB,EAAE,GAAG,EAAE;QACjC,YAAY,CAAC,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;QAC9C,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,EAAE,CAAC;IACpD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,iBAAiB,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QACpC,MAAM,CACJ,6BAAK,OAAO,EAAE,iBAAiB;YAC7B,oBAAC,MAAM,OAAK,EAAE,CAAC,KAAK,GAAI,CACpB,CACP,CAAC;QACF,MAAM,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;QACrD,MAAM,CAAC,iBAAiB,CAAC,CAAC,GAAG,CAAC,gBAAgB,EAAE,CAAC;IACnD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2CAA2C,EAAE,KAAK,IAAI,EAAE;QACzD,MAAM,iBAAiB,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QACpC,MAAM,CACJ,6BAAK,OAAO,EAAE,iBAAiB;YAC7B,oBAAC,MAAM,OAAK,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,eAAe,EAAE,KAAK,EAAE,GAAI,CACnD,CACP,CAAC;QACF,MAAM,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;QACrD,MAAM,CAAC,iBAAiB,CAAC,CAAC,gBAAgB,EAAE,CAAC;IAC/C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/Button/Button.types.js

@@ -0,0 +1,5 @@
+export const buttonTypes = ['button', 'reset', 'submit', 'link'];
+export const buttonSizes = ['sm', 'lg'];
+export const buttonVariants = ['outline', 'theme', 'theme-light', 'warning', 'danger', 'no-border'];
+export const iconPositions = ['left', 'right'];
+//# sourceMappingURL=Button.types.js.map

package/dist/Button/Button.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.types.js","sourceRoot":"","sources":["../../src/Button/Button.types.ts"],"names":[],"mappings":"AAIA,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,CAAU,CAAC;AAC1E,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,CAAU,CAAC;AACjD,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,SAAS,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,CAAU,CAAC;AAC7G,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC"}

package/dist/Button/index.js

@@ -0,0 +1,2 @@
+export { default } from "./Button";
+//# sourceMappingURL=index.js.map

package/dist/Button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC"}

package/dist/ButtonGroup/ButtonGroup.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import '../styles.css';
+import { getQTipData } from '../Tooltip/qTip.utilities';
+import Button from '../Button';
+const baseClasses = 'tw-flex tw-outline-none tw-w-full tw-relative tw-flex-wrap';
+const activeClassesByVariantLightTheme = {
+    'outline': '!tw-bg-sq-disabled-gray tw-border-sq-color-dark',
+    'theme': 'tw-bg-sq-color-highlight',
+    'danger': '',
+    'theme-light': '',
+    'no-border': '!tw-bg-sq-disabled-gray',
+    'warning': '',
+};
+const activeClassesByVariantDarkTheme = {
+    'outline': 'dark:!tw-bg-sq-multi-gray-dark dark:tw-border-sq-color-dark',
+    'theme': 'dark:tw-bg-sq-color-highlight',
+    'danger': '',
+    'theme-light': '',
+    'no-border': 'dark:!tw-bg-sq-multi-gray-dark',
+    'warning': '',
+};
+/**
+ * ButtonGroup.
+ */
+export const ButtonGroup = (props) => {
+    const { id, extraClassNames, testId, onChange, buttons = [], ...tooltipProps } = props;
+    const tooltipData = getQTipData(tooltipProps);
+    const appliedClasses = `${baseClasses} ${extraClassNames}`;
+    return (React.createElement("div", { id: id ? `button-group-${id}` : undefined, "data-testid": testId, className: appliedClasses, ...tooltipData }, buttons
+        .filter(Boolean)
+        .map((item, index) => item?.variant === 'button' ? (React.createElement(Button, { key: index, ...item.buttonProps, extraClassNames: `tw-ml-[-1px] focus:tw-z-40 tw-outline-none focus:tw-border tw-rounded-none first:tw-rounded-l-md last:tw-rounded-r-md ${item.buttonProps?.isActive
+            ? `${activeClassesByVariantLightTheme[item?.buttonProps?.variant ?? 'outline']} ${activeClassesByVariantDarkTheme[item?.buttonProps?.variant ?? 'outline']} `
+            : ''} ${item.buttonProps.extraClassNames}`, onClick: () => onChange && onChange(item?.buttonProps?.value) })) : (item?.element))));
+};
+//# sourceMappingURL=ButtonGroup.js.map

package/dist/ButtonGroup/ButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroup.js","sourceRoot":"","sources":["../../src/ButtonGroup/ButtonGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,eAAe,CAAC;AACvB,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,MAAM,MAAM,WAAW,CAAC;AAG/B,MAAM,WAAW,GAAG,4DAA4D,CAAC;AAEjF,MAAM,gCAAgC,GAAG;IACvC,SAAS,EAAE,iDAAiD;IAC5D,OAAO,EAAE,0BAA0B;IACnC,QAAQ,EAAE,EAAE;IACZ,aAAa,EAAE,EAAE;IACjB,WAAW,EAAE,yBAAyB;IACtC,SAAS,EAAE,EAAE;CACd,CAAC;AAEF,MAAM,+BAA+B,GAAG;IACtC,SAAS,EAAE,6DAA6D;IACxE,OAAO,EAAE,+BAA+B;IACxC,QAAQ,EAAE,EAAE;IACZ,aAAa,EAAE,EAAE;IACjB,WAAW,EAAE,gCAAgC;IAC7C,SAAS,EAAE,EAAE;CACd,CAAC;AACF;;GAEG;AACH,MAAM,CAAC,MAAM,WAAW,GAA8C,CAAC,KAAK,EAAE,EAAE;IAC9E,MAAM,EAAE,EAAE,EAAE,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,EAAE,EAAE,GAAG,YAAY,EAAE,GAAG,KAAK,CAAC;IACvF,MAAM,WAAW,GAAG,WAAW,CAAC,YAAY,CAAC,CAAC;IAE9C,MAAM,cAAc,GAAG,GAAG,WAAW,IAAI,eAAe,EAAE,CAAC;IAE3D,OAAO,CACL,6BAAK,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,iBAAe,MAAM,EAAE,SAAS,EAAE,cAAc,KAAM,WAAW,IAC5G,OAAO;SACL,MAAM,CAAC,OAAO,CAAC;SACf,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CACnB,IAAI,EAAE,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC3B,oBAAC,MAAM,IACL,GAAG,EAAE,KAAK,KACN,IAAI,CAAC,WAAW,EACpB,eAAe,EAAE,yHACf,IAAI,CAAC,WAAW,EAAE,QAAQ;YACxB,CAAC,CAAC,GAAG,gCAAgC,CAAC,IAAI,EAAE,WAAW,EAAE,OAAO,IAAI,SAAS,CAAC,IAC1E,+BAA+B,CAAC,IAAI,EAAE,WAAW,EAAE,OAAO,IAAI,SAAS,CACzE,GAAG;YACL,CAAC,CAAC,EACN,IAAI,IAAI,CAAC,WAAW,CAAC,eAAe,EAAE,EACtC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,IAAI,QAAQ,CAAC,IAAI,EAAE,WAAW,EAAE,KAAK,CAAC,GAC7D,CACH,CAAC,CAAC,CAAC,CACF,IAAI,EAAE,OAAO,CACd,CACF,CACC,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/ButtonGroup/ButtonGroup.stories.js

@@ -0,0 +1,385 @@
+import React from 'react';
+import { QTip } from '../Tooltip/Qtip';
+import { ButtonGroup } from './ButtonGroup';
+import ToolbarButton from '../ToolbarButton';
+export default {
+    title: 'ButtonGroup',
+};
+export const AllButtonGroups = () => {
+    const [value, setValue] = React.useState('provided-1');
+    const renderAllVariations = () => (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "light" },
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { onChange: () => { }, buttons: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'outline',
+                                icon: 'fc-annotate',
+                                iconStyle: 'theme',
+                                value: 'provided-1',
+                                onClick: () => setValue('provided-1'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'outline',
+                                icon: 'fc-trash',
+                                iconStyle: 'theme',
+                                value: 'provided-2',
+                                onClick: () => setValue('provided-2'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'outline',
+                                icon: 'fc-formula-ai',
+                                iconStyle: 'theme',
+                                value: 'provided-3',
+                                onClick: () => setValue('provided-3'),
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { onChange: () => { }, buttons: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'outline',
+                                icon: 'fc-annotate',
+                                extraClassNames: 'tw-border-none',
+                                iconStyle: 'theme',
+                                value: 'provided-1',
+                                onClick: () => setValue('provided-1'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'outline',
+                                icon: 'fc-trash',
+                                extraClassNames: 'tw-border-none',
+                                iconStyle: 'theme',
+                                value: 'provided-2',
+                                onClick: () => setValue('provided-2'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'outline',
+                                extraClassNames: 'tw-border-none',
+                                icon: 'fc-formula-ai',
+                                iconStyle: 'theme',
+                                value: 'provided-3',
+                                onClick: () => setValue('provided-3'),
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { onChange: () => { }, buttons: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                icon: 'fc-annotate',
+                                iconStyle: 'white',
+                                value: 'provided-1',
+                                onClick: () => setValue('provided-1'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                icon: 'fc-trash',
+                                iconStyle: 'white',
+                                value: 'provided-2',
+                                onClick: () => setValue('provided-2'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                icon: 'fc-formula-ai',
+                                iconStyle: 'white',
+                                value: 'provided-3',
+                                onClick: () => setValue('provided-3'),
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { onChange: () => { }, buttons: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                label: 'annotate',
+                                value: 'provided-1',
+                                onClick: () => setValue('provided-1'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                label: 'trash',
+                                value: 'provided-2',
+                                onClick: () => setValue('provided-2'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                label: 'formula-ai',
+                                value: 'provided-3',
+                                onClick: () => setValue('provided-3'),
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { onChange: () => { }, buttons: [
+                        {
+                            variant: 'element',
+                            element: (React.createElement(ToolbarButton, { icon: "fc-y-axis", label: "Popover", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: React.createElement("div", { className: "tw-text-sm dark:tw-text-white" },
+                                    React.createElement("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2" }, "Flavors")) })),
+                        },
+                        {
+                            variant: 'element',
+                            element: (React.createElement(ToolbarButton, { icon: "fc-trash", label: "Trash", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: React.createElement("div", { className: "tw-text-sm dark:tw-text-white" },
+                                    React.createElement("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2" }, "Flavors")) })),
+                        },
+                        {
+                            variant: 'element',
+                            element: (React.createElement(ToolbarButton, { icon: "fc-formula-ai", label: "Formula", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: React.createElement("div", { className: "tw-text-sm dark:tw-text-white" },
+                                    React.createElement("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2" }, "Flavors")) })),
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { buttons: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                size: 'sm',
+                                icon: 'fc-annotate',
+                                value: 'left',
+                                isActive: true,
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                size: 'sm',
+                                icon: 'fc-trash',
+                                value: 'center',
+                                isActive: false,
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                size: 'sm',
+                                icon: 'fc-formula-ai',
+                                value: 'right',
+                                isActive: false,
+                            },
+                        },
+                    ] }))),
+        React.createElement("div", { className: "tw-dark tw-bg-sq-dark-background" },
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { onChange: () => { }, buttons: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'outline',
+                                icon: 'fc-annotate',
+                                iconStyle: 'theme',
+                                value: 'provided-1',
+                                onClick: () => setValue('provided-1'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'outline',
+                                icon: 'fc-trash',
+                                iconStyle: 'theme',
+                                value: 'provided-2',
+                                onClick: () => setValue('provided-2'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'outline',
+                                icon: 'fc-formula-ai',
+                                iconStyle: 'theme',
+                                value: 'provided-3',
+                                onClick: () => setValue('provided-3'),
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { onChange: () => { }, buttons: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'no-border',
+                                icon: 'fc-annotate',
+                                iconStyle: 'theme',
+                                value: 'provided-1',
+                                onClick: () => setValue('provided-1'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'no-border',
+                                icon: 'fc-trash',
+                                iconStyle: 'theme',
+                                value: 'provided-2',
+                                onClick: () => setValue('provided-2'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'no-border',
+                                icon: 'fc-formula-ai',
+                                iconStyle: 'theme',
+                                value: 'provided-3',
+                                onClick: () => setValue('provided-3'),
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { onChange: () => { }, buttons: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                icon: 'fc-annotate',
+                                iconStyle: 'white',
+                                value: 'provided-1',
+                                onClick: () => setValue('provided-1'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                icon: 'fc-trash',
+                                iconStyle: 'white',
+                                value: 'provided-2',
+                                onClick: () => setValue('provided-2'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                icon: 'fc-formula-ai',
+                                iconStyle: 'white',
+                                value: 'provided-3',
+                                onClick: () => setValue('provided-3'),
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { onChange: () => { }, buttons: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                label: 'annotate',
+                                value: 'provided-1',
+                                onClick: () => setValue('provided-1'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                label: 'trash',
+                                value: 'provided-2',
+                                onClick: () => setValue('provided-2'),
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                variant: 'theme',
+                                label: 'formula-ai',
+                                value: 'provided-3',
+                                onClick: () => setValue('provided-3'),
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { onChange: () => { }, buttons: [
+                        {
+                            variant: 'element',
+                            element: (React.createElement(ToolbarButton, { icon: "fc-y-axis", label: "Popover", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: React.createElement("div", { className: "tw-text-sm dark:tw-text-white" },
+                                    React.createElement("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2" }, "Flavors")) })),
+                        },
+                        {
+                            variant: 'element',
+                            element: (React.createElement(ToolbarButton, { icon: "fc-trash", label: "Trash", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: React.createElement("div", { className: "tw-text-sm dark:tw-text-white" },
+                                    React.createElement("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2" }, "Flavors")) })),
+                        },
+                        {
+                            variant: 'element',
+                            element: (React.createElement(ToolbarButton, { icon: "fc-formula-ai", label: "Formula", testId: "basic-popover1", tooltipText: "This is a small popover.", tooltipOptions: { position: 'top', delay: 0 }, isHtmlTooltip: false, popoverContent: React.createElement("div", { className: "tw-text-sm dark:tw-text-white" },
+                                    React.createElement("p", { className: "tw-bg-gray-200 dark:tw-bg-gray-700 tw-p-2" }, "Flavors")) })),
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(ButtonGroup, { buttons: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                size: 'sm',
+                                icon: 'fc-annotate',
+                                value: 'left',
+                                isActive: true,
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                size: 'sm',
+                                icon: 'fc-trash',
+                                value: 'center',
+                                isActive: false,
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                size: 'sm',
+                                icon: 'fc-formula-ai',
+                                value: 'right',
+                                isActive: false,
+                            },
+                        },
+                    ] })))));
+    return (React.createElement("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4" },
+        React.createElement(QTip, null),
+        React.createElement("div", { className: "color_topic" },
+            React.createElement("b", null, "Topic Colors"),
+            renderAllVariations()),
+        React.createElement("div", { className: "color_analysis" },
+            React.createElement("b", null, "Analysis Colors"),
+            renderAllVariations()),
+        React.createElement("div", { className: "color_datalab" },
+            React.createElement("b", null, "Datalab Colors"),
+            renderAllVariations()),
+        React.createElement("div", { className: "color_vantage" },
+            React.createElement("b", null, "Vantage Colors"),
+            renderAllVariations())));
+};
+//# sourceMappingURL=ButtonGroup.stories.js.map

package/dist/ButtonGroup/ButtonGroup.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroup.stories.js","sourceRoot":"","sources":["../../src/ButtonGroup/ButtonGroup.stories.tsx"],"names":[],"mappings":"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"}

package/dist/ButtonGroup/ButtonGroup.test.js

@@ -0,0 +1,67 @@
+import React from 'react';
+import { fireEvent, render } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import { ButtonGroup } from './ButtonGroup';
+describe('ButtonGroup', () => {
+    const mockOnChange = jest.fn();
+    const defaultProps = {
+        id: 'test-id',
+        extraClassNames: 'extra-class',
+        testId: 'button-group',
+        onChange: mockOnChange,
+        buttons: [
+            {
+                variant: 'button',
+                buttonProps: {
+                    testId: 'button1',
+                    value: 'button1',
+                    variant: 'outline',
+                    extraClassNames: 'button-class',
+                    isActive: true,
+                },
+            },
+            {
+                variant: 'button',
+                buttonProps: {
+                    testId: 'button2',
+                    value: 'button2',
+                    variant: 'theme',
+                    extraClassNames: 'button-class',
+                },
+            },
+            {
+                variant: 'element',
+                element: React.createElement("span", null, "Custom Element"),
+            },
+        ],
+    };
+    it('renders ButtonGroup with buttons and custom elements', () => {
+        const { getByTestId } = render(React.createElement(ButtonGroup, { ...defaultProps }));
+        const buttonGroup = getByTestId('button-group');
+        expect(buttonGroup).toBeInTheDocument();
+        expect(buttonGroup).toHaveClass('tw-flex tw-outline-none tw-w-full tw-relative tw-flex-wrap extra-class');
+        const button1 = getByTestId('button1');
+        expect(button1).toBeInTheDocument();
+        expect(button1).toHaveClass('button-class');
+        const button2 = getByTestId('button2');
+        expect(button2).toBeInTheDocument();
+        expect(button2).toHaveClass('button-class');
+    });
+    it('calls onChange when a button is clicked', () => {
+        const { getByTestId } = render(React.createElement(ButtonGroup, { ...defaultProps }));
+        const button1 = getByTestId('button1');
+        fireEvent.click(button1);
+        expect(mockOnChange).toHaveBeenCalledWith('button1');
+        const button2 = getByTestId('button2');
+        fireEvent.click(button2);
+        expect(mockOnChange).toHaveBeenCalledWith('button2');
+    });
+    it('applies active classes based on value and variant', () => {
+        const { getByTestId } = render(React.createElement(ButtonGroup, { ...defaultProps }));
+        const button1 = getByTestId('button1');
+        expect(button1).toHaveClass('!tw-bg-sq-disabled-gray tw-border-sq-color-dark');
+        const button2 = getByTestId('button2');
+        expect(button2).not.toHaveClass('tw-bg-sq-color-highlight');
+    });
+});
+//# sourceMappingURL=ButtonGroup.test.js.map

package/dist/ButtonGroup/ButtonGroup.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroup.test.js","sourceRoot":"","sources":["../../src/ButtonGroup/ButtonGroup.test.tsx"],"names":[],"mappings":"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"}

package/dist/ButtonGroup/ButtonGroup.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=ButtonGroup.types.js.map

package/dist/ButtonGroup/ButtonGroup.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroup.types.js","sourceRoot":"","sources":["../../src/ButtonGroup/ButtonGroup.types.ts"],"names":[],"mappings":""}

package/dist/ButtonGroup/index.js

@@ -0,0 +1,2 @@
+export { ButtonGroup as default } from './ButtonGroup';
+//# sourceMappingURL=index.js.map

package/dist/ButtonGroup/index.js.map

@@ -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"}