@seeqdev/qomponents 0.0.172 → 0.0.173

package/dist/TextArea/TextArea.test.js

@@ -0,0 +1,130 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import '@testing-library/jest-dom';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { TextArea } from './TextArea';
+describe('TextArea', () => {
+    class Context {
+        testId = 'textAreaTestId';
+        props = {
+            onChange: jest.fn(),
+            onKeyUp: jest.fn(),
+            testId: this.testId,
+        };
+    }
+    let tc;
+    beforeEach(() => {
+        tc = new Context();
+    });
+    const renderTextArea = (props) => render(_jsx(TextArea, { ...props }));
+    it('renders the provided value', () => {
+        const value = 'hello, this is text for a text area.';
+        renderTextArea({ ...tc.props, value });
+        expect(screen.getByDisplayValue(value)).toBeInTheDocument();
+    });
+    it('renders the provided placeholder', () => {
+        const placeholder = 'Prompt to enter';
+        renderTextArea({ ...tc.props, placeholder });
+        expect(screen.getByPlaceholderText(placeholder)).toBeInTheDocument();
+    });
+    it('calls onChange handler', async () => {
+        renderTextArea({ ...tc.props });
+        await userEvent.type(screen.getByTestId(tc.testId), 'trigger');
+        expect(tc.props.onChange).toHaveBeenCalled();
+    });
+    it('calls the onKeyUp handler', async () => {
+        renderTextArea({ ...tc.props });
+        await userEvent.type(screen.getByTestId(tc.testId), 'trigger');
+        expect(tc.props.onKeyUp).toHaveBeenCalled();
+    });
+    it('respects readOnly', async () => {
+        renderTextArea({ ...tc.props, disabled: true });
+        expect(screen.getByTestId(tc.testId)).not.toBeEnabled();
+    });
+    it('provides rows', async () => {
+        renderTextArea({ ...tc.props, rows: 7 });
+        expect(screen.getByTestId(tc.testId)).toHaveProperty('rows', 7);
+    });
+    it('provides cols', async () => {
+        renderTextArea({ ...tc.props, cols: 8 });
+        expect(screen.getByTestId(tc.testId)).toHaveProperty('cols', 8);
+    });
+    it('provides name', async () => {
+        const name = 'myTextArea';
+        renderTextArea({ ...tc.props, name });
+        expect(screen.getByTestId(tc.testId)).toHaveProperty('name', name);
+    });
+    it('provides id', async () => {
+        const id = 'myTextId';
+        renderTextArea({ ...tc.props, id });
+        expect(screen.getByTestId(tc.testId)).toHaveProperty('id', id);
+    });
+    it('provides extraClassNames', async () => {
+        const extraClassNames = 'extra css';
+        renderTextArea({ ...tc.props, extraClassNames });
+        expect(screen.getByTestId(tc.testId)).toHaveClass(extraClassNames);
+    });
+    it('forwards ref to textarea element', () => {
+        const ref = React.createRef();
+        renderTextArea({ ...tc.props, ref });
+        expect(ref.current).toBeInstanceOf(HTMLTextAreaElement);
+        expect(ref.current).toBe(screen.getByTestId(tc.testId));
+    });
+    it('allows programmatic focus via ref', () => {
+        const ref = React.createRef();
+        renderTextArea({ ...tc.props, ref });
+        ref.current?.focus();
+        expect(ref.current).toHaveFocus();
+    });
+    it('allows programmatic text selection via ref', () => {
+        const ref = React.createRef();
+        const value = 'Test text content';
+        renderTextArea({ ...tc.props, ref, value });
+        ref.current?.setSelectionRange(5, 9); // Select "text"
+        expect(ref.current?.selectionStart).toBe(5);
+        expect(ref.current?.selectionEnd).toBe(9);
+    });
+    it('works with callback ref', () => {
+        let refElement = null;
+        const callbackRef = (element) => {
+            refElement = element;
+        };
+        renderTextArea({ ...tc.props, ref: callbackRef });
+        expect(refElement).toBeInstanceOf(HTMLTextAreaElement);
+        expect(refElement).toBe(screen.getByTestId(tc.testId));
+    });
+    it('calls onSelectionChange on mouseup event', async () => {
+        const onSelectionChange = jest.fn();
+        renderTextArea({ ...tc.props, onSelectionChange, value: 'Test content' });
+        const textarea = screen.getByTestId(tc.testId);
+        await userEvent.click(textarea);
+        expect(onSelectionChange).toHaveBeenCalled();
+        expect(onSelectionChange).toHaveBeenCalledWith(expect.any(Event));
+    });
+    it('calls onSelectionChange on keyup event', async () => {
+        const onSelectionChange = jest.fn();
+        renderTextArea({ ...tc.props, onSelectionChange, value: 'Test content' });
+        const textarea = screen.getByTestId(tc.testId);
+        await userEvent.type(textarea, '{arrowleft}');
+        expect(onSelectionChange).toHaveBeenCalled();
+        expect(onSelectionChange).toHaveBeenCalledWith(expect.any(Event));
+    });
+    it('does not throw error when onSelectionChange is not provided', async () => {
+        expect(() => {
+            renderTextArea({ ...tc.props, value: 'Test content' });
+            const textarea = screen.getByTestId(tc.testId);
+            userEvent.click(textarea);
+        }).not.toThrow();
+    });
+    it('provides correct event object to onSelectionChange', async () => {
+        const onSelectionChange = jest.fn();
+        renderTextArea({ ...tc.props, onSelectionChange, value: 'Test content' });
+        const textarea = screen.getByTestId(tc.testId);
+        await userEvent.click(textarea);
+        const eventArg = onSelectionChange.mock.calls[0][0];
+        expect(eventArg).toBeInstanceOf(Event);
+        expect(eventArg.target).toBe(textarea);
+    });
+});
+//# sourceMappingURL=TextArea.test.js.map

