@seeqdev/qomponents 0.0.146 → 0.0.147

package/dist/Select/Select.stories.js

@@ -0,0 +1,82 @@
+import React from 'react';
+import Select from './Select';
+import TextField from '../TextField';
+export default {
+    title: 'Select',
+};
+export const AllSelectVariants = () => {
+    const options = [
+        { value: 'a', label: 'Chocolate' },
+        { value: 'b', label: 'Strawberry' },
+        { value: 'c', label: 'Vanilla' },
+        { value: 'd', label: 'Rocky Road' },
+        { value: 'e', label: 'Crazy Cow' },
+        { value: 'f', label: 'Almond Joy' },
+        { value: 'g', label: 'All of the above' },
+    ];
+    const colorOptions = [
+        { value: 'h', label: 'pink' },
+        { value: 'i', label: 'purple' },
+        { value: 'j', label: 'green' },
+        { value: 'k', label: 'red' },
+    ];
+    const groupedOptions = [
+        {
+            label: 'Ice Cream Flavors',
+            options: options,
+        },
+        {
+            label: 'Colors',
+            options: colorOptions,
+        },
+    ];
+    const customColorOption = (dropdownProps) => {
+        return React.createElement("div", { style: { color: dropdownProps.data.label } }, dropdownProps.data.label);
+    };
+    const allSelects = () => (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { id: "hello", onChange: () => { }, options: options, placeholder: "single value" })),
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { id: "hello", onChange: () => { }, options: options, placeholder: "single value - small", small: true })),
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { id: "disabled", onChange: () => { }, options: options, placeholder: "disabled", isDisabled: true })),
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { id: "error", onChange: () => { }, options: options, placeholder: "error", showError: true })),
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { onChange: () => { }, options: options, placeholder: "stays open", closeMenuOnSelect: false, creatable: true })),
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { onChange: () => { }, options: groupedOptions, placeholder: "grouped" })),
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { onChange: () => { }, options: options, creatable: true, placeholder: "create option" })),
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { onChange: () => { }, options: options, isClearable: true, placeholder: "clearable" })),
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { onChange: () => { }, options: options, placeholder: "multi-select", isMulti: true, isSearchable: false })),
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { onChange: () => { }, placeholder: "type to search", options: options, isSearchable: true })),
+        React.createElement("div", { className: "tw-p-5 tw-flex tw-flex-row" },
+            React.createElement(Select, { onChange: () => { }, placeholder: "type to search", options: options, inputGroup: "left", extraClassNames: "tw-w-[200px]" }),
+            React.createElement(TextField, { onChange: () => { }, placeholder: "text goes here", inputGroup: "right" })),
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { onChange: () => { }, options: colorOptions, placeholder: "custom option", components: { Option: (dropdownProps) => customColorOption(dropdownProps) } })),
+        React.createElement("div", { className: "tw-p-5" },
+            React.createElement(Select, { onChange: () => { }, options: colorOptions, placeholder: "custom option", controlClassNames: "tw-border-0", components: { Option: (dropdownProps) => customColorOption(dropdownProps) } }))));
+    const renderAllVariations = () => (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "tw-grid tw-gap-4" },
+            allSelects(),
+            React.createElement("div", { className: "tw-dark tw-bg-sq-dark-background" }, allSelects()))));
+    return (React.createElement("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4" },
+        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=Select.stories.js.map

package/dist/Select/Select.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.stories.js","sourceRoot":"","sources":["../../src/Select/Select.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,SAAS,MAAM,cAAc,CAAC;AAErC,eAAe;IACb,KAAK,EAAE,QAAQ;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACpC,MAAM,OAAO,GAAG;QACd,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE;QAClC,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,YAAY,EAAE;QACnC,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE;QAChC,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,YAAY,EAAE;QACnC,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE;QAClC,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,YAAY,EAAE;QACnC,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,kBAAkB,EAAE;KAC1C,CAAC;IAEF,MAAM,YAAY,GAAG;QACnB,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE;QAC7B,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAE;QAC/B,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE;QAC9B,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE;KAC7B,CAAC;IAEF,MAAM,cAAc,GAAG;QACrB;YACE,KAAK,EAAE,mBAAmB;YAC1B,OAAO,EAAE,OAAO;SACjB;QACD;YACE,KAAK,EAAE,QAAQ;YACf,OAAO,EAAE,YAAY;SACtB;KACF,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,aAAkB,EAAE,EAAE;QAC/C,OAAO,6BAAK,KAAK,EAAE,EAAE,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,EAAE,IAAG,aAAa,CAAC,IAAI,CAAC,KAAK,CAAO,CAAC;IAC3F,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,GAAG,EAAE,CAAC,CACvB;QACE,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IAAC,EAAE,EAAC,OAAO,EAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,OAAO,EAAE,OAAc,EAAE,WAAW,EAAC,cAAc,GAAG,CACzF;QACN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IACL,EAAE,EAAC,OAAO,EACV,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAClB,OAAO,EAAE,OAAc,EACvB,WAAW,EAAC,sBAAsB,EAClC,KAAK,EAAE,IAAI,GACX,CACE;QAEN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IAAC,EAAE,EAAC,UAAU,EAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,OAAO,EAAE,OAAc,EAAE,WAAW,EAAC,UAAU,EAAC,UAAU,EAAE,IAAI,GAAI,CAC1G;QACN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IAAC,EAAE,EAAC,OAAO,EAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,OAAO,EAAE,OAAc,EAAE,WAAW,EAAC,OAAO,EAAC,SAAS,EAAE,IAAI,GAAI,CACnG;QAEN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IACL,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAClB,OAAO,EAAE,OAAc,EACvB,WAAW,EAAC,YAAY,EACxB,iBAAiB,EAAE,KAAK,EACxB,SAAS,EAAE,IAAI,GACf,CACE;QAEN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,OAAO,EAAE,cAAqB,EAAE,WAAW,EAAC,SAAS,GAAG,CAChF;QAEN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,OAAO,EAAE,OAAc,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAC,eAAe,GAAG,CAChG;QAEN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,OAAO,EAAE,OAAc,EAAE,WAAW,EAAE,IAAI,EAAE,WAAW,EAAC,WAAW,GAAG,CAC9F;QAEN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IACL,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAClB,OAAO,EAAE,OAAc,EACvB,WAAW,EAAC,cAAc,EAC1B,OAAO,EAAE,IAAI,EACb,YAAY,EAAE,KAAK,GACnB,CACE;QACN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,WAAW,EAAC,gBAAgB,EAAC,OAAO,EAAE,OAAc,EAAE,YAAY,EAAE,IAAI,GAAI,CACpG;QAEN,6BAAK,SAAS,EAAC,4BAA4B;YACzC,oBAAC,MAAM,IACL,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAClB,WAAW,EAAC,gBAAgB,EAC5B,OAAO,EAAE,OAAc,EACvB,UAAU,EAAC,MAAM,EACjB,eAAe,EAAC,cAAc,GAC9B;YACF,oBAAC,SAAS,IAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,WAAW,EAAC,gBAAgB,EAAC,UAAU,EAAC,OAAO,GAAG,CAC7E;QAEN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IACL,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAClB,OAAO,EAAE,YAAmB,EAC5B,WAAW,EAAC,eAAe,EAC3B,UAAU,EAAE,EAAE,MAAM,EAAE,CAAC,aAAkB,EAAE,EAAE,CAAC,iBAAiB,CAAC,aAAa,CAAC,EAAE,GAChF,CACE;QAEN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,MAAM,IACL,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAClB,OAAO,EAAE,YAAmB,EAC5B,WAAW,EAAC,eAAe,EAC3B,iBAAiB,EAAC,aAAa,EAC/B,UAAU,EAAE,EAAE,MAAM,EAAE,CAAC,aAAkB,EAAE,EAAE,CAAC,iBAAiB,CAAC,aAAa,CAAC,EAAE,GAChF,CACE,CACL,CACJ,CAAC;IACF,MAAM,mBAAmB,GAAG,GAAG,EAAE,CAAC,CAChC;QACE,6BAAK,SAAS,EAAC,kBAAkB;YAC9B,UAAU,EAAE;YACb,6BAAK,SAAS,EAAC,kCAAkC,IAAE,UAAU,EAAE,CAAO,CAClE,CACL,CACJ,CAAC;IACF,OAAO,CACL,6BAAK,SAAS,EAAC,iCAAiC;QAC9C,6BAAK,SAAS,EAAC,aAAa;YAC1B,8CAAmB;YAClB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,iDAAsB;YACrB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,eAAe;YAC5B,gDAAqB;YACpB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,eAAe;YAC5B,gDAAqB;YACpB,mBAAmB,EAAE,CAClB,CACF,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/Select/Select.test.js

@@ -0,0 +1,182 @@
+import React from 'react';
+import '@testing-library/jest-dom';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import Select from './Select';
+describe('Select', () => {
+    class Context {
+        testId = 'selectTestId';
+        label = 'button label';
+        options = [
+            { label: 'vanilla', value: 'a' },
+            { label: 'chocolate', value: 'b' },
+            { label: 'strawberry', value: 'c' },
+        ];
+        otherOptions = [
+            { label: 'red', value: 'd' },
+            { label: 'green', value: 'e' },
+        ];
+        groupedOptions = [
+            {
+                label: 'Ice Cream Flavors',
+                options: this.options,
+            },
+            {
+                label: 'Colors',
+                options: this.otherOptions,
+            },
+        ];
+        props = {
+            onChange: jest.fn(),
+            options: this.options,
+        };
+    }
+    let tc;
+    beforeEach(() => {
+        tc = new Context();
+    });
+    const openSelect = async () => {
+        const select = document.querySelector(`.specOpenSelect`);
+        await userEvent.click(select);
+    };
+    const renderSelect = (props) => render(React.createElement("div", { id: "wrapper" },
+        React.createElement(Select, { ...props })));
+    it('renders the select', () => {
+        renderSelect(tc.props);
+        expect(document.querySelector('.specSelectControl')).toBeInTheDocument();
+    });
+    it('displays options', async () => {
+        renderSelect(tc.props);
+        await openSelect();
+        expect(document.querySelectorAll('.specSelectOption')).toHaveLength(3);
+    });
+    it('displays grouped options', async () => {
+        renderSelect({ ...tc.props, options: tc.groupedOptions });
+        await openSelect();
+        expect(document.querySelectorAll('.specSelectOption')).toHaveLength(5);
+        expect(document.querySelectorAll('.specSelectGroupHeading')).toHaveLength(2);
+        expect(document.querySelectorAll('.specSelectGroup')).toHaveLength(2);
+    });
+    it('reflects error state', () => {
+        renderSelect({ ...tc.props, showError: true });
+        expect(document.querySelector('.specSelectControl')).toHaveClass('tw-border-sq-danger-color');
+    });
+    it('reflects custom render function for option', async () => {
+        const getOptionLabel = (option) => (React.createElement("div", null,
+            option.label,
+            React.createElement("br", null),
+            "custom formatting applied"));
+        renderSelect({ ...tc.props, getOptionLabel });
+        await openSelect();
+        expect(document.querySelectorAll('.specSelectOption')[0]).toHaveTextContent('custom formatting applied');
+    });
+    it('reflects custom render for selected option', async () => {
+        const getSelectedValueLabel = (option) => (React.createElement("div", null,
+            option.label,
+            React.createElement("br", null),
+            "the chosen one"));
+        renderSelect({ ...tc.props, getSelectedValueLabel });
+        await openSelect();
+        await userEvent.click(screen.getByText(tc.options[0].label));
+        expect(document.querySelectorAll('.specOpenSelect')[0]).toHaveTextContent('the chosen one');
+    });
+    it('renders the provided value as selected', () => {
+        const value = tc.options[1];
+        renderSelect({ ...tc.props, value });
+        expect(document.querySelectorAll('.specOpenSelect')[0]).toHaveTextContent(value.label);
+    });
+    it('renders the provided placeholder', () => {
+        const placeholder = 'choose your favorite flavor';
+        renderSelect({ ...tc.props, placeholder });
+        expect(screen.getByText(placeholder)).toBeInTheDocument();
+    });
+    it('renders the provided noOptionsMessage', async () => {
+        const noOptionsMessage = 'Nothing to see here.';
+        renderSelect({ ...tc.props, noOptionsMessage, options: [] });
+        await openSelect();
+        expect(screen.getByText(noOptionsMessage)).toBeInTheDocument();
+    });
+    it('supports multi selection', async () => {
+        const isMulti = true;
+        renderSelect({ ...tc.props, isMulti });
+        await openSelect();
+        await userEvent.click(screen.getByText(tc.options[0].label));
+        await openSelect();
+        await userEvent.click(screen.getByText(tc.options[1].label));
+        expect(document.querySelectorAll('.specOpenSelect')).toHaveLength(2);
+    });
+    it('renders isClearable', async () => {
+        const isClearable = true;
+        const placeholder = 'no worries - you can clear this.';
+        renderSelect({ ...tc.props, isClearable, placeholder });
+        await openSelect();
+        await userEvent.click(screen.getByText(tc.options[0].label));
+        expect(document.querySelectorAll('.specOpenSelect')[0]).toHaveTextContent(tc.options[0].label);
+        expect(document.querySelector('.specClearSelect')).toBeInTheDocument();
+        await userEvent.click(document.querySelector('.specClearSelect'));
+        expect(document.querySelectorAll('.specOpenSelect')[0]).toHaveTextContent(placeholder);
+    });
+    it('supports menuIsOpen', async () => {
+        const menuIsOpen = true;
+        renderSelect({ ...tc.props, menuIsOpen, menuPortalTarget: document.querySelector('#wrapper') });
+        expect(document.querySelectorAll('.specSelectOption')).toHaveLength(tc.options.length);
+    });
+    it('supports closeMenuOnSelect', async () => {
+        const closeMenuOnSelect = false;
+        renderSelect({ ...tc.props, closeMenuOnSelect });
+        await openSelect();
+        await userEvent.click(screen.getByText(tc.options[1].label));
+        await userEvent.click(screen.getByText(tc.options[2].label));
+        expect(document.querySelectorAll('.specOpenSelect')[0]).toHaveTextContent(tc.options[2].label);
+    });
+    it('removes selected option from multi-select options list', async () => {
+        const closeMenuOnSelect = false;
+        renderSelect({ ...tc.props, isMulti: true, closeMenuOnSelect });
+        await openSelect();
+        await userEvent.click(screen.getByText(tc.options[1].label));
+        await userEvent.click(screen.getByText(tc.options[2].label));
+        expect(document.querySelectorAll('.specSelectOption')).toHaveLength(tc.options.length - 2);
+    });
+    it('calls onChange handler', async () => {
+        const onChange = jest.fn();
+        renderSelect({ ...tc.props, onChange });
+        await openSelect();
+        await userEvent.click(screen.getByText(tc.options[1].label));
+        expect(onChange).toHaveBeenCalledWith(tc.options[1]);
+    });
+    it('includes inputId', async () => {
+        const inputId = 'idMe';
+        renderSelect({ ...tc.props, inputId });
+        expect(document.querySelector(`#${inputId}`)).toBeInTheDocument();
+    });
+    it('supports creating options', async () => {
+        const inputId = 'idMe';
+        const favorite = 'Almond Joy';
+        renderSelect({ ...tc.props, creatable: true, inputId });
+        await openSelect();
+        await userEvent.type(document.querySelector(`#${inputId}`), favorite);
+        expect(screen.getByText(`Create "${favorite}"`)).toBeInTheDocument();
+    });
+    it('supports onMenuOpen', async () => {
+        const onMenuOpen = jest.fn();
+        renderSelect({ ...tc.props, onMenuOpen });
+        await openSelect();
+        expect(onMenuOpen).toHaveBeenCalled();
+    });
+    it('supports onMenuClose', async () => {
+        const onMenuClose = jest.fn();
+        renderSelect({ ...tc.props, onMenuClose });
+        await openSelect();
+        await userEvent.click(screen.getByText(tc.options[0].label));
+        expect(onMenuClose).toHaveBeenCalled();
+    });
+    it('supports custom components', async () => {
+        const components = {
+            DropdownIndicator: () => React.createElement("div", { className: "custom" }, "Custom Dropdown"),
+        };
+        renderSelect({ ...tc.props, components });
+        await openSelect();
+        expect(document.querySelector('.custom')).toBeInTheDocument();
+    });
+});
+//# sourceMappingURL=Select.test.js.map

package/dist/Select/Select.test.js.map

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

package/dist/Select/Select.types.d.ts

@@ -16,8 +16,10 @@ export interface SelectProps {
     creatable?: boolean;
     /** set to true to disable the select */
     isDisabled?: boolean;
-    /** extra class names to be placed on the select control: this can be used to size the select */
+    /** extra class names to be placed on the select container: this can be used to size the select */
     extraClassNames?: string;
+    /** extra class names to be placed on the select control */
+    controlClassNames?: string;
     /** custom filter for search */
     filterConfig?: unknown;
     /** formats option labels in the menu and control as React components */

package/dist/Select/Select.types.js

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

package/dist/Select/Select.types.js.map

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

package/dist/Select/index.js

@@ -0,0 +1,3 @@
+export { default } from './Select';
+export { components as SelectCompoents } from 'react-select';
+//# sourceMappingURL=index.js.map

package/dist/Select/index.js.map

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

package/dist/Slider/Slider.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import * as RadixSlider from '@radix-ui/react-slider';
+/**
+ * Slider .
+ */
+export const Slider = (props) => {
+    const { onValueChange, onPointerUp, id, value, name, disabled = false, rootExtraClassNames = '', trackExtraClassNames = '', rangeExtraClassNames = '', thumbExtraClassNames = '', step, min, max, } = props;
+    return (React.createElement(RadixSlider.Root, { className: `tw-relative tw-flex tw-h-5 tw-w-full tw-touch-none tw-select-none tw-items-center ${rootExtraClassNames}`, defaultValue: [value], value: [value], onValueChange: (value) => onValueChange && onValueChange(value), onPointerUp: (e) => onPointerUp && onPointerUp(e), name: name, id: id, max: max, min: min, disabled: disabled, step: step },
+        React.createElement(RadixSlider.Track, { className: `tw-relative tw-h-[5px] tw-grow tw-rounded-[4px] tw-bg-sq-dark-gray dark:tw-bg-sq-dark-disabled-gray ${trackExtraClassNames}` },
+            React.createElement(RadixSlider.Range, { className: `tw-absolute tw-h-full tw-rounded-full ${rangeExtraClassNames}` })),
+        React.createElement(RadixSlider.Thumb, { className: `tw-block tw-h-[15px] tw-w-[15px] tw-rounded-full tw-bg-sq-color-dark active:tw-bg-sq-color-dark-dark focus:outline-none focus-visible:tw-outline-none aria-disabled:tw-bg-sq-dark-gray dark:aria-disabled:tw-bg-sq-dark-disabled-gray tw-transition tw-ease-in-out ${thumbExtraClassNames}`, "aria-disabled": disabled })));
+};
+//# sourceMappingURL=Slider.js.map

package/dist/Slider/Slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../src/Slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,WAAW,MAAM,wBAAwB,CAAC;AAEtD;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAyC,CAAC,KAAK,EAAE,EAAE;IACpE,MAAM,EACJ,aAAa,EACb,WAAW,EACX,EAAE,EACF,KAAK,EACL,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,mBAAmB,GAAG,EAAE,EACxB,oBAAoB,GAAG,EAAE,EACzB,oBAAoB,GAAG,EAAE,EACzB,oBAAoB,GAAG,EAAE,EACzB,IAAI,EACJ,GAAG,EACH,GAAG,GACJ,GAAG,KAAK,CAAC;IAEV,OAAO,CACL,oBAAC,WAAW,CAAC,IAAI,IACf,SAAS,EAAE,qFAAqF,mBAAmB,EAAE,EACrH,YAAY,EAAE,CAAC,KAAK,CAAC,EACrB,KAAK,EAAE,CAAC,KAAK,CAAC,EACd,aAAa,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,aAAa,IAAI,aAAa,CAAC,KAAK,CAAC,EAC/D,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,WAAW,IAAI,WAAW,CAAC,CAAC,CAAC,EACjD,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI;QACV,oBAAC,WAAW,CAAC,KAAK,IAChB,SAAS,EAAE,uGAAuG,oBAAoB,EAAE;YACxI,oBAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAE,yCAAyC,oBAAoB,EAAE,GAAI,CAC/E;QACpB,oBAAC,WAAW,CAAC,KAAK,IAChB,SAAS,EAAE,sQAAsQ,oBAAoB,EAAE,mBACxR,QAAQ,GACvB,CACe,CACpB,CAAC;AACJ,CAAC,CAAC"}

package/dist/Slider/Slider.stories.js

@@ -0,0 +1,58 @@
+import React from 'react';
+import { Slider } from './Slider';
+import { QTip } from '../Tooltip';
+export default {
+    title: 'Slider',
+};
+export const AllSliders = () => {
+    const [value1, setValue1] = React.useState(0);
+    const [value2, setValue2] = React.useState(0);
+    const renderAllVariations = () => (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "tw-p-4 light" },
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(Slider, { min: 0, max: 10, value: 4 })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(Slider, { min: 0, max: 10, value: 10 })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(Slider, { value: 0, min: 0, max: 10 })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement("div", null, "1 Step"),
+                React.createElement(Slider, { value: value1, min: 0, max: 20, step: 4, onValueChange: (v) => setValue1(v[0]) })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement("div", null, "10 Steps"),
+                React.createElement(Slider, { value: value2, min: 0, max: 20, step: 10, onValueChange: (v) => setValue2(v[0]) })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement("div", { className: "tw-sq-text-color" }, "Disabled"),
+                React.createElement(Slider, { value: 10, min: 0, max: 20, step: 10, disabled: true }))),
+        React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(Slider, { min: 0, max: 10, value: 4 })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(Slider, { min: 0, max: 10, value: 10 })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement(Slider, { value: 0, min: 0, max: 10 })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement("div", { className: "dark:tw-text-white" }, "1 Step"),
+                React.createElement(Slider, { value: value1, min: 0, max: 20, step: 4, onValueChange: (v) => setValue1(v[0]) })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement("div", { className: "dark:tw-text-white" }, "10 Steps"),
+                React.createElement(Slider, { value: value2, min: 0, max: 20, step: 10, onValueChange: (v) => setValue2(v[0]) })),
+            React.createElement("div", { className: "tw-p-4" },
+                React.createElement("div", { className: "dark:tw-text-white" }, "Disabled"),
+                React.createElement(Slider, { value: 10, min: 0, max: 20, step: 10, disabled: true })))));
+    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=Slider.stories.js.map

