@seeqdev/qomponents 0.0.176 → 0.0.177

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

@@ -0,0 +1,220 @@
+import { GroupBase, InputActionMeta, MenuPlacement, MultiValue, SingleValue } from 'react-select';
+import { ReactNode } from 'react';
+import { InputGroupPlacement } from '../types';
+export type Option = {
+    label: string;
+    value: string | number;
+} | any;
+export type GroupedOption = {
+    label: string;
+    options: Option[];
+};
+/**
+ * Props for the Select component that provides a customizable dropdown selection interface.
+ * Built on top of react-select with additional Seeq-specific styling and functionality.
+ */
+export interface SelectProps {
+    /**
+     * When false (default), automatically closes the dropdown menu after an option is selected.
+     * When true, keeps the menu open after selection, useful for multi-select scenarios
+     * where users might want to select multiple options quickly.
+     */
+    closeMenuOnSelect?: boolean;
+    /**
+     * When true, allows users to create new options by typing values not in the existing options list.
+     * The new option will be added to the selection and can be handled in the onChange callback.
+     * Useful for tag-like inputs or dynamic option lists.
+     */
+    creatable?: boolean;
+    /**
+     * When true, disables the entire select component preventing user interaction.
+     * The select appears visually dimmed and doesn't respond to clicks or keyboard input.
+     */
+    isDisabled?: boolean;
+    /**
+     * Additional CSS classes to apply to the select container element.
+     * Can be used to control the overall size, positioning, or styling of the select component.
+     */
+    extraClassNames?: string;
+    /**
+     * Additional CSS classes to apply specifically to the select control (the main input area).
+     * Use this to customize the appearance of the clickable area that displays the selected value.
+     */
+    controlClassNames?: string;
+    /**
+     * Custom filter configuration for search functionality.
+     * Advanced option for customizing how the select filters options when users type.
+     */
+    filterConfig?: unknown;
+    /**
+     * Custom function to format how option labels are displayed in the dropdown menu and control.
+     * Receives an option object and should return a React node for custom rendering.
+     * Useful for displaying rich content like icons, badges, or formatted text.
+     */
+    getOptionLabel?: (option: Option) => ReactNode | undefined;
+    /**
+     * Custom function to extract the value from an option object.
+     * Should return a string that uniquely identifies the option.
+     * Used internally by react-select for option comparison and selection tracking.
+     */
+    getOptionValue?: (option: Option) => string;
+    /**
+     * Custom function to format how selected option labels are displayed.
+     * Similar to getOptionLabel but specifically for rendering selected values.
+     * Useful when you want different formatting for selected vs dropdown options.
+     */
+    getSelectedValueLabel?: (option: Option) => ReactNode | undefined;
+    /**
+     * HTML ID attribute for the select component container.
+     * Should be unique across the page for proper HTML semantics and accessibility.
+     */
+    id?: string;
+    /**
+     * Specifies the select's position within an input group:
+     * - `prepend`: Select is preceded by another element
+     * - `append`: Select is followed by another element
+     * Affects styling to create seamless grouped appearance.
+     */
+    inputGroup?: InputGroupPlacement;
+    /**
+     * HTML ID attribute for the internal input element.
+     * Used for accessibility and form associations. If not provided, one will be generated.
+     */
+    inputId?: string;
+    /**
+     * When true, displays a clear button (X) that allows users to remove their selection.
+     * Useful for optional selections where users might want to revert to no selection.
+     */
+    isClearable?: boolean;
+    /**
+     * When true, displays a loading spinner and disables interaction while options are being fetched.
+     * Use this when loading options asynchronously to provide visual feedback to users.
+     */
+    isLoading?: boolean;
+    /**
+     * When true, allows selection of multiple options instead of just one.
+     * Selected options are displayed as chips/tags within the control area.
+     * The onChange callback will receive an array of selected options.
+     */
+    isMulti?: boolean;
+    /**
+     * When true, allows users to type in the select to filter/search through available options.
+     * When false, the select acts as a pure dropdown without search functionality.
+     */
+    isSearchable?: boolean;
+    /**
+     * Forces the dropdown menu to remain open regardless of user interaction.
+     * Primarily useful for debugging or special UI scenarios. Normally should be left undefined.
+     */
+    menuIsOpen?: boolean;
+    /**
+     * Controls where the dropdown menu appears relative to the select control:
+     * - `auto`: Automatically positions based on available space (recommended)
+     * - `top`: Always appears above the control
+     * - `bottom`: Always appears below the control
+     */
+    menuPlacement?: MenuPlacement;
+    /**
+     * Specifies a DOM element where the dropdown menu should be rendered.
+     * When null, renders in the normal document flow. When specified, renders in a portal
+     * to that element, which can help with z-index issues.
+     */
+    menuPortalTarget?: null | HTMLElement;
+    /**
+     * Custom message to display when no options are available for selection.
+     * Shown when the options array is empty or when search filters exclude all options.
+     * @default "No options"
+     */
+    noOptionsMessage?: string;
+    /**
+     * Callback function triggered when the selected value(s) change.
+     * For single selects, receives a single Option or null. For multi-selects, receives an array.
+     * Use this to handle selection changes and update your application state.
+     */
+    onChange: (newValue: SingleValue<Option> | MultiValue<Option>) => void;
+    /**
+     * Array of available options for selection in the dropdown.
+     * Can be a flat array of options or grouped options with category labels.
+     * Each option should have at minimum a label and value property.
+     */
+    options: Option[] | GroupedOption[];
+    /**
+     * Placeholder text displayed when no option is selected.
+     * Provides guidance to users about what they should select.
+     * Only shown when there's no current selection.
+     */
+    placeholder?: string;
+    /**
+     * When true, displays error styling (typically red border) on the select control.
+     * Used to indicate validation errors or invalid selections.
+     */
+    showError?: boolean;
+    /**
+     * When true, renders the select in a smaller, more compact size.
+     * Useful for dense layouts or when space is limited.
+     */
+    small?: boolean;
+    /**
+     * Currently selected option(s) for controlled component behavior.
+     * For single selects, should be a single Option or undefined.
+     * For multi-selects, should be an array of Options.
+     */
+    value?: Option | undefined;
+    /**
+     * Initial selected option(s) for uncontrolled component behavior.
+     * Used when you want the select to manage its own state internally.
+     * Only used during initial render.
+     */
+    defaultValue?: Option | undefined;
+    /**
+     * Custom function to determine if an option should be displayed in the menu.
+     * Receives the option and current search input, returns true to show the option.
+     * Useful for implementing complex filtering logic beyond simple text matching.
+     */
+    filterOption?: (option: Option, rawInput: string) => boolean;
+    /**
+     * Custom function to format group labels when using grouped options.
+     * Receives a group object and should return a React node for the group header.
+     */
+    formatGroupLabel?: (group: GroupBase<unknown>) => ReactNode;
+    /**
+     * Callback triggered when an option is removed in multi-select mode.
+     * Receives an object with the ID of the removed option.
+     * Useful for handling removal-specific logic separately from general onChange.
+     */
+    onRemove?: ({ id }: {
+        id: Option | string;
+    }) => void;
+    /**
+     * Callback triggered when the dropdown menu opens.
+     * Use this for lazy loading options, analytics, or other open-related side effects.
+     */
+    onMenuOpen?: () => void;
+    /**
+     * Callback triggered when the dropdown menu closes.
+     * Use this for cleanup, saving state, or other close-related side effects.
+     */
+    onMenuClose?: () => void;
+    /**
+     * Custom react-select components to override default rendering.
+     * Allows deep customization of option rendering, control appearance, etc.
+     * See react-select documentation for available component slots.
+     */
+    components?: Partial<any>;
+    /**
+     * Callback triggered when the search input within the menu receives focus.
+     * Receives the current input value. Useful for search-related functionality.
+     */
+    onMenuInputFocus?: (inputValue: string) => void;
+    /**
+     * Callback triggered whenever the search input value changes.
+     * Different from onChange which only fires on selection - this fires on every keystroke.
+     * The action parameter indicates what caused the change (input, menu-close, etc.).
+     */
+    onInputChange?: (inputValue: string, action: InputActionMeta) => void;
+    /**
+     * Current value of the search input for controlled search behavior.
+     * Use this when you want to control the search input externally.
+     */
+    inputValue?: string;
+}

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.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Select';
+export { components as SelectCompoents } from 'react-select';

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.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { SliderProps } from './Slider.types';
+/**
+ * Slider .
+ */
+export declare const Slider: React.FunctionComponent<SliderProps>;

