@seeqdev/qomponents 0.0.132 → 0.0.134

package/dist/InputGroup/InputGroup.stories.js

@@ -1,168 +1,168 @@
-import React from 'react';
-import { InputGroup } from './InputGroup';
-import { QTip } from '../Tooltip/Qtip';
-export default {
-    title: 'InputGroup',
-};
-export const AllTextFields = () => {
-    const renderAllVariations = () => (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: "light" },
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { value: "value provided", append: [
-                        {
-                            variant: 'button',
-                            buttonProps: {
-                                icon: 'fc-annotate',
-                                iconStyle: 'theme',
-                            },
-                        },
-                        {
-                            variant: 'button',
-                            buttonProps: {
-                                icon: 'fc-trash',
-                                iconStyle: 'theme',
-                            },
-                        },
-                    ] })),
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
-                        {
-                            variant: 'button',
-                            buttonProps: {
-                                icon: 'fc-annotate',
-                                iconStyle: 'theme',
-                            },
-                        },
-                        {
-                            variant: 'button',
-                            buttonProps: {
-                                icon: 'fc-trash',
-                                iconStyle: 'theme',
-                            },
-                        },
-                    ] })),
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
-                        {
-                            variant: 'button',
-                            buttonProps: {
-                                icon: 'fc-annotate',
-                                iconStyle: 'theme',
-                            },
-                        },
-                    ] })),
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with custom element", append: [
-                        {
-                            variant: 'element',
-                            element: React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background" }, "Custom"),
-                        },
-                    ] })),
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "button input group", field: React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background", onClick: () => console.log('clicked') }, "custom grouped element"), append: [
-                        {
-                            variant: 'element',
-                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Custom")),
-                        },
-                    ] })),
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, field: React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background" },
-                        React.createElement("div", { className: "tw-rounded-sm tw-bg-green-400 " }, "Custom element 1"),
-                        React.createElement("div", { className: "tw-rounded-sm tw-bg-red-400 tw-mt-1", onClick: () => console.log('clicked') }, "Custom element 2")), append: [
-                        {
-                            variant: 'element',
-                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Edit")),
-                        },
-                        {
-                            variant: 'element',
-                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Delete")),
-                        },
-                    ] }))),
-        React.createElement("div", { className: "tw-dark tw-bg-sq-dark-background" },
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { value: "value provided", append: [
-                        {
-                            variant: 'button',
-                            buttonProps: {
-                                icon: 'fc-annotate',
-                                iconStyle: 'theme',
-                            },
-                        },
-                        {
-                            variant: 'button',
-                            buttonProps: {
-                                icon: 'fc-trash',
-                                iconStyle: 'theme',
-                            },
-                        },
-                    ] })),
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
-                        {
-                            variant: 'button',
-                            buttonProps: {
-                                icon: 'fc-annotate',
-                                iconStyle: 'theme',
-                            },
-                        },
-                        {
-                            variant: 'button',
-                            buttonProps: {
-                                icon: 'fc-trash',
-                                iconStyle: 'theme',
-                            },
-                        },
-                    ] })),
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
-                        {
-                            variant: 'button',
-                            buttonProps: {
-                                icon: 'fc-annotate',
-                                iconStyle: 'theme',
-                            },
-                        },
-                    ] })),
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with custom element", append: [
-                        {
-                            variant: 'element',
-                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Custom")),
-                        },
-                    ] })),
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "button input group", field: React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text", onClick: () => console.log('clicked') }, "custom grouped element"), append: [
-                        {
-                            variant: 'element',
-                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Custom")),
-                        },
-                    ] })),
-            React.createElement("div", { className: "tw-p-4" },
-                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, field: React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background" },
-                        React.createElement("div", { className: "tw-rounded-sm tw-bg-green-400 dark:tw-text-sq-dark-text" }, "Custom element 1"),
-                        React.createElement("div", { className: "tw-rounded-sm tw-bg-red-400 dark:tw-text-sq-dark-text tw-mt-1", onClick: () => console.log('clicked') }, "Custom element 2")), append: [
-                        {
-                            variant: 'element',
-                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Edit")),
-                        },
-                        {
-                            variant: 'element',
-                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Delete")),
-                        },
-                    ] })))));
-    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())));
-};
+import React from 'react';
+import { InputGroup } from './InputGroup';
+import { QTip } from '../Tooltip/Qtip';
+export default {
+    title: 'InputGroup',
+};
+export const AllTextFields = () => {
+    const renderAllVariations = () => (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "light" },
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { value: "value provided", append: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                icon: 'fc-annotate',
+                                iconStyle: 'theme',
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                icon: 'fc-trash',
+                                iconStyle: 'theme',
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                icon: 'fc-annotate',
+                                iconStyle: 'theme',
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                icon: 'fc-trash',
+                                iconStyle: 'theme',
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                icon: 'fc-annotate',
+                                iconStyle: 'theme',
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with custom element", append: [
+                        {
+                            variant: 'element',
+                            element: React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background" }, "Custom"),
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "button input group", field: React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background", onClick: () => console.log('clicked') }, "custom grouped element"), append: [
+                        {
+                            variant: 'element',
+                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Custom")),
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, field: React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background" },
+                        React.createElement("div", { className: "tw-rounded-sm tw-bg-green-400 " }, "Custom element 1"),
+                        React.createElement("div", { className: "tw-rounded-sm tw-bg-red-400 tw-mt-1", onClick: () => console.log('clicked') }, "Custom element 2")), append: [
+                        {
+                            variant: 'element',
+                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Edit")),
+                        },
+                        {
+                            variant: 'element',
+                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Delete")),
+                        },
+                    ] }))),
+        React.createElement("div", { className: "tw-dark tw-bg-sq-dark-background" },
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { value: "value provided", append: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                icon: 'fc-annotate',
+                                iconStyle: 'theme',
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                icon: 'fc-trash',
+                                iconStyle: 'theme',
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                icon: 'fc-annotate',
+                                iconStyle: 'theme',
+                            },
+                        },
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                icon: 'fc-trash',
+                                iconStyle: 'theme',
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with tooltip", append: [
+                        {
+                            variant: 'button',
+                            buttonProps: {
+                                icon: 'fc-annotate',
+                                iconStyle: 'theme',
+                            },
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "with custom element", append: [
+                        {
+                            variant: 'element',
+                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Custom")),
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, value: "button input group", field: React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text", onClick: () => console.log('clicked') }, "custom grouped element"), append: [
+                        {
+                            variant: 'element',
+                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Custom")),
+                        },
+                    ] })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(InputGroup, { tooltip: "This is a small input group.", tooltipDelay: 0, tooltipPlacement: "top", isHtmlTooltip: false, field: React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background" },
+                        React.createElement("div", { className: "tw-rounded-sm tw-bg-green-400 dark:tw-text-sq-dark-text" }, "Custom element 1"),
+                        React.createElement("div", { className: "tw-rounded-sm tw-bg-red-400 dark:tw-text-sq-dark-text tw-mt-1", onClick: () => console.log('clicked') }, "Custom element 2")), append: [
+                        {
+                            variant: 'element',
+                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Edit")),
+                        },
+                        {
+                            variant: 'element',
+                            element: (React.createElement("div", { className: "tw-text-sm tw-p-1 tw-bg-sq-light-background dark:tw-text-sq-dark-text" }, "Delete")),
+                        },
+                    ] })))));
+    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=InputGroup.stories.js.map