package/dist/Slider/Slider.stories.js.map

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

package/dist/Slider/Slider.test.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import { Slider } from './Slider';
+describe('Slider Component', () => {
+    const defaultProps = {
+        onValueChange: jest.fn(),
+        onPointerUp: jest.fn(),
+        id: 'test-slider',
+        value: 50,
+        name: 'slider',
+        disabled: false,
+        testId: 'slider',
+        step: 1,
+        min: 0,
+        max: 100,
+    };
+    beforeEach(() => {
+        global.ResizeObserver = jest.fn().mockImplementation(() => {
+            return { observe: jest.fn(), disconnect: jest.fn(), unobserve: jest.fn() };
+        });
+    });
+    it('renders without crashing', () => {
+        const { getByRole } = render(React.createElement(Slider, { ...defaultProps }));
+        expect(getByRole('slider')).toBeInTheDocument();
+    });
+    it('is disabled when disabled prop is true', () => {
+        const { getByRole } = render(React.createElement(Slider, { ...defaultProps, disabled: true }));
+        const thumb = getByRole('slider');
+        expect(thumb).toHaveAttribute('data-disabled', '');
+    });
+});
+//# sourceMappingURL=Slider.test.js.map

package/dist/Slider/Slider.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.test.js","sourceRoot":"","sources":["../../src/Slider/Slider.test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,yCAAyC,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAGlC,QAAQ,CAAC,kBAAkB,EAAE,GAAG,EAAE;IAChC,MAAM,YAAY,GAAgB;QAChC,aAAa,EAAE,IAAI,CAAC,EAAE,EAAE;QACxB,WAAW,EAAE,IAAI,CAAC,EAAE,EAAE;QACtB,EAAE,EAAE,aAAa;QACjB,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,QAAQ;QACd,QAAQ,EAAE,KAAK;QACf,MAAM,EAAE,QAAQ;QAChB,IAAI,EAAE,CAAC;QACP,GAAG,EAAE,CAAC;QACN,GAAG,EAAE,GAAG;KACT,CAAC;IAEF,UAAU,CAAC,GAAG,EAAE;QACd,MAAM,CAAC,cAAc,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC,kBAAkB,CAAC,GAAG,EAAE;YACxD,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,IAAI,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,IAAI,CAAC,EAAE,EAAE,EAAE,CAAC;QAC7E,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,0BAA0B,EAAE,GAAG,EAAE;QAClC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,oBAAC,MAAM,OAAK,YAAY,GAAI,CAAC,CAAC;QAC3D,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAClD,CAAC,CAAC,CAAC;IAGH,EAAE,CAAC,wCAAwC,EAAE,GAAG,EAAE;QAChD,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,oBAAC,MAAM,OAAK,YAAY,EAAE,QAAQ,EAAE,IAAI,GAAI,CAAC,CAAC;QAC3E,MAAM,KAAK,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC;QAClC,MAAM,CAAC,KAAK,CAAC,CAAC,eAAe,CAAC,eAAe,EAAE,EAAE,CAAC,CAAC;IACrD,CAAC,CAAC,CAAC;AAEL,CAAC,CAAC,CAAC"}