package/dist/Slider/Slider.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+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 (_jsxs(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, children: [_jsx(RadixSlider.Track, { className: `tw:relative tw:h-sq-5 tw:grow tw:rounded-sm tw:bg-sq-dark-gray tw:dark:bg-sq-dark-disabled-gray ${trackExtraClassNames}`, children: _jsx(RadixSlider.Range, { className: `tw:absolute tw:h-full tw:rounded-full ${rangeExtraClassNames}` }) }), _jsx(RadixSlider.Thumb, { className: `tw:block tw:h-sq-15 tw:w-sq-15 tw:rounded-full tw:bg-sq-theme-dark active:tw:bg-sq-theme-darker tw:focus:outline-none tw:focus-visible:outline-none tw:aria-disabled:bg-sq-dark-gray tw:dark:aria-disabled: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":";AAEA,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,MAAC,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,aACV,KAAC,WAAW,CAAC,KAAK,IAChB,SAAS,EAAE,mGAAmG,oBAAoB,EAAE,YACpI,KAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAE,yCAAyC,oBAAoB,EAAE,GAAI,GAC/E,EACpB,KAAC,WAAW,CAAC,KAAK,IAChB,SAAS,EAAE,oQAAoQ,oBAAoB,EAAE,mBACtR,QAAQ,GACvB,IACe,CACpB,CAAC;AACJ,CAAC,CAAC"}

package/dist/Slider/Slider.stories.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const AllSliders: () => import("react/jsx-runtime").JSX.Element;

package/dist/Slider/Slider.stories.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+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 = () => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "tw:p-4 light", children: [_jsx("div", { className: "tw:p-4", children: _jsx(Slider, { min: 0, max: 10, value: 4 }) }), _jsx("div", { className: "tw:p-4", children: _jsx(Slider, { min: 0, max: 10, value: 10 }) }), _jsx("div", { className: "tw:p-4", children: _jsx(Slider, { value: 0, min: 0, max: 10 }) }), _jsxs("div", { className: "tw:p-4", children: [_jsx("div", { children: "1 Step" }), _jsx(Slider, { value: value1, min: 0, max: 20, step: 4, onValueChange: (v) => setValue1(v[0]) })] }), _jsxs("div", { className: "tw:p-4", children: [_jsx("div", { children: "10 Steps" }), _jsx(Slider, { value: value2, min: 0, max: 20, step: 10, onValueChange: (v) => setValue2(v[0]) })] }), _jsxs("div", { className: "tw:p-4", children: [_jsx("div", { className: "tw:sq-text-color", children: "Disabled" }), _jsx(Slider, { value: 10, min: 0, max: 20, step: 10, disabled: true })] })] }), _jsxs("div", { className: "tw:p-4 tw-dark tw:bg-sq-dark-background", children: [_jsx("div", { className: "tw:p-4", children: _jsx(Slider, { min: 0, max: 10, value: 4 }) }), _jsx("div", { className: "tw:p-4", children: _jsx(Slider, { min: 0, max: 10, value: 10 }) }), _jsx("div", { className: "tw:p-4", children: _jsx(Slider, { value: 0, min: 0, max: 10 }) }), _jsxs("div", { className: "tw:p-4", children: [_jsx("div", { className: "tw:dark:text-sq-white", children: "1 Step" }), _jsx(Slider, { value: value1, min: 0, max: 20, step: 4, onValueChange: (v) => setValue1(v[0]) })] }), _jsxs("div", { className: "tw:p-4", children: [_jsx("div", { className: "tw:dark:text-sq-white", children: "10 Steps" }), _jsx(Slider, { value: value2, min: 0, max: 20, step: 10, onValueChange: (v) => setValue2(v[0]) })] }), _jsxs("div", { className: "tw:p-4", children: [_jsx("div", { className: "tw:dark:text-sq-white", children: "Disabled" }), _jsx(Slider, { value: 10, min: 0, max: 20, step: 10, disabled: true })] })] })] }));
+    return (_jsxs("div", { className: "tw:grid tw:grid-cols-4 tw:gap-4", children: [_jsx(QTip, {}), _jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderAllVariations()] })] }));
+};
+//# 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.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Slider/Slider.test.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render } from '@testing-library/react';
+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(_jsx(Slider, { ...defaultProps }));
+        expect(getByRole('slider')).toBeInTheDocument();
+    });
+    it('is disabled when disabled prop is true', () => {
+        const { getByRole } = render(_jsx(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":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,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,KAAC,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,KAAC,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.d.ts

@@ -0,0 +1,84 @@
+/**
+ * Props for the Slider component that provides an interactive range input control.
+ */
+export interface SliderProps {
+    /**
+     * When true, disables the slider preventing user interaction.
+     * Disabled sliders appear visually dimmed and don't respond to mouse or keyboard input.
+     */
+    disabled?: boolean;
+    /**
+     * Callback function triggered when the slider value changes.
+     * Receives an array of numbers (even for single-value sliders for consistency).
+     * Use this to handle value changes and update your application state.
+     */
+    onValueChange?: (value: number[]) => void;
+    /**
+     * Callback function triggered when the user releases the pointer (mouse/touch) from the slider.
+     * Useful for triggering actions only when the user finishes adjusting the value,
+     * rather than continuously during dragging.
+     */
+    onPointerUp?: React.PointerEventHandler<HTMLDivElement>;
+    /**
+     * HTML ID attribute for the slider component.
+     * Should be unique across the page for proper HTML semantics and accessibility.
+     */
+    id?: string;
+    /**
+     * Name attribute for the slider used in form submission.
+     * Identifies the slider's data when the form is submitted to a server.
+     */
+    name?: string;
+    /**
+     * Current value of the slider.
+     * Should be within the min/max range. The slider thumb will be positioned
+     * proportionally based on this value relative to the min/max range.
+     */
+    value: number;
+    /**
+     * Additional CSS classes to apply to the slider's root container.
+     * Use this to customize the overall slider appearance and layout.
+     */
+    rootExtraClassNames?: string;
+    /**
+     * Additional CSS classes to apply to the slider track (the background line).
+     * Use this to customize the track's color, height, or styling.
+     */
+    trackExtraClassNames?: string;
+    /**
+     * Additional CSS classes to apply to the slider thumb (the draggable handle).
+     * Use this to customize the thumb's size, color, shape, or styling.
+     */
+    thumbExtraClassNames?: string;
+    /**
+     * Additional CSS classes to apply to the active range (filled portion of the track).
+     * Use this to customize the color or styling of the filled area from min to current value.
+     */
+    rangeExtraClassNames?: string;
+    /**
+     * Test ID attribute for the slider component used in automated testing.
+     * Applied to the slider's root element for test targeting and interaction.
+     */
+    testId?: string;
+    /**
+     * Step value that defines the increment/decrement amount for the slider.
+     * The slider value will snap to multiples of this step value.
+     * Smaller steps provide finer control, larger steps provide coarser control.
+     * @default 1
+     */
+    step?: number;
+    /**
+     * Minimum allowed value for the slider.
+     * The slider thumb cannot be moved below this value.
+     * Defines the left/bottom end of the slider range.
+     * @default 0
+     */
+    min?: number;
+    /**
+     * Maximum allowed value for the slider.
+     * The slider thumb cannot be moved above this value.
+     * Defines the right/top end of the slider range.
+     * @default 100
+     */
+    max?: number;
+}

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.d.ts

@@ -0,0 +1 @@
+export { Slider as default } from './Slider';

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.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import '../styles.css';
+import { SvgIconProps } from './SvgIcon.types';
+/**
+ * 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
+ */
+declare const SvgIcon: React.FunctionComponent<SvgIconProps>;
+export default SvgIcon;

package/dist/SvgIcon/SvgIcon.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+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 (_jsx("div", { onClick: onClick, ...tooltipData, className: `svgContainer ${appliedClassNames}`, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: `tw:sq-icon tw:dark:text-sq-white`, viewBox: viewBox, fill: color ? color : appliedType, "data-testid": testId, children: _jsx("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":";AACA,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,cAAK,OAAO,EAAE,OAAO,KAAM,WAAW,EAAE,SAAS,EAAE,gBAAgB,iBAAiB,EAAE,YACpF,cACE,KAAK,EAAC,4BAA4B,EAClC,SAAS,EAAE,kCAAkC,EAC7C,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,iBACpB,MAAM,YACnB,eAAM,CAAC,EAAE,cAAc,CAAC,IAAI,CAAC,GAAI,GAC7B,GACF,CACP,CAAC;AACJ,CAAC,CAAC;AACF,eAAe,OAAO,CAAC"}

package/dist/SvgIcon/SvgIcon.stories.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const AllIcons: () => import("react/jsx-runtime").JSX.Element;

package/dist/SvgIcon/SvgIcon.stories.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+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 (_jsxs(_Fragment, { children: [_jsx("br", {}), _jsx("br", {}), supportedSvgIconTypes.map((iconType) => {
+                    return (_jsxs("div", { children: [_jsxs("b", { children: ["type=", iconType] }), _jsx("br", {}), _jsx("div", { className: "tw:flex", children: _jsx(SvgIcon, { icon: icon, type: iconType, extraClassNames: 'tw:p-2 tw:w-12', onClick: (e) => window.alert('svg clicked') }) }), _jsx("div", { className: "tw-dark tw:bg-sq-dark-background tw:flex", children: _jsx(SvgIcon, { icon: icon, type: iconType, extraClassNames: 'tw:p-2 tw:w-12', onClick: (e) => window.alert('svg clicked') }) }), _jsx("br", {})] }, `${iconType}`));
+                })] }));
+    };
+    return (_jsxs("div", { className: "tw:grid tw:grid-cols-4 tw:gap-4", children: [_jsxs("div", { className: "color_topic", children: [_jsx("b", { children: "Topic Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_analysis", children: [_jsx("b", { children: "Analysis Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_datalab", children: [_jsx("b", { children: "Datalab Colors" }), renderAllVariations()] }), _jsxs("div", { className: "color_vantage", children: [_jsx("b", { children: "Vantage Colors" }), renderAllVariations()] })] }));
+};
+//# 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":";AACA,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,GACR,kGAAkG;IAClG,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,8BACE,cAAM,EACN,cAAM,EACL,qBAAqB,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;oBACtC,OAAO,CACL,0BACE,iCAAS,QAAQ,IAAK,EACtB,cAAM,EACN,cAAK,SAAS,EAAC,SAAS,YACtB,KAAC,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,GACE,EACN,cAAK,SAAS,EAAC,0CAA0C,YACvD,KAAC,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,GACE,EACN,cAAM,KAnBE,GAAG,QAAQ,EAAE,CAoBjB,CACP,CAAC;gBACJ,CAAC,CAAC,IACD,CACJ,CAAC;IACJ,CAAC,CAAC;IACF,OAAO,CACL,eAAK,SAAS,EAAC,iCAAiC,aAC9C,eAAK,SAAS,EAAC,aAAa,aAC1B,uCAAmB,EAClB,mBAAmB,EAAE,IAClB,EAEN,eAAK,SAAS,EAAC,gBAAgB,aAC7B,0CAAsB,EACrB,mBAAmB,EAAE,IAClB,EAEN,eAAK,SAAS,EAAC,eAAe,aAC5B,yCAAqB,EACpB,mBAAmB,EAAE,IAClB,EAEN,eAAK,SAAS,EAAC,eAAe,aAC5B,yCAAqB,EACpB,mBAAmB,EAAE,IAClB,IACF,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/SvgIcon/SvgIcon.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/SvgIcon/SvgIcon.test.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+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(_jsx(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":";AACA,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,GACF,yGAAyG;YACzG,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,KAAC,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"}