package/dist/TextArea/TextArea.test.js.map

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

package/dist/TextArea/TextArea.types.d.ts

@@ -0,0 +1,116 @@
+/// <reference types="react" />
+import { FormControlElement } from '../types';
+/**
+ * Props for the TextArea component that provides a multi-line text input control.
+ */
+export interface TextAreaProps {
+    /**
+     * Additional CSS classes to apply to the textarea element.
+     * Use this to customize the appearance beyond the default styling.
+     */
+    extraClassNames?: string;
+    /**
+     * HTML ID attribute for the textarea element.
+     * Should be unique across the page for proper HTML semantics and accessibility.
+     */
+    id?: string;
+    /**
+     * Name attribute for the textarea used in form submission.
+     * Identifies the textarea's data when the form is submitted to a server.
+     */
+    name?: string;
+    /**
+     * Callback function triggered when the textarea value changes.
+     * Receives the change event containing the new value. Use this to update
+     * your component state in controlled input scenarios.
+     */
+    onChange?: React.ChangeEventHandler<FormControlElement>;
+    /**
+     * Callback function triggered when a key is released while the textarea has focus.
+     * Useful for implementing search-as-you-type functionality or debounced input handling.
+     */
+    onKeyUp?: React.KeyboardEventHandler<FormControlElement>;
+    /**
+     * Callback function triggered when a key is pressed while the textarea has focus.
+     * Useful for implementing keyboard shortcuts, form submission shortcuts,
+     * or preventing certain characters from being entered.
+     */
+    onKeyDown?: React.KeyboardEventHandler<FormControlElement>;
+    /**
+     * Callback function triggered when the textarea receives focus.
+     * Use this to handle focus-related logic such as showing hints,
+     * clearing placeholder text, or updating UI state.
+     */
+    onFocus?: React.FocusEventHandler<HTMLTextAreaElement>;
+    /**
+     * Callback function triggered when the textarea loses focus.
+     * Commonly used for form validation, saving draft data, or
+     * updating UI state when users finish interacting with the field.
+     */
+    onBlur?: React.FocusEventHandler<FormControlElement>;
+    /**
+     * Callback function triggered when the text selection changes in the
+     * textarea. Useful for implementing features like mention autocomplete or
+     * context-sensitive tools that need to react to cursor position or text
+     * selection changes.
+     */
+    onSelectionChange?: (e: Event) => void;
+    /**
+     * Placeholder text displayed when the textarea is empty.
+     * Provides users with a hint about what type of content is expected.
+     * Should be descriptive but not replace proper labels.
+     */
+    placeholder?: string;
+    /**
+     * When true, makes the textarea read-only, preventing user input.
+     * The field will display its value but users cannot modify it. Unlike disabled fields,
+     * read-only fields can still receive focus and their values are included in form submissions.
+     */
+    readonly?: boolean;
+    /**
+     * When true, disables the textarea preventing any user interaction.
+     * Disabled fields appear visually dimmed, cannot receive focus, and their
+     * values are not included in form submissions.
+     */
+    disabled?: boolean;
+    /**
+     * Number of visible text lines in the textarea.
+     * Controls the initial height of the textarea. Users can typically resize
+     * the textarea if the browser allows it.
+     * @default 3
+     */
+    rows?: number;
+    /**
+     * Number of visible character columns in the textarea.
+     * Controls the initial width of the textarea based on average character width.
+     * Less commonly used than CSS width styling.
+     */
+    cols?: number;
+    /**
+     * When true, automatically focuses this textarea when the component mounts.
+     * Useful for modal dialogs or forms where immediate input is expected.
+     * Should be used sparingly to avoid accessibility issues.
+     */
+    autoFocus?: boolean;
+    /**
+     * Test ID attribute for the textarea element used in automated testing.
+     * Applied to the `data-testid` attribute for element selection in test suites.
+     */
+    testId?: string;
+    /**
+     * Current value of the textarea for controlled component behavior.
+     * Can be a string for text content, an array of strings for multi-value scenarios,
+     * or a number that will be converted to string. Use this for controlled input components.
+     */
+    value?: string | string[] | number;
+    /**
+     * When true, displays error styling on the textarea.
+     * Typically changes border color to red and may add error-related visual cues.
+     * Usually used in combination with error messages to provide validation feedback.
+     */
+    showError?: boolean;
+    /**
+     * Ref object to access the underlying textarea DOM element.
+     */
+    ref?: React.Ref<HTMLTextAreaElement>;
+}