package/dist/Slider/Slider.types.js

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

package/dist/Slider/Slider.types.js.map

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

package/dist/Slider/index.js

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

package/dist/Slider/index.js.map

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

package/dist/SvgIcon/SvgIcon.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import '../styles.css';
+import { getQTipData } from '../Tooltip/qTip.utilities';
+import { getSvgIconPath } from '../utils/svg';
+/**
+ * Renders an icon that has an SVG icon path (see {@link isSvgIcon() })
+ *
+ * @param onClick - function to call when clicking the icon (takes no parameters)
+ * @param id - id that can be placed on the SvgIcon component
+ * @param testId - id that will be used in the data-testid attribute on the icon
+ * @param customId - id that will be used in the data-customid attribute on the icon. Can be used to identify the icon
+ *   as the click event target in an event handler
+ * @param icon - the SVG icon
+ * @param color - used to add a custom color to the icon (required if type="color")
+ * @param extraClassNames - extra class names to apply
+ * @param [viewBox='0 0 19 19'] - optional SVG view box
+ * @param type - default will use dark/light text colors otherwise will use the theme color
+ * @param tooltipProps - props to pass to the tooltip
+ */
+const SvgIcon = ({ onClick, icon, color, type = 'default', extraClassNames, viewBox = '0 0 19 19', id, testId, customId, ...tooltipProps }) => {
+    const appliedClassNames = `${onClick ? 'tw-cursor-pointer' : ''} ${extraClassNames} focus:tw-outline-none focus-visible:tw-outline-none 
+  tw-outline-none`;
+    const tooltipData = getQTipData(tooltipProps);
+    const appliedType = type === 'default' ? 'currentColor' : 'rgb(var(--sq-icon))';
+    return (React.createElement("div", { onClick: onClick, ...tooltipData, className: `svgContainer ${appliedClassNames}` },
+        React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: `tw-sq-icon dark:tw-text-white`, viewBox: viewBox, fill: color ? color : appliedType, "data-testid": testId },
+            React.createElement("path", { d: getSvgIconPath(icon) }))));
+};
+export default SvgIcon;
+//# sourceMappingURL=SvgIcon.js.map