package/dist/InputGroup/InputGroup.test.js

@@ -1,43 +1,43 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-import { InputGroup } from './InputGroup';
-describe('InputGroup', () => {
-    const defaultProps = {
-        value: 'with tooltip',
-        append: [
-            {
-                variant: 'button',
-                buttonProps: {
-                    icon: 'fc-annotate',
-                    iconStyle: 'theme',
-                },
-            },
-        ],
-        extraClassNames: 'extra-class',
-        tooltip: 'Tooltip title',
-        tooltipDelay: 0,
-        id: 'input-group-id',
-        testId: 'input-group-test-id',
-    };
-    it('renders without crashing', () => {
-        const { getByTestId } = render(React.createElement(InputGroup, { ...defaultProps }));
-        expect(getByTestId('input-group-test-id')).toBeInTheDocument();
-    });
-    it('applies the correct classes', () => {
-        const { getByTestId } = render(React.createElement(InputGroup, { ...defaultProps }));
-        const inputGroup = getByTestId('input-group-test-id');
-        expect(inputGroup).toHaveClass('tw-flex');
-        expect(inputGroup).toHaveClass('tw-outline-none');
-        expect(inputGroup).toHaveClass('extra-class');
-    });
-    it('renders append items', () => {
-        const { getByRole } = render(React.createElement(InputGroup, { ...defaultProps }));
-        expect(getByRole('button')).toBeInTheDocument();
-    });
-    it('renders input element', () => {
-        const { container } = render(React.createElement(InputGroup, { ...defaultProps }));
-        expect(container.querySelector('input[type="text"]')).toBeInTheDocument();
-    });
-});
+import React from 'react';
+import { render } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import { InputGroup } from './InputGroup';
+describe('InputGroup', () => {
+    const defaultProps = {
+        value: 'with tooltip',
+        append: [
+            {
+                variant: 'button',
+                buttonProps: {
+                    icon: 'fc-annotate',
+                    iconStyle: 'theme',
+                },
+            },
+        ],
+        extraClassNames: 'extra-class',
+        tooltip: 'Tooltip title',
+        tooltipDelay: 0,
+        id: 'input-group-id',
+        testId: 'input-group-test-id',
+    };
+    it('renders without crashing', () => {
+        const { getByTestId } = render(React.createElement(InputGroup, { ...defaultProps }));
+        expect(getByTestId('input-group-test-id')).toBeInTheDocument();
+    });
+    it('applies the correct classes', () => {
+        const { getByTestId } = render(React.createElement(InputGroup, { ...defaultProps }));
+        const inputGroup = getByTestId('input-group-test-id');
+        expect(inputGroup).toHaveClass('tw-flex');
+        expect(inputGroup).toHaveClass('tw-outline-none');
+        expect(inputGroup).toHaveClass('extra-class');
+    });
+    it('renders append items', () => {
+        const { getByRole } = render(React.createElement(InputGroup, { ...defaultProps }));
+        expect(getByRole('button')).toBeInTheDocument();
+    });
+    it('renders input element', () => {
+        const { container } = render(React.createElement(InputGroup, { ...defaultProps }));
+        expect(container.querySelector('input[type="text"]')).toBeInTheDocument();
+    });
+});
 //# sourceMappingURL=InputGroup.test.js.map

package/dist/InputGroup/InputGroup.types.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ButtonProps } from '../Button/Button.types';
 import { InputLengthStyleProps, TextFieldProps } from '../TextField/TextField.types';
 import { TooltipComponentProps } from '../Tooltip/Tooltip.types';

package/dist/InputGroup/InputGroup.types.js

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

package/dist/InputGroup/index.js

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