package/dist/TextArea/TextArea.types.js

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

package/dist/TextArea/TextArea.types.js.map

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

package/dist/TextArea/index.d.ts

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

package/dist/TextArea/index.js

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

package/dist/TextArea/index.js.map

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

package/dist/TextField/TextField.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { InputLengthStyleProps, TextFieldProps } from './TextField.types';
+import '../styles.css';
+/**
+ * Textfield.
+ */
+export declare const TextField: React.FunctionComponent<TextFieldProps & InputLengthStyleProps>;

package/dist/TextField/TextField.js

@@ -0,0 +1,85 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useEffect, useRef, useState } from 'react';
+import '../styles.css';
+import { setValidInputDimension } from '../utils/validateStyleDimension';
+import { getQTipData } from '../Tooltip/qTip.utilities';
+const errorClasses = 'tw-border-sq-danger-color';
+const borderColorClasses = [
+    'tw-border-sq-disabled-gray',
+    'dark:tw-border-sq-dark-disabled-gray',
+    'dark:focus:tw-border-sq-color-dark-dark',
+    'dark:active:tw-border-sq-color-dark-dark',
+    'focus:tw-border-sq-color-dark',
+    'active:tw-border-sq-color-dark',
+].join(' ');
+const baseClasses = 'tw-h-inputs tw-leading-normal tw-outline-none tw-py-1 tw-px-3' +
+    ' disabled:tw-pointer-events-none disabled:tw-bg-sq-light-gray  disabled:dark:tw-bg-sq-dark-disabled-gray' +
+    ' disabled:tw-cursor-not-allowed tw-p-1 tw-border-solid tw-border tw-placeholder-gray-400' +
+    '  dark:tw-placeholder-sq-dark-text-lighter specTextField';
+const darkTheme = 'dark:tw-bg-sq-dark-background dark:tw-text-sq-dark-text disabled:dark:tw-text-sq-dark-text-lighter';
+const lightTheme = 'tw-text-sq-text-color disabled:tw-text-sq-darkish-gray';
+const sizeClasses = {
+    sm: 'tw-text-sm',
+    lg: 'tw-text-xl',
+};
+/**
+ * Textfield.
+ */
+export const TextField = React.forwardRef((props, ref) => {
+    const { readonly = false, disabled = false, onChange, onKeyUp, onFocus, onBlur, onKeyDown, id, name, size = 'sm', value, placeholder, extraClassNames, testId, type = 'text', inputGroup, step, showError, errorText, min, max, maxLength, minLength, required = false, autoComplete = 'off', inputWidth = undefined, inputHeight = undefined, autoFocus = false, ...tooltipProps } = props;
+    const internalRef = useRef(null);
+    const [cursor, setCursor] = useState(null);
+    const tooltipData = getQTipData(tooltipProps);
+    const setAllRefs = (receivedRef) => {
+        if (ref)
+            ref.current = receivedRef;
+        internalRef.current = receivedRef;
+    };
+    useEffect(() => {
+        if (autoFocus) {
+            setTimeout(() => {
+                internalRef.current?.focus();
+            }, 0);
+        }
+    }, []);
+    useEffect(() => {
+        const input = internalRef.current;
+        if (input && type !== 'number' && type !== 'email')
+            input.setSelectionRange(cursor, cursor);
+    }, [ref, cursor, value]);
+    const handleChange = (e) => {
+        setCursor(e.target.selectionStart);
+        onChange && onChange(e);
+    };
+    useEffect(() => {
+        /**
+         * we need to change the value only if it's different since the internal state of "input" will change it anyway
+         * this will only be the case when the value has been changed externally via store (undo / redo)
+         */
+        if (value !== null && value !== undefined && value !== internalRef.current?.value && internalRef.current) {
+            // we need to use this method because using the value props directly will switch the input to a "controlled"
+            // component
+            internalRef.current.value = `${value}`;
+        }
+    }, [value]);
+    let borderRadius = 'tw-rounded-md';
+    if (inputGroup === 'left') {
+        borderRadius = 'tw-rounded-l-md tw-border-r-0 focus:tw-border-r' + ' active:tw-border-r';
+    }
+    else if (inputGroup === 'right') {
+        borderRadius = 'tw-rounded-r-md tw-border-l-0 focus:tw-border-l active:tw-border-l';
+    }
+    const appliedClasses = `${baseClasses} ${sizeClasses[size]} ${extraClassNames} ${lightTheme} ${darkTheme} ${borderRadius} ${showError ? errorClasses : borderColorClasses} `;
+    const inputProp = setValidInputDimension(inputWidth, inputHeight)
+        ? {
+            style: setValidInputDimension(inputWidth, inputHeight),
+        }
+        : {};
+    const inputLenghtProp = {};
+    if (maxLength)
+        inputLenghtProp.maxLength = maxLength;
+    if (minLength)
+        inputLenghtProp.minLength = minLength;
+    return (_jsxs(_Fragment, { children: [_jsx("input", { ref: setAllRefs, "data-testid": testId, name: name, id: id, type: type, value: value, className: appliedClasses, placeholder: placeholder, disabled: disabled, readOnly: readonly, autoComplete: autoComplete, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onKeyUp: onKeyUp, step: step, required: required, min: min, max: max, ...inputLenghtProp, ...inputProp, ...tooltipData }), errorText && showError && _jsx("div", { className: "tw-text-sq-danger-color tw-text-xs tw-mt-1", children: errorText })] }));
+});
+//# sourceMappingURL=TextField.js.map