package/dist/SvgIcon/SvgIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SvgIcon.js","sourceRoot":"","sources":["../../src/SvgIcon/SvgIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,eAAe,CAAC;AAEvB,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9C;;;;;;;;;;;;;;GAcG;AACH,MAAM,OAAO,GAA0C,CAAC,EACtD,OAAO,EACP,IAAI,EACJ,KAAK,EACL,IAAI,GAAG,SAAS,EAChB,eAAe,EACf,OAAO,GAAG,WAAW,EACrB,EAAE,EACF,MAAM,EACN,QAAQ,EACR,GAAG,YAAY,EAChB,EAAE,EAAE;IACH,MAAM,iBAAiB,GAAG,GACxB,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAClC,IAAI,eAAe;kBACH,CAAC;IACjB,MAAM,WAAW,GAAG,WAAW,CAAC,YAAY,CAAC,CAAC;IAC9C,MAAM,WAAW,GAAG,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,qBAAqB,CAAC;IAEhF,OAAO,CACL,6BAAK,OAAO,EAAE,OAAO,KAAM,WAAW,EAAE,SAAS,EAAE,gBAAgB,iBAAiB,EAAE;QACpF,6BACE,KAAK,EAAC,4BAA4B,EAClC,SAAS,EAAE,+BAA+B,EAC1C,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,iBACpB,MAAM;YACnB,8BAAM,CAAC,EAAE,cAAc,CAAC,IAAI,CAAC,GAAI,CAC7B,CACF,CACP,CAAC;AACJ,CAAC,CAAC;AACF,eAAe,OAAO,CAAC"}

