@economic/taco 0.0.28-alpha.0 → 0.0.28-alpha.5

package/README.md

@@ -1,84 +1,84 @@
-[![Build Status](https://travis-ci.com/e-conomic/taco.svg?token=YDzqGqegnmo39NdayXBd&branch=master)](https://travis-ci.com/e-conomic/taco)
-
-# @economic/taco
-
-> UI React component library
-
-## Usage
-
-```bash
-npm install @economic/taco
-```
-
-```javascript
-import { Button } from '@economic/taco';
-
-const MyComponent = () => <Button>Tada!</Button>;
-```
-
-## Development
-
-### Guidelines for new components
-
-Start by creating a folder under `src/` with the name of the component, e.g. `<MyAwesomeComponent />`:
-
-```
-src/
-├── ...
-├── components
-│   ├── MyAwesomeComponent
-│   │   ├── MyAwesomeComponent.css
-│   │   ├── MyAwesomeComponent.mdx
-│   │   ├── MyAwesomeComponent.test.tsx
-│   │   ├── MyAwesomeComponent.tsx
-├── index.tsx
-└── ...
-```
-
-Conceptually, the component's style, implementation, tests & documentation are co-located in its own folder.
-
-`MyAwesomeComponent/MyAwesomeComponent.css` Holds the component's style, directly imported in the implementation
-`MyAwesomeComponent/MyAwesomeComponent.mdx` Holds the component's documentation
-`MyAwesomeComponent/MyAwesomeComponent.test.tsx` Holds the component's tests - if applicable
-`MyAwesomeComponent/MyAwesomeComponent.tsx` Holds the component's implementation
-
-> If the component has a special (_snowflake_) case/variation, it's best advised to implement as separate component within the same folder (e.g. `<Button />` and `<IconButton />`)
-
-# Consumption
-
-#### Components
-
-Import individual components from tailwind as you need them.
-
-#### Styling
-
-Taco uses tailwind, but does not process its css before exporting. It exports css _with_ tailwind commands present - you must process the stylesheet with tailwind yourself.
-
-Browser targeting, purging and minification should be performed _by the consumer_.
-
-Your postcss config probably looks something like this:
-
-```js
-module.exports = {
-    plugins: ['tailwindcss', 'autoprefixer'],
-};
-```
-
-Your `tailwind.config.js` should look something like this:
-
-```js
-const tailwindConfig = require('@economic/taco/tailwind.config.js');
-
-module.exports = {
-    presets: [require('@economic/taco/tailwind.config.js'))],
-    content: {
-        files: ['../src/**/*.{mdx,tsx}', './node_modules/@economic/taco/dist/taco.esm.js'],
-    },
-};
-```
-
-You should then import the taco stylesheet in your application:
-
-```css
-import '@economic/taco/dist/index.css';
-```
+[![Build Status](https://travis-ci.com/e-conomic/taco.svg?token=YDzqGqegnmo39NdayXBd&branch=master)](https://travis-ci.com/e-conomic/taco)
+
+# @economic/taco
+
+> UI React component library
+
+## Usage
+
+```bash
+npm install @economic/taco
+```
+
+```javascript
+import { Button } from '@economic/taco';
+
+const MyComponent = () => <Button>Tada!</Button>;
+```
+
+## Development
+
+### Guidelines for new components
+
+Start by creating a folder under `src/` with the name of the component, e.g. `<MyAwesomeComponent />`:
+
+```
+src/
+├── ...
+├── components
+│   ├── MyAwesomeComponent
+│   │   ├── MyAwesomeComponent.css
+│   │   ├── MyAwesomeComponent.mdx
+│   │   ├── MyAwesomeComponent.test.tsx
+│   │   ├── MyAwesomeComponent.tsx
+├── index.tsx
+└── ...
+```
+
+Conceptually, the component's style, implementation, tests & documentation are co-located in its own folder.
+
+`MyAwesomeComponent/MyAwesomeComponent.css` Holds the component's style, directly imported in the implementation
+`MyAwesomeComponent/MyAwesomeComponent.mdx` Holds the component's documentation
+`MyAwesomeComponent/MyAwesomeComponent.test.tsx` Holds the component's tests - if applicable
+`MyAwesomeComponent/MyAwesomeComponent.tsx` Holds the component's implementation
+
+> If the component has a special (_snowflake_) case/variation, it's best advised to implement as separate component within the same folder (e.g. `<Button />` and `<IconButton />`)
+
+# Consumption
+
+#### Components
+
+Import individual components from tailwind as you need them.
+
+#### Styling
+
+Taco uses tailwind, but does not process its css before exporting. It exports css _with_ tailwind commands present - you must process the stylesheet with tailwind yourself.
+
+Browser targeting, purging and minification should be performed _by the consumer_.
+
+Your postcss config probably looks something like this:
+
+```js
+module.exports = {
+    plugins: ['tailwindcss', 'autoprefixer'],
+};
+```
+
+Your `tailwind.config.js` should look something like this:
+
+```js
+const tailwindConfig = require('@economic/taco/tailwind.config.js');
+
+module.exports = {
+    presets: [require('@economic/taco/tailwind.config.js'))],
+    content: {
+        files: ['../src/**/*.{mdx,tsx}', './node_modules/@economic/taco/dist/taco.esm.js'],
+    },
+};
+```
+
+You should then import the taco stylesheet in your application:
+
+```css
+import '@economic/taco/dist/index.css';
+```

package/dist/components/Combobox/Combobox.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { InputProps } from '../Input/Input';
 import { ScrollableListItem, ScrollableListItemValue } from '../Listbox/ScrollableList';
-import { State } from '../../types';
 import './Combobox.css';
 import { DialogProps } from '../Dialog/Dialog';
 export declare type ComboboxTexts = {
@@ -32,8 +31,6 @@ declare type ComboboxBaseProps = Omit<InputProps, 'defaultValue' | 'button' | 'o
     onChange?: React.ChangeEventHandler<HTMLInputElement>;
     /** Handler called when the user enters a query **/
     onSearch?: (query: string) => void | Promise<void>;
-    /** State will change the style of the combobox **/
-    state?: State;
     /** Value of the input in combobox */
     value?: ComboboxValue;
 };

package/dist/components/Field/Field.d.ts

@@ -1,29 +1,26 @@
 import * as React from 'react';
-import { State } from '../../types';
 import './Field.css';
 export declare type FieldProps = React.LabelHTMLAttributes<HTMLLabelElement> & {
     /** Content of the field */
     children: React.ReactNode;
     /**	Changes the style to indicate the element is disabled */
     disabled?: boolean;
+    invalid?: boolean;
     /**
      * Text displayed below the children of Field.
      * Should be a short text that indicates feedback for user.
      */
     message?: string;
-    /** State will change the style of the field */
-    state?: State;
 };
 export declare const Field: React.ForwardRefExoticComponent<React.LabelHTMLAttributes<HTMLLabelElement> & {
     /** Content of the field */
     children: React.ReactNode;
     /**	Changes the style to indicate the element is disabled */
     disabled?: boolean | undefined;
+    invalid?: boolean | undefined;
     /**
      * Text displayed below the children of Field.
      * Should be a short text that indicates feedback for user.
      */
     message?: string | undefined;
-    /** State will change the style of the field */
-    state?: "default" | "success" | "error" | "warning" | "information" | undefined;
 } & React.RefAttributes<HTMLLabelElement>>;

package/dist/components/Input/Input.d.ts

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { State } from '../../types';
 import { IconName } from '../Icon/Icon';
 export declare type InputProps = React.InputHTMLAttributes<HTMLInputElement> & {
     /** Shows a button within the input field */
@@ -8,8 +7,7 @@ export declare type InputProps = React.InputHTMLAttributes<HTMLInputElement> & {
     icon?: IconName | JSX.Element;
     /** Draws attention to the input by changing its style and making it visually prominent */
     highlighted?: boolean;
-    /** State will change the style of the input **/
-    state?: State;
+    invalid?: boolean;
 };
 export declare const Input: React.ForwardRefExoticComponent<React.InputHTMLAttributes<HTMLInputElement> & {
     /** Shows a button within the input field */
@@ -18,6 +16,5 @@ export declare const Input: React.ForwardRefExoticComponent<React.InputHTMLAttri
     icon?: "account-preview" | "accounting-year-cancel" | "accounting-year" | "accounting" | "arrow-bottom" | "arrow-down" | "arrow-end" | "arrow-left" | "arrow-right" | "arrow-start" | "arrow-top" | "arrow-up" | "attach-auto" | "attach-cancel" | "attach" | "autotext-insert" | "autotext" | "basic-tabs" | "basic" | "bell-solid" | "book" | "booking" | "budget" | "calendar" | "cash-account" | "cash-reports" | "chat-solid" | "chat" | "chevron-down-double" | "chevron-down-solid" | "chevron-down" | "chevron-left-double" | "chevron-left" | "chevron-right-double" | "chevron-right" | "chevron-up-double" | "chevron-up-solid" | "chevron-up" | "clamp-open" | "clamp" | "close" | "connection-enable" | "connection-revoke" | "contacts" | "copy" | "courses" | "credit" | "delete-permanently" | "delete" | "depecriate" | "developer" | "distribution-template" | "document-approve" | "document-create-entry" | "document-cut" | "document-error" | "document-isolate-page" | "document-merge" | "document-move" | "document-preview" | "document-received" | "document-rejected-request" | "document-split" | "document-time" | "document" | "download" | "drag" | "e-copedia" | "e-signature" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "entries-on-account" | "entries-open" | "entries-warning" | "entry-type-customer-invoice" | "entry-type-customer-payment" | "entry-type-journal-entry" | "entry-type-manual-customer-invoice" | "entry-type-supplier-invoice" | "entry-type-supplier-payment" | "envelope-approved" | "envelope" | "expand-view" | "expenses" | "export-to-excel" | "export-to-pdf" | "export" | "filter-solid" | "filter" | "graph-solid" | "hash" | "home" | "images" | "import" | "inbox-einvoicing" | "inbox-scanning" | "inbox-smart" | "inbox" | "info" | "inventory-matrix" | "inventory" | "journal-pro" | "layout-both" | "layout-first" | "layout-last" | "layout-none" | "layout" | "ledger-card-customer-reminder" | "ledger-card-manual-customer-invoice" | "ledger-card-obsolete-stock" | "ledger-card-opening-entry" | "ledger-card-reserved-entry" | "ledger-card-shrinkage-pilferage" | "ledger-card-stock-adjustment" | "ledger-card-transferred-opening-entry" | "ledger-card" | "lightbulb" | "line" | "list-bulleted" | "list-search" | "list" | "lock-open" | "log" | "market" | "match-amount" | "match-entries" | "mileage" | "minus" | "modal-resize" | "modal-shrink" | "more-solid" | "more" | "move" | "navigation-list" | "note-follow-up" | "note-read" | "note" | "partner-api" | "period" | "person-change" | "person-minus" | "person-plus" | "person-tick" | "play" | "plus-circle" | "plus-minus" | "print" | "process-payment" | "product-ledger-card" | "project-cards" | "projects" | "quicklinks" | "rating-bankruptcy" | "rating-payment-problems" | "reconciled" | "refresh" | "report-solid" | "report" | "restore" | "rotate-left" | "rotate-right" | "sales" | "search-bold" | "search" | "secure-tick" | "secure" | "settings-solid" | "settings" | "shortcuts" | "show-all" | "show-less" | "show-more" | "show-template" | "sliders" | "smartpay" | "sort-by" | "spinner" | "star-solid" | "star" | "subscriptions" | "system-entries" | "tag" | "template-override" | "templates" | "thumb-both" | "thumb-down-solid" | "thumb-down" | "thumb-up-solid" | "thumb-up" | "tick-circle" | "tick" | "time" | "transfer-cancel" | "transfer-locked" | "transfer" | "undock" | "unreconciled" | "warning" | "webshop" | "website" | "workflow" | "zoom" | JSX.Element | undefined;
     /** Draws attention to the input by changing its style and making it visually prominent */
     highlighted?: boolean | undefined;
-    /** State will change the style of the input **/
-    state?: "warning" | "default" | "success" | "error" | "information" | undefined;
+    invalid?: boolean | undefined;
 } & React.RefAttributes<HTMLInputElement>>;

package/dist/components/Input/util.d.ts

@@ -1,4 +1,2 @@
-import { State } from '../../types';
 export declare const getInputClasses: (props: any) => string;
-export declare const getStateClasses: (value: State | undefined) => string;
-export declare const getButtonStateClasses: (value: State | undefined) => string;
+export declare const getButtonStateClasses: (invalid: boolean | undefined) => string;

package/dist/components/Listbox/Listbox.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { ScrollableListItemValue, ScrollableListItem } from './ScrollableList';
-import { State } from '../../types';
 export declare type ListboxItem = ScrollableListItem;
 export declare type ListboxValue = ScrollableListItemValue;
 export declare type ListboxTexts = {
@@ -33,13 +32,12 @@ export declare type ListboxProps = Pick<React.InputHTMLAttributes<HTMLInputEleme
     emptyValue?: ListboxValue;
     /** Draws attention to the listbox by changing its style and making it visually prominent */
     highlighted?: boolean;
+    invalid?: boolean;
     /**
      * Shows a loading indicator with a text next to it.
      * Read more about how to provide the text in [Provider](component:provider) component
      */
     loading?: boolean;
-    /** State will change the style of the listbox */
-    state?: State;
     /**
      * Value of the listbox representing the selected item.
      * It needs to be an existing value from the provided data
@@ -59,13 +57,12 @@ export declare const Listbox: React.ForwardRefExoticComponent<Pick<React.InputHT
     emptyValue?: string | number | boolean | null | undefined;
     /** Draws attention to the listbox by changing its style and making it visually prominent */
     highlighted?: boolean | undefined;
+    invalid?: boolean | undefined;
     /**
      * Shows a loading indicator with a text next to it.
      * Read more about how to provide the text in [Provider](component:provider) component
      */
     loading?: boolean | undefined;
-    /** State will change the style of the listbox */
-    state?: "default" | "success" | "error" | "warning" | "information" | undefined;
     /**
      * Value of the listbox representing the selected item.
      * It needs to be an existing value from the provided data
@@ -85,13 +82,12 @@ export declare const MultiListbox: React.ForwardRefExoticComponent<Pick<React.In
     emptyValue?: string | number | boolean | null | undefined;
     /** Draws attention to the listbox by changing its style and making it visually prominent */
     highlighted?: boolean | undefined;
+    invalid?: boolean | undefined;
     /**
      * Shows a loading indicator with a text next to it.
      * Read more about how to provide the text in [Provider](component:provider) component
      */
     loading?: boolean | undefined;
-    /** State will change the style of the listbox */
-    state?: "default" | "success" | "error" | "warning" | "information" | undefined;
     /**
      * Value of the listbox representing the selected item.
      * It needs to be an existing value from the provided data

package/dist/components/Listbox/ScrollableList.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import './ScrollableList.css';
-import { State } from '../../types';
 export declare type ScrollableListItemValue = string | number | boolean | null;
 export declare type ScrollableListItem = {
     /**
@@ -29,6 +28,7 @@ export declare type ScrollableListProps = Omit<React.HTMLAttributes<HTMLUListEle
     highlighted?: boolean;
     /** Set an id for the scrollable list */
     id: string;
+    invalid?: boolean;
     /**
      * Shows a loading indicator with a text next to it.
      * Read more about how to provide the text in `Provider` component.
@@ -49,8 +49,6 @@ export declare type ScrollableListProps = Omit<React.HTMLAttributes<HTMLUListEle
     /** Handler called when a key is pressed */
     onKeyDown?: (event: React.KeyboardEvent<HTMLUListElement>, index: number | undefined) => void;
     readOnly?: boolean;
-    /** State will change the style of the scrollable list */
-    state?: State;
     /**
      * Value of the scrollable list representing the selected item.
      * It needs to be an existing value from the provided data.
@@ -81,6 +79,7 @@ export declare const ScrollableList: React.ForwardRefExoticComponent<Pick<React.
     highlighted?: boolean | undefined;
     /** Set an id for the scrollable list */
     id: string;
+    invalid?: boolean | undefined;
     /**
      * Shows a loading indicator with a text next to it.
      * Read more about how to provide the text in `Provider` component.
@@ -101,8 +100,6 @@ export declare const ScrollableList: React.ForwardRefExoticComponent<Pick<React.
     /** Handler called when a key is pressed */
     onKeyDown?: ((event: React.KeyboardEvent<HTMLUListElement>, index: number | undefined) => void) | undefined;
     readOnly?: boolean | undefined;
-    /** State will change the style of the scrollable list */
-    state?: "default" | "success" | "error" | "warning" | "information" | undefined;
     /**
      * Value of the scrollable list representing the selected item.
      * It needs to be an existing value from the provided data.

package/dist/components/Listbox/useListbox.d.ts

@@ -5,5 +5,5 @@ declare type useListbox = {
     list: ScrollableListProps;
     input: Omit<React.HTMLAttributes<HTMLInputElement>, 'defaultValue'>;
 };
-export declare const useListbox: ({ data: externalData, defaultValue, disabled, emptyValue, id: nativeId, name, onChange, onFocus, onKeyDown, value, ...otherProps }: ListboxProps, ref: React.Ref<HTMLInputElement>) => useListbox;
+export declare const useListbox: ({ data: externalData, defaultValue, disabled, emptyValue, id: nativeId, invalid, name, onChange, onFocus, onKeyDown, value, ...otherProps }: ListboxProps, ref: React.Ref<HTMLInputElement>) => useListbox;
 export {};

package/dist/components/Select/Select.d.ts

@@ -23,7 +23,7 @@ export declare type SelectProps = BaseSelectProps & {
      */
     editable?: boolean;
 };
-export declare const Select: React.ForwardRefExoticComponent<Pick<ListboxProps, "onChange" | "onFocus" | "defaultValue" | "value" | "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "disabled" | "enterKeyHint" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "placeholder" | "readOnly" | "required" | "size" | "src" | "step" | "type" | "width" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "data" | "emptyValue" | "highlighted" | "loading" | "state"> & Pick<ComboboxProps, "onChange" | "onFocus" | "defaultValue" | "value" | "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "disabled" | "enterKeyHint" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "placeholder" | "readOnly" | "required" | "size" | "src" | "step" | "type" | "width" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "dialog" | "data" | "emptyValue" | "highlighted" | "loading" | "state" | "icon" | "onSearch"> & {
+export declare const Select: React.ForwardRefExoticComponent<Pick<ListboxProps, "onChange" | "onFocus" | "defaultValue" | "value" | "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "disabled" | "enterKeyHint" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "placeholder" | "readOnly" | "required" | "size" | "src" | "step" | "type" | "width" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "data" | "emptyValue" | "highlighted" | "invalid" | "loading"> & Pick<ComboboxProps, "onChange" | "onFocus" | "defaultValue" | "value" | "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "disabled" | "enterKeyHint" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "placeholder" | "readOnly" | "required" | "size" | "src" | "step" | "type" | "width" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "dialog" | "data" | "emptyValue" | "highlighted" | "invalid" | "loading" | "icon" | "onSearch"> & {
     /**
      * Allows to select multiple values.
      * All the selected values will be combined in a comma-seperated string as the value of the input.

package/dist/components/Textarea/Textarea.d.ts

@@ -1,18 +1,15 @@
 import * as React from 'react';
-import { State } from '../../types';
 export declare type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
     /** Draws attention to the textarea by changing its style and making it visually prominent */
     highlighted?: boolean;
-    /** State will change the style of the textarea **/
-    state?: State;
+    invalid?: boolean;
     /** Value of the textarea */
     value?: string;
 };
 export declare const Textarea: React.ForwardRefExoticComponent<React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
     /** Draws attention to the textarea by changing its style and making it visually prominent */
     highlighted?: boolean | undefined;
-    /** State will change the style of the textarea **/
-    state?: "default" | "success" | "error" | "warning" | "information" | undefined;
+    invalid?: boolean | undefined;
     /** Value of the textarea */
     value?: string | undefined;
 } & React.RefAttributes<HTMLTextAreaElement>>;

package/dist/esm/_virtual/_rollupPluginBabelHelpers.js

@@ -1,3 +1,21 @@
+function _extends() {
+  _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends.apply(this, arguments);
+}
+
 function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null) return {};
   var target = {};
@@ -13,5 +31,5 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   return target;
 }
 
-export { _objectWithoutPropertiesLoose as objectWithoutPropertiesLoose };
+export { _extends as extends, _objectWithoutPropertiesLoose as objectWithoutPropertiesLoose };
 //# sourceMappingURL=_rollupPluginBabelHelpers.js.map

package/dist/esm/_virtual/_rollupPluginBabelHelpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"_rollupPluginBabelHelpers.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"_rollupPluginBabelHelpers.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/components/Accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sources":["../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\nimport * as AccordionPrimitive from '@radix-ui/react-accordion';\r\nimport { Icon } from '../Icon/Icon';\r\n\r\ntype AccordionContext = {\r\n    as: 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\r\n};\r\nconst AccordionContext = React.createContext<AccordionContext>({\r\n    as: 'h2',\r\n});\r\n\r\nexport type AccordionTriggerProps = React.HTMLAttributes<HTMLElement>;\r\n\r\nconst StyledTrigger = React.forwardRef(function AccordionStyledTrigger(\r\n    props: AccordionPrimitive.AccordionTriggerProps,\r\n    ref: React.Ref<HTMLButtonElement>\r\n) {\r\n    const isExpanded = !!props['aria-expanded'];\r\n\r\n    const className = cn(\r\n        'w-full inline-flex justify-between items-center align-middle',\r\n        'focus:rounded-sm focus:border-blue focus:yt-focus',\r\n        props.className\r\n    );\r\n\r\n    return (\r\n        <button {...props} ref={ref} className={className}>\r\n            {props.children}\r\n            <Icon name={isExpanded ? 'chevron-up' : 'chevron-down'} />\r\n        </button>\r\n    );\r\n});\r\n\r\nconst Trigger = React.forwardRef(function AccordionTrigger(props: AccordionTriggerProps, ref: React.Ref<HTMLButtonElement>) {\r\n    const { children } = props;\r\n    const { as: Heading } = React.useContext(AccordionContext);\r\n\r\n    return (\r\n        <AccordionPrimitive.Header asChild>\r\n            <Heading className=\"my-3\">\r\n                <AccordionPrimitive.Trigger ref={ref} asChild>\r\n                    <StyledTrigger>{children}</StyledTrigger>\r\n                </AccordionPrimitive.Trigger>\r\n            </Heading>\r\n        </AccordionPrimitive.Header>\r\n    );\r\n});\r\n\r\nexport type AccordionContentProps = React.HTMLAttributes<HTMLElement>;\r\nconst Content = React.forwardRef(function AccordionContent(props: AccordionContentProps, ref: React.Ref<HTMLDivElement>) {\r\n    return <AccordionPrimitive.Content {...props} ref={ref} />;\r\n});\r\n\r\nexport type AccordionItemProps = React.HTMLAttributes<HTMLDivElement> & {\r\n    id: string;\r\n    disabled?: boolean;\r\n};\r\nconst Item = (props: AccordionItemProps) => {\r\n    const { id, ...otherProps } = props;\r\n    return <AccordionPrimitive.Item {...otherProps} value={id} />;\r\n};\r\n\r\ntype AccordionBaseProps = {\r\n    children: React.ReactNode[];\r\n\r\n    /** Change what heading element accordion regions will render */\r\n    as?: 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\r\n\r\n    /** Additional classes for Accordion root element */\r\n    className?: string;\r\n};\r\n\r\nexport interface AccordionUncontrolledProps extends AccordionBaseProps {\r\n    /** Default expanded accordion(s) */\r\n    defaultId: string | string[];\r\n\r\n    id?: never;\r\n    onChange?: never;\r\n}\r\n\r\nexport interface AccordionMultipleControlledProps extends AccordionBaseProps {\r\n    /** Expanded accordions */\r\n    id: string[];\r\n\r\n    /** onChange function to receive ids of expanded accordions */\r\n    onChange: (id: string[]) => void;\r\n\r\n    defaultId?: never;\r\n}\r\nexport interface AccordionSingleControlledProps extends AccordionBaseProps {\r\n    /** Expanded accordion */\r\n    id: string;\r\n\r\n    /** onChange function to receive id of expanded accordion */\r\n    onChange: (id: string) => void;\r\n\r\n    defaultId?: never;\r\n}\r\n\r\nexport type AccordionProps = AccordionUncontrolledProps | AccordionMultipleControlledProps | AccordionSingleControlledProps;\r\n\r\nexport const Accordion = (props: AccordionProps) => {\r\n    const { id, defaultId, onChange, as = 'h2', ...otherProps } = props;\r\n    const context = React.useMemo(() => ({ as }), [as]);\r\n\r\n    let valueProps;\r\n\r\n    if (defaultId) {\r\n        valueProps = {\r\n            defaultValue: defaultId || undefined,\r\n        };\r\n    } else {\r\n        valueProps = {\r\n            onValueChange: onChange,\r\n            value: id || undefined,\r\n        };\r\n    }\r\n\r\n    const type = Array.isArray(valueProps.defaultValue) || Array.isArray(valueProps.value) ? 'multiple' : 'single';\r\n    const className = cn('divide-y divide-grey', props.className);\r\n\r\n    return (\r\n        <AccordionContext.Provider value={context}>\r\n            <AccordionPrimitive.Root {...otherProps} {...valueProps} data-taco=\"accordion\" className={className} type={type} />\r\n        </AccordionContext.Provider>\r\n    );\r\n};\r\n\r\nAccordion.Item = Item;\r\nAccordion.Trigger = Trigger;\r\nAccordion.Content = Content;\r\n"],"names":["AccordionContext","React","createContext","as","StyledTrigger","forwardRef","AccordionStyledTrigger","props","ref","isExpanded","className","cn","children","Icon","name","Trigger","AccordionTrigger","useContext","Heading","AccordionPrimitive","asChild","Content","AccordionContent","Item","id","otherProps","value","Accordion","defaultId","onChange","context","useMemo","valueProps","defaultValue","undefined","onValueChange","type","Array","isArray","Provider"],"mappings":"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"}
+{"version":3,"file":"Accordion.js","sources":["../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport * as AccordionPrimitive from '@radix-ui/react-accordion';\nimport { Icon } from '../Icon/Icon';\n\ntype AccordionContext = {\n    as: 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n};\nconst AccordionContext = React.createContext<AccordionContext>({\n    as: 'h2',\n});\n\nexport type AccordionTriggerProps = React.HTMLAttributes<HTMLElement>;\n\nconst StyledTrigger = React.forwardRef(function AccordionStyledTrigger(\n    props: AccordionPrimitive.AccordionTriggerProps,\n    ref: React.Ref<HTMLButtonElement>\n) {\n    const isExpanded = !!props['aria-expanded'];\n\n    const className = cn(\n        'w-full inline-flex justify-between items-center align-middle',\n        'focus:rounded-sm focus:border-blue focus:yt-focus',\n        props.className\n    );\n\n    return (\n        <button {...props} ref={ref} className={className}>\n            {props.children}\n            <Icon name={isExpanded ? 'chevron-up' : 'chevron-down'} />\n        </button>\n    );\n});\n\nconst Trigger = React.forwardRef(function AccordionTrigger(props: AccordionTriggerProps, ref: React.Ref<HTMLButtonElement>) {\n    const { children } = props;\n    const { as: Heading } = React.useContext(AccordionContext);\n\n    return (\n        <AccordionPrimitive.Header asChild>\n            <Heading className=\"my-3\">\n                <AccordionPrimitive.Trigger ref={ref} asChild>\n                    <StyledTrigger>{children}</StyledTrigger>\n                </AccordionPrimitive.Trigger>\n            </Heading>\n        </AccordionPrimitive.Header>\n    );\n});\n\nexport type AccordionContentProps = React.HTMLAttributes<HTMLElement>;\nconst Content = React.forwardRef(function AccordionContent(props: AccordionContentProps, ref: React.Ref<HTMLDivElement>) {\n    return <AccordionPrimitive.Content {...props} ref={ref} />;\n});\n\nexport type AccordionItemProps = React.HTMLAttributes<HTMLDivElement> & {\n    id: string;\n    disabled?: boolean;\n};\nconst Item = (props: AccordionItemProps) => {\n    const { id, ...otherProps } = props;\n    return <AccordionPrimitive.Item {...otherProps} value={id} />;\n};\n\ntype AccordionBaseProps = {\n    children: React.ReactNode[];\n\n    /** Change what heading element accordion regions will render */\n    as?: 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\n    /** Additional classes for Accordion root element */\n    className?: string;\n};\n\nexport interface AccordionUncontrolledProps extends AccordionBaseProps {\n    /** Default expanded accordion(s) */\n    defaultId: string | string[];\n\n    id?: never;\n    onChange?: never;\n}\n\nexport interface AccordionMultipleControlledProps extends AccordionBaseProps {\n    /** Expanded accordions */\n    id: string[];\n\n    /** onChange function to receive ids of expanded accordions */\n    onChange: (id: string[]) => void;\n\n    defaultId?: never;\n}\nexport interface AccordionSingleControlledProps extends AccordionBaseProps {\n    /** Expanded accordion */\n    id: string;\n\n    /** onChange function to receive id of expanded accordion */\n    onChange: (id: string) => void;\n\n    defaultId?: never;\n}\n\nexport type AccordionProps = AccordionUncontrolledProps | AccordionMultipleControlledProps | AccordionSingleControlledProps;\n\nexport const Accordion = (props: AccordionProps) => {\n    const { id, defaultId, onChange, as = 'h2', ...otherProps } = props;\n    const context = React.useMemo(() => ({ as }), [as]);\n\n    let valueProps;\n\n    if (defaultId) {\n        valueProps = {\n            defaultValue: defaultId || undefined,\n        };\n    } else {\n        valueProps = {\n            onValueChange: onChange,\n            value: id || undefined,\n        };\n    }\n\n    const type = Array.isArray(valueProps.defaultValue) || Array.isArray(valueProps.value) ? 'multiple' : 'single';\n    const className = cn('divide-y divide-grey', props.className);\n\n    return (\n        <AccordionContext.Provider value={context}>\n            <AccordionPrimitive.Root {...otherProps} {...valueProps} data-taco=\"accordion\" className={className} type={type} />\n        </AccordionContext.Provider>\n    );\n};\n\nAccordion.Item = Item;\nAccordion.Trigger = Trigger;\nAccordion.Content = Content;\n"],"names":["AccordionContext","React","createContext","as","StyledTrigger","forwardRef","AccordionStyledTrigger","props","ref","isExpanded","className","cn","children","Icon","name","Trigger","AccordionTrigger","useContext","Heading","AccordionPrimitive","asChild","Content","AccordionContent","Item","id","otherProps","value","Accordion","defaultId","onChange","context","useMemo","valueProps","defaultValue","undefined","onValueChange","type","Array","isArray","Provider"],"mappings":";;;;;;;;AAQA,IAAMA,gBAAgB,gBAAGC,cAAK,CAACC,aAAN,CAAsC;AAC3DC,EAAAA,EAAE,EAAE;AADuD,CAAtC,CAAzB;AAMA,IAAMC,aAAa,gBAAGH,cAAK,CAACI,UAAN,CAAiB,SAASC,sBAAT,CACnCC,KADmC,EAEnCC,GAFmC;AAInC,MAAMC,UAAU,GAAG,CAAC,CAACF,KAAK,CAAC,eAAD,CAA1B;AAEA,MAAMG,SAAS,GAAGC,EAAE,CAChB,8DADgB,EAEhB,mDAFgB,EAGhBJ,KAAK,CAACG,SAHU,CAApB;AAMA,SACIT,4BAAA,SAAA,oBAAYM;AAAOC,IAAAA,GAAG,EAAEA;AAAKE,IAAAA,SAAS,EAAEA;IAAxC,EACKH,KAAK,CAACK,QADX,EAEIX,4BAAA,CAACY,IAAD;AAAMC,IAAAA,IAAI,EAAEL,UAAU,GAAG,YAAH,GAAkB;GAAxC,CAFJ,CADJ;AAMH,CAlBqB,CAAtB;AAoBA,IAAMM,OAAO,gBAAGd,cAAK,CAACI,UAAN,CAAiB,SAASW,gBAAT,CAA0BT,KAA1B,EAAwDC,GAAxD;AAC7B,MAAQI,QAAR,GAAqBL,KAArB,CAAQK,QAAR;;AACA,0BAAwBX,cAAK,CAACgB,UAAN,CAAiBjB,gBAAjB,CAAxB;AAAA,MAAYkB,OAAZ,qBAAQf,EAAR;;AAEA,SACIF,4BAAA,CAACkB,MAAD;AAA2BC,IAAAA,OAAO;GAAlC,EACInB,4BAAA,CAACiB,OAAD;AAASR,IAAAA,SAAS,EAAC;GAAnB,EACIT,4BAAA,CAACkB,SAAD;AAA4BX,IAAAA,GAAG,EAAEA;AAAKY,IAAAA,OAAO;GAA7C,EACInB,4BAAA,CAACG,aAAD,MAAA,EAAgBQ,QAAhB,CADJ,CADJ,CADJ,CADJ;AASH,CAbe,CAAhB;AAgBA,IAAMS,OAAO,gBAAGpB,cAAK,CAACI,UAAN,CAAiB,SAASiB,gBAAT,CAA0Bf,KAA1B,EAAwDC,GAAxD;AAC7B,SAAOP,4BAAA,CAACkB,SAAD,oBAAgCZ;AAAOC,IAAAA,GAAG,EAAEA;IAA5C,CAAP;AACH,CAFe,CAAhB;;AAQA,IAAMe,IAAI,GAAG,SAAPA,IAAO,CAAChB,KAAD;AACT,MAAQiB,EAAR,GAA8BjB,KAA9B,CAAQiB,EAAR;AAAA,MAAeC,UAAf,iCAA8BlB,KAA9B;;AACA,SAAON,4BAAA,CAACkB,MAAD,oBAA6BM;AAAYC,IAAAA,KAAK,EAAEF;IAAhD,CAAP;AACH,CAHD;;IA4CaG,SAAS,GAAG,SAAZA,SAAY,CAACpB,KAAD;AACrB,MAAQiB,EAAR,GAA8DjB,KAA9D,CAAQiB,EAAR;AAAA,MAAYI,SAAZ,GAA8DrB,KAA9D,CAAYqB,SAAZ;AAAA,MAAuBC,QAAvB,GAA8DtB,KAA9D,CAAuBsB,QAAvB;AAAA,kBAA8DtB,KAA9D,CAAiCJ,EAAjC;AAAA,MAAiCA,EAAjC,0BAAsC,IAAtC;AAAA,MAA+CsB,UAA/C,iCAA8DlB,KAA9D;;AACA,MAAMuB,OAAO,GAAG7B,cAAK,CAAC8B,OAAN,CAAc;AAAA,WAAO;AAAE5B,MAAAA,EAAE,EAAFA;AAAF,KAAP;AAAA,GAAd,EAA8B,CAACA,EAAD,CAA9B,CAAhB;AAEA,MAAI6B,UAAJ;;AAEA,MAAIJ,SAAJ,EAAe;AACXI,IAAAA,UAAU,GAAG;AACTC,MAAAA,YAAY,EAAEL,SAAS,IAAIM;AADlB,KAAb;AAGH,GAJD,MAIO;AACHF,IAAAA,UAAU,GAAG;AACTG,MAAAA,aAAa,EAAEN,QADN;AAETH,MAAAA,KAAK,EAAEF,EAAE,IAAIU;AAFJ,KAAb;AAIH;;AAED,MAAME,IAAI,GAAGC,KAAK,CAACC,OAAN,CAAcN,UAAU,CAACC,YAAzB,KAA0CI,KAAK,CAACC,OAAN,CAAcN,UAAU,CAACN,KAAzB,CAA1C,GAA4E,UAA5E,GAAyF,QAAtG;AACA,MAAMhB,SAAS,GAAGC,EAAE,CAAC,sBAAD,EAAyBJ,KAAK,CAACG,SAA/B,CAApB;AAEA,SACIT,4BAAA,CAACD,gBAAgB,CAACuC,QAAlB;AAA2Bb,IAAAA,KAAK,EAAEI;GAAlC,EACI7B,4BAAA,CAACkB,IAAD,oBAA6BM,YAAgBO;iBAAsB;AAAYtB,IAAAA,SAAS,EAAEA;AAAW0B,IAAAA,IAAI,EAAEA;IAA3G,CADJ,CADJ;AAKH;AAEDT,SAAS,CAACJ,IAAV,GAAiBA,IAAjB;AACAI,SAAS,CAACZ,OAAV,GAAoBA,OAApB;AACAY,SAAS,CAACN,OAAV,GAAoBA,OAApB;;;;"}

package/dist/esm/components/Backdrop/Backdrop.js.map

@@ -1 +1 @@
-{"version":3,"file":"Backdrop.js","sources":["../../../../src/components/Backdrop/Backdrop.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\n\r\nexport type BackdropProps = React.HTMLAttributes<HTMLDivElement>;\r\n\r\nexport const Backdrop = React.forwardRef<HTMLDivElement, BackdropProps>(function Backdrop(props, ref) {\r\n    const className = cn(\r\n        'fixed inset-0 cursor-default overflow-y-auto bg-[rgba(50,46,62,0.8)] aria-hidden:hidden z-[996]',\r\n        props.className\r\n    );\r\n\r\n    return <div {...props} className={className} ref={ref} />;\r\n});\r\n"],"names":["Backdrop","React","props","ref","className","cn"],"mappings":";;;IAKaA,QAAQ,gBAAGC,UAAA,CAAgD,SAASD,QAAT,CAAkBE,KAAlB,EAAyBC,GAAzB;AACpE,MAAMC,SAAS,GAAGC,EAAE,CAChB,iGADgB,EAEhBH,KAAK,CAACE,SAFU,CAApB;AAKA,SAAOH,aAAA,MAAA,oBAASC;AAAOE,IAAAA,SAAS,EAAEA;AAAWD,IAAAA,GAAG,EAAEA;IAA3C,CAAP;AACH,CAPuB;;;;"}
+{"version":3,"file":"Backdrop.js","sources":["../../../../src/components/Backdrop/Backdrop.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\n\nexport type BackdropProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const Backdrop = React.forwardRef<HTMLDivElement, BackdropProps>(function Backdrop(props, ref) {\n    const className = cn(\n        'fixed inset-0 cursor-default overflow-y-auto bg-[rgba(50,46,62,0.8)] aria-hidden:hidden z-[996]',\n        props.className\n    );\n\n    return <div {...props} className={className} ref={ref} />;\n});\n"],"names":["Backdrop","React","props","ref","className","cn"],"mappings":";;;IAKaA,QAAQ,gBAAGC,UAAA,CAAgD,SAASD,QAAT,CAAkBE,KAAlB,EAAyBC,GAAzB;AACpE,MAAMC,SAAS,GAAGC,EAAE,CAChB,iGADgB,EAEhBH,KAAK,CAACE,SAFU,CAApB;AAKA,SAAOH,aAAA,MAAA,oBAASC;AAAOE,IAAAA,SAAS,EAAEA;AAAWD,IAAAA,GAAG,EAAEA;IAA3C,CAAP;AACH,CAPuB;;;;"}

package/dist/esm/components/Badge/Badge.js

@@ -1,22 +1,22 @@
+import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { forwardRef, createElement } from 'react';
 import cn from 'classnames';
 import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';
 import { getOutlineClasses, getStateClasses } from '../../utils/taillwind.js';
 
-const Badge = /*#__PURE__*/forwardRef(function Badge(props, ref) {
-  const {
-    children,
-    compact = false,
-    outline = false,
-    state,
-    ...otherProps
-  } = props;
-  const className = cn('rounded-full border font-bold text-xs uppercase overflow-hidden whitespace-nowrap inline-flex items-center justify-center h-5', {
-    [getOutlineClasses(state)]: outline,
-    [`border-transparent ${getStateClasses(state)}`]: !outline,
-    'h-2 w-2 min-w-0': compact,
-    'h-5 py-0 px-[0.354rem]': !compact
-  }, props.className);
+var _excluded = ["children", "compact", "outline", "state"];
+var Badge = /*#__PURE__*/forwardRef(function Badge(props, ref) {
+  var _cn;
+
+  var children = props.children,
+      _props$compact = props.compact,
+      compact = _props$compact === void 0 ? false : _props$compact,
+      _props$outline = props.outline,
+      outline = _props$outline === void 0 ? false : _props$outline,
+      state = props.state,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded);
+
+  var className = cn('rounded-full border font-bold text-xs uppercase overflow-hidden whitespace-nowrap inline-flex items-center justify-center h-5', (_cn = {}, _cn[getOutlineClasses(state)] = outline, _cn["border-transparent " + getStateClasses(state)] = !outline, _cn['h-2 w-2 min-w-0'] = compact, _cn['h-5 py-0 px-[0.354rem]'] = !compact, _cn), props.className);
   return createElement("span", Object.assign({}, otherProps, {
     "aria-atomic": "true",
     "aria-live": "polite",

package/dist/esm/components/Badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sources":["../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\r\nimport { State } from '../../types';\r\nimport { getStateClasses, getOutlineClasses } from '../../utils/taillwind';\r\nimport './Badge.css';\r\n\r\nexport type BadgeProps = React.HTMLAttributes<HTMLSpanElement> & {\r\n    /** Content should be a numerical value or tag/status like text **/\r\n    children: React.ReactNode;\r\n    /** Show compact version **/\r\n    compact?: boolean;\r\n    /** Show outlined version **/\r\n    outline?: boolean;\r\n    /** State will change the style of the badge **/\r\n    state?: State;\r\n};\r\n\r\nexport const Badge = React.forwardRef(function Badge(props: BadgeProps, ref: React.Ref<HTMLSpanElement>) {\r\n    const { children, compact = false, outline = false, state, ...otherProps } = props;\r\n    const className = cn(\r\n        'rounded-full border font-bold text-xs uppercase overflow-hidden whitespace-nowrap inline-flex items-center justify-center h-5',\r\n        {\r\n            [getOutlineClasses(state)]: outline,\r\n            [`border-transparent ${getStateClasses(state)}`]: !outline,\r\n            'h-2 w-2 min-w-0': compact,\r\n            'h-5 py-0 px-[0.354rem]': !compact, // custom padding keeps single digits in a perfect circle\r\n        },\r\n        props.className\r\n    );\r\n\r\n    return (\r\n        <span\r\n            {...otherProps}\r\n            aria-atomic=\"true\"\r\n            aria-live=\"polite\"\r\n            className={className}\r\n            data-taco=\"badge\"\r\n            ref={ref}\r\n            role=\"status\"\r\n            title={props['aria-label']}\r\n        >\r\n            {compact ? <VisuallyHidden>{children}</VisuallyHidden> : children}\r\n        </span>\r\n    );\r\n});\r\n"],"names":["Badge","React","props","ref","children","compact","outline","state","otherProps","className","cn","getOutlineClasses","getStateClasses","role","title","VisuallyHidden"],"mappings":";;;;;MAkBaA,KAAK,gBAAGC,UAAA,CAAiB,SAASD,KAAT,CAAeE,KAAf,EAAkCC,GAAlC;AAClC,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,OAAO,GAAG,KAAtB;AAA6BC,IAAAA,OAAO,GAAG,KAAvC;AAA8CC,IAAAA,KAA9C;AAAqD,OAAGC;AAAxD,MAAuEN,KAA7E;AACA,QAAMO,SAAS,GAAGC,EAAE,CAChB,+HADgB,EAEhB;AACI,KAACC,iBAAiB,CAACJ,KAAD,CAAlB,GAA4BD,OADhC;AAEI,2BAAuBM,eAAe,CAACL,KAAD,GAAtC,GAAkD,CAACD,OAFvD;AAGI,uBAAmBD,OAHvB;AAII,8BAA0B,CAACA;AAJ/B,GAFgB,EAQhBH,KAAK,CAACO,SARU,CAApB;AAWA,SACIR,aAAA,OAAA,oBACQO;mBACQ;iBACF;AACVC,IAAAA,SAAS,EAAEA;iBACD;AACVN,IAAAA,GAAG,EAAEA;AACLU,IAAAA,IAAI,EAAC;AACLC,IAAAA,KAAK,EAAEZ,KAAK,CAAC,YAAD;IARhB,EAUKG,OAAO,GAAGJ,aAAA,CAACc,cAAD,MAAA,EAAiBX,QAAjB,CAAH,GAAiDA,QAV7D,CADJ;AAcH,CA3BoB;;;;"}
+{"version":3,"file":"Badge.js","sources":["../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport { State } from '../../types';\nimport { getStateClasses, getOutlineClasses } from '../../utils/taillwind';\nimport './Badge.css';\n\nexport type BadgeProps = React.HTMLAttributes<HTMLSpanElement> & {\n    /** Content should be a numerical value or tag/status like text **/\n    children: React.ReactNode;\n    /** Show compact version **/\n    compact?: boolean;\n    /** Show outlined version **/\n    outline?: boolean;\n    /** State will change the style of the badge **/\n    state?: State;\n};\n\nexport const Badge = React.forwardRef(function Badge(props: BadgeProps, ref: React.Ref<HTMLSpanElement>) {\n    const { children, compact = false, outline = false, state, ...otherProps } = props;\n    const className = cn(\n        'rounded-full border font-bold text-xs uppercase overflow-hidden whitespace-nowrap inline-flex items-center justify-center h-5',\n        {\n            [getOutlineClasses(state)]: outline,\n            [`border-transparent ${getStateClasses(state)}`]: !outline,\n            'h-2 w-2 min-w-0': compact,\n            'h-5 py-0 px-[0.354rem]': !compact, // custom padding keeps single digits in a perfect circle\n        },\n        props.className\n    );\n\n    return (\n        <span\n            {...otherProps}\n            aria-atomic=\"true\"\n            aria-live=\"polite\"\n            className={className}\n            data-taco=\"badge\"\n            ref={ref}\n            role=\"status\"\n            title={props['aria-label']}\n        >\n            {compact ? <VisuallyHidden>{children}</VisuallyHidden> : children}\n        </span>\n    );\n});\n"],"names":["Badge","React","props","ref","children","compact","outline","state","otherProps","className","cn","getOutlineClasses","getStateClasses","role","title","VisuallyHidden"],"mappings":";;;;;;;IAkBaA,KAAK,gBAAGC,UAAA,CAAiB,SAASD,KAAT,CAAeE,KAAf,EAAkCC,GAAlC;;;AAClC,MAAQC,QAAR,GAA6EF,KAA7E,CAAQE,QAAR;AAAA,uBAA6EF,KAA7E,CAAkBG,OAAlB;AAAA,MAAkBA,OAAlB,+BAA4B,KAA5B;AAAA,uBAA6EH,KAA7E,CAAmCI,OAAnC;AAAA,MAAmCA,OAAnC,+BAA6C,KAA7C;AAAA,MAAoDC,KAApD,GAA6EL,KAA7E,CAAoDK,KAApD;AAAA,MAA8DC,UAA9D,iCAA6EN,KAA7E;;AACA,MAAMO,SAAS,GAAGC,EAAE,CAChB,+HADgB,iBAGXC,iBAAiB,CAACJ,KAAD,CAHN,IAGgBD,OAHhB,8BAIWM,eAAe,CAACL,KAAD,CAJ1B,IAIsC,CAACD,OAJvC,MAKZ,iBALY,IAKOD,OALP,MAMZ,wBANY,IAMc,CAACA,OANf,QAQhBH,KAAK,CAACO,SARU,CAApB;AAWA,SACIR,aAAA,OAAA,oBACQO;mBACQ;iBACF;AACVC,IAAAA,SAAS,EAAEA;iBACD;AACVN,IAAAA,GAAG,EAAEA;AACLU,IAAAA,IAAI,EAAC;AACLC,IAAAA,KAAK,EAAEZ,KAAK,CAAC,YAAD;IARhB,EAUKG,OAAO,GAAGJ,aAAA,CAACc,cAAD,MAAA,EAAiBX,QAAjB,CAAH,GAAiDA,QAV7D,CADJ;AAcH,CA3BoB;;;;"}