package/dist/TextField/TextField.js.map

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

package/dist/TextField/TextField.stories.d.ts

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

package/dist/TextField/TextField.stories.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { TextField } from './TextField';
+import { QTip } from '../Tooltip';
+export default {
+    title: 'TextField',
+};
+export const AllTextFields = () => {
+    const renderAllVariations = () => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "tw-p-4 light", children: [_jsx("div", { className: "tw-p-4", children: _jsx(TextField, { value: "value provided" }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { placeholder: "placeholder text" }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { placeholder: "with error", showError: true }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { placeholder: "with error text", showError: true, errorText: "this is a major test error and it is long on purpose to see its looks" }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { value: "read-only", readonly: true, onFocus: (e) => e.currentTarget.select() }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { value: "disabled", disabled: true, onFocus: (e) => e.currentTarget.select() }) }), _jsxs("div", { className: "tw-p-4", children: [_jsx("div", { children: "max value = 10" }), _jsx(TextField, { type: "number", value: 20, max: 10 })] }), _jsxs("div", { className: "tw-p-4", children: [_jsx("div", { children: "min value = 2" }), _jsx(TextField, { type: "number", value: 1, min: 2 })] }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { value: "large", size: "lg" }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { value: "with tooltip", tooltip: "small tooltip" }) })] }), _jsxs("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background", children: [_jsx("div", { className: "tw-p-4", children: _jsx(TextField, { value: "value provided" }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { placeholder: "placeholder text" }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { placeholder: "with error", showError: true }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { placeholder: "with error text", showError: true, errorText: "this is a major test error and it is long on purpose to see its looks" }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { value: "read-only", readonly: true, onFocus: (e) => e.currentTarget.select() }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { value: "disabled", disabled: true, onFocus: (e) => e.currentTarget.select() }) }), _jsxs("div", { className: "tw-p-4", children: [_jsx("div", { className: "tw-text-sq-color-dark dark:tw-text-sq-color-dark-dark", children: "max value = 10" }), _jsx(TextField, { type: "number", value: 8, max: 10 })] }), _jsxs("div", { className: "tw-p-4", children: [_jsx("div", { className: "tw-text-sq-color-dark dark:tw-text-sq-color-dark-dark", children: "min value = 2" }), _jsx(TextField, { type: "number", value: 10, min: 2 })] }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { value: "large", size: "lg" }) }), _jsx("div", { className: "tw-p-4", children: _jsx(TextField, { value: "with tooltip", tooltip: "small tooltip" }) })] })] }));
+    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=TextField.stories.js.map