package/dist/SvgIcon/SvgIcon.stories.js

@@ -0,0 +1,42 @@
+import React from 'react';
+import SvgIcon from './SvgIcon';
+import { svgIconTypes } from './SvgIcon.types';
+export default {
+    title: 'Svg Icons',
+};
+const icon = 'svgpath:M0 8.8153a8.8153 8.8153 90 1117.6306 0A8.8153 8.8153 90 110 8.8153zM9.9172 3.3057a1.1019' +
+    ' 1.1019 90 10-2.2038 0 1.1019 1.1019 90 102.2038 0zM8.8153 14.3249c1.2155 0 2.2038-.9883 2.2038-2.2038 0-.5992-.2376-1.1398-.6233-1.5358L12.6031 5.5681c.1825-.4167-.0069-.9056-.4235-1.0881s-.9056.0069-1.0881.4235L8.8807 9.9172c-.0207 0-.0448 0-.0654 0-1.2155 0-2.2038.9883-2.2038 2.2038s.9883 2.2038 2.2038 2.2038zM6.0605 4.9586a1.1019 1.1019 90 10-2.2038 0 1.1019 1.1019 90 102.2038 0zM3.3057 9.9172a1.1019 1.1019 90 100-2.2038 1.1019 1.1019 90 100 2.2038zm12.121-1.1019a1.1019 1.1019 90 10-2.2038 0 1.1019 1.1019 90 102.2038 0z';
+export const AllIcons = () => {
+    const renderAllVariations = () => {
+        const supportedSvgIconTypes = svgIconTypes.filter((type) => type === 'default' || type === 'theme');
+        return (React.createElement(React.Fragment, null,
+            React.createElement("br", null),
+            React.createElement("br", null),
+            supportedSvgIconTypes.map((iconType) => {
+                return (React.createElement("div", { key: `${iconType}` },
+                    React.createElement("b", null,
+                        "type=",
+                        iconType),
+                    React.createElement("br", null),
+                    React.createElement("div", { className: "tw-flex" },
+                        React.createElement(SvgIcon, { icon: icon, type: iconType, extraClassNames: 'tw-p-2 tw-w-12', onClick: (e) => window.alert('svg clicked') })),
+                    React.createElement("div", { className: "tw-dark tw-bg-sq-dark-background tw-flex" },
+                        React.createElement(SvgIcon, { icon: icon, type: iconType, extraClassNames: 'tw-p-2 tw-w-12', onClick: (e) => window.alert('svg clicked') })),
+                    React.createElement("br", null)));
+            })));
+    };
+    return (React.createElement("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4" },
+        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=SvgIcon.stories.js.map

package/dist/SvgIcon/SvgIcon.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SvgIcon.stories.js","sourceRoot":"","sources":["../../src/SvgIcon/SvgIcon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,OAAO,MAAM,WAAW,CAAC;AAChC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,eAAe;IACb,KAAK,EAAE,WAAW;CACnB,CAAC;AAEF,MAAM,IAAI,GAAG,kGAAkG;IAC7G,mhBAAmhB,CAAC;AAEthB,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,EAAE;IAC3B,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,MAAM,qBAAqB,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,OAAO,CAAC,CAAC;QACpG,OAAO,CACL;YACE,+BAAM;YACN,+BAAM;YACL,qBAAqB,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;gBACtC,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,QAAQ,EAAE;oBACrB;;wBAAS,QAAQ,CAAK;oBACtB,+BAAM;oBACN,6BAAK,SAAS,EAAC,SAAS;wBACtB,oBAAC,OAAO,IACN,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,QAAQ,EACd,eAAe,EAAE,gBAAgB,EACjC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC,GAC3C,CACE;oBACN,6BAAK,SAAS,EAAC,0CAA0C;wBACvD,oBAAC,OAAO,IACN,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,QAAQ,EACd,eAAe,EAAE,gBAAgB,EACjC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC,GAC3C,CACE;oBACN,+BAAM,CACF,CACP,CAAC;YACJ,CAAC,CAAC,CACD,CACJ,CAAC;IACJ,CAAC,CAAC;IACF,OAAO,CACL,6BAAK,SAAS,EAAC,iCAAiC;QAC9C,6BAAK,SAAS,EAAC,aAAa;YAC1B,8CAAmB;YAClB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,iDAAsB;YACrB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,eAAe;YAC5B,gDAAqB;YACpB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,eAAe;YAC5B,gDAAqB;YACpB,mBAAmB,EAAE,CAClB,CACF,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/SvgIcon/SvgIcon.test.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import '@testing-library/jest-dom';
+import { render, screen } from '@testing-library/react';
+import SvgIcon from './SvgIcon';
+describe('SvgIcon', () => {
+    class Context {
+        testId = 'svgIconTestId';
+        icon = 'svgpath:M0 8.8153a8.8153 8.8153 90 1117.6306 0A8.8153 8.8153 90 110 8.8153zM9.9172 3.3057a1.1019 1.1019' +
+            ' 90 10-2.2038 0 1.1019 1.1019 90 102.2038 0zM8.8153 14.3249c1.2155 0 2.2038-.9883 2.2038-2.2038' +
+            ' 0-.5992-.2376-1.1398-.6233-1.5358L12.6031 5.5681c.1825-.4167-.0069-.9056-.4235-1.0881s-.9056.0069-1.0881.4235L8.8807 9.9172c-.0207 0-.0448 0-.0654 0-1.2155 0-2.2038.9883-2.2038 2.2038s.9883 2.2038 2.2038 2.2038zM6.0605 4.9586a1.1019 1.1019 90 10-2.2038 0 1.1019 1.1019 90 102.2038 0zM3.3057 9.9172a1.1019 1.1019 90 100-2.2038 1.1019 1.1019 90 100 2.2038zm12.121-1.1019a1.1019 1.1019 90 10-2.2038 0 1.1019 1.1019 90 102.2038 0z';
+        props = {
+            icon: this.icon,
+            onClick: jest.fn(),
+            testId: this.testId,
+        };
+    }
+    let tc;
+    beforeEach(() => {
+        tc = new Context();
+    });
+    const renderIcon = (props) => render(React.createElement(SvgIcon, { ...props }));
+    it('renders svg icon', () => {
+        renderIcon(tc.props);
+        expect(screen.getByTestId(tc.testId)).toHaveAttribute('fill');
+    });
+    describe('icon types', () => {
+        it('renders the theme type by default', () => {
+            renderIcon(tc.props);
+            expect(screen.getByTestId(tc.testId)).toHaveClass('tw-sq-icon');
+        });
+        it('renders the white icon', () => {
+            renderIcon({ ...tc.props, color: 'white' });
+            expect(screen.getByTestId(tc.testId)).toHaveAttribute('fill', 'white');
+        });
+        it('renders the color icon', () => {
+            renderIcon({ ...tc.props, color: '#AABBFF' });
+            expect(screen.getByTestId(tc.testId)).toHaveAttribute('fill', '#AABBFF');
+        });
+    });
+});
+//# sourceMappingURL=SvgIcon.test.js.map

package/dist/SvgIcon/SvgIcon.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SvgIcon.test.js","sourceRoot":"","sources":["../../src/SvgIcon/SvgIcon.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,OAAO,MAAM,WAAW,CAAC;AAGhC,QAAQ,CAAC,SAAS,EAAE,GAAG,EAAE;IACvB,MAAM,OAAO;QACX,MAAM,GAAG,eAAe,CAAC;QACzB,IAAI,GAAI,yGAAyG;YAC/G,iGAAiG;YACjG,6aAA6a,CAAC;QAChb,KAAK,GAAiB;YACpB,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,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,UAAU,GAAG,CAAC,KAAmB,EAAE,EAAE,CAAC,MAAM,CAAC,oBAAC,OAAO,OAAK,KAAK,GAAI,CAAC,CAAC;IAE3E,EAAE,CAAC,kBAAkB,EAAE,GAAG,EAAE;QAC1B,UAAU,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QACrB,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;IAChE,CAAC,CAAC,CAAC;IAEH,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;QAC1B,EAAE,CAAC,mCAAmC,EAAE,GAAG,EAAE;YAC3C,UAAU,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;YACrB,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC;QAClE,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,wBAAwB,EAAE,GAAG,EAAE;YAChC,UAAU,CAAC,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC;YAC5C,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QACzE,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,wBAAwB,EAAE,GAAG,EAAE;YAChC,UAAU,CAAC,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;YAC9C,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;QAC3E,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/SvgIcon/SvgIcon.types.js

@@ -0,0 +1,6 @@
+import { iconTypes } from '../Icon/Icon.types';
+export const svgIconTypes = [
+    ...iconTypes,
+    'default',
+];
+//# sourceMappingURL=SvgIcon.types.js.map

package/dist/SvgIcon/SvgIcon.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SvgIcon.types.js","sourceRoot":"","sources":["../../src/SvgIcon/SvgIcon.types.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE/C,MAAM,CAAC,MAAM,YAAY,GAAI;IAC3B,GAAG,SAAS;IACZ,SAAS;CACD,CAAC"}

package/dist/SvgIcon/index.js

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

package/dist/SvgIcon/index.js.map

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