package/dist/TextField/TextField.stories.js.map

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

package/dist/TextField/TextField.test.d.ts

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

package/dist/TextField/TextField.test.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import '@testing-library/jest-dom';
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { TextField } from './TextField';
+describe('TextField', () => {
+    class Context {
+        testId = 'textFieldTestId';
+        props = {
+            onChange: jest.fn(),
+            testId: this.testId,
+        };
+    }
+    let tc;
+    beforeEach(() => {
+        tc = new Context();
+    });
+    const renderTextField = (props) => render(_jsx(TextField, { ...props }));
+    it('renders the provided value', () => {
+        const value = 'hello';
+        renderTextField({ ...tc.props, value });
+        expect(screen.getByDisplayValue(value)).toBeInTheDocument();
+    });
+    it('renders the provided placeholder', () => {
+        const placeholder = 'Prompt to enter';
+        renderTextField({ ...tc.props, placeholder });
+        expect(screen.getByPlaceholderText(placeholder)).toBeInTheDocument();
+    });
+    it('calls onChange handler', async () => {
+        renderTextField({ ...tc.props });
+        await userEvent.type(screen.getByTestId(tc.testId), 'trigger');
+        expect(tc.props.onChange).toHaveBeenCalled();
+    });
+    it('autofocuses the textfield', async () => {
+        renderTextField({ ...tc.props, autoFocus: true });
+        await waitFor(() => {
+            expect(screen.getByTestId(tc.testId)).toHaveFocus();
+        });
+    });
+});
+//# sourceMappingURL=TextField.test.js.map

package/dist/TextField/TextField.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextField.test.js","sourceRoot":"","sources":["../../src/TextField/TextField.test.tsx"],"names":[],"mappings":";AACA,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,SAAS,MAAM,6BAA6B,CAAC;AAEpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,QAAQ,CAAC,WAAW,EAAE,GAAG,EAAE;IACzB,MAAM,OAAO;QACX,MAAM,GAAG,iBAAiB,CAAC;QAC3B,KAAK,GAAmB;YACtB,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE;YACnB,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;IACH,MAAM,eAAe,GAAG,CAAC,KAAqB,EAAE,EAAE,CAAC,MAAM,CAAC,KAAC,SAAS,OAAK,KAAK,GAAI,CAAC,CAAC;IAEpF,EAAE,CAAC,4BAA4B,EAAE,GAAG,EAAE;QACpC,MAAM,KAAK,GAAG,OAAO,CAAC;QACtB,eAAe,CAAC,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;QACxC,MAAM,CAAC,MAAM,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC9D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kCAAkC,EAAE,GAAG,EAAE;QAC1C,MAAM,WAAW,GAAG,iBAAiB,CAAC;QACtC,eAAe,CAAC,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC,CAAC;QAC9C,MAAM,CAAC,MAAM,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IACvE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wBAAwB,EAAE,KAAK,IAAI,EAAE;QACtC,eAAe,CAAC,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC;QACjC,MAAM,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,SAAS,CAAC,CAAC;QAC/D,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,gBAAgB,EAAE,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2BAA2B,EAAE,KAAK,IAAI,EAAE;QACzC,eAAe,CAAC,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;QAClD,MAAM,OAAO,CAAC,GAAG,EAAE;YACjB,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QACtD,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AAEL,CAAC,CAAC,CAAC"}