@economic/taco 0.0.12-alpha.0 → 0.0.13-alpha.0

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

@@ -16,6 +16,7 @@ export declare const Menu: {
         placement?: "right" | "left" | "top" | "bottom" | undefined;
     } & React.RefAttributes<HTMLDivElement>>;
     Item: React.ForwardRefExoticComponent<Pick<React.HTMLAttributes<HTMLDivElement>, "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "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" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "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" | "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?: ((props: Partial<import("../..").DialogProps>) => JSX.Element) | undefined;
         disabled?: boolean | undefined;
         icon?: "time" | "filter" | "line" | "document" | "list" | "log" | "note" | "search" | "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" | "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-copy" | "export-to-excel" | "export" | "filter-solid" | "graph-solid" | "hash" | "home" | "images" | "import" | "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" | "list-bulleted" | "list-search" | "lock-open" | "market" | "match-amount" | "match-entries" | "mileage" | "minus" | "modal-resize" | "modal-shrink" | "more-solid" | "more" | "move" | "navigation-list" | "note-follow-up" | "note-read" | "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" | "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" | "tick-circle" | "tick" | "transfer-cancel" | "transfer-locked" | "transfer" | "undock" | "unreconciled" | "warning" | "webshop" | "website" | "workflow" | "zoom" | undefined;
         onClick?: ((event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void) | undefined;

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';\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((props: AccordionPrimitive.AccordionTriggerProps, ref: React.Ref<HTMLButtonElement>) => {\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((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((props: AccordionContentProps, ref: React.Ref<HTMLDivElement>) => (\n    <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","props","ref","isExpanded","className","cn","children","Icon","name","Trigger","useContext","Heading","AccordionPrimitive","asChild","Content","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';\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((props: AccordionPrimitive.AccordionTriggerProps, ref: React.Ref<HTMLButtonElement>) => {\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((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((props: AccordionContentProps, ref: React.Ref<HTMLDivElement>) => (\r\n    <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","props","ref","isExpanded","className","cn","children","Icon","name","Trigger","useContext","Heading","AccordionPrimitive","asChild","Content","Item","id","otherProps","value","Accordion","defaultId","onChange","context","useMemo","valueProps","defaultValue","undefined","onValueChange","type","Array","isArray","Provider"],"mappings":"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"}

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';\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)] animate-[fade-in_150ms] aria-hidden:hidden',\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,iHADgB,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';\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)] animate-[fade-in_150ms] aria-hidden:hidden',\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,iHADgB,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.map

@@ -1 +1 @@
-{"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;;;;"}
+{"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":";;;;;;;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;;;;"}

package/dist/esm/components/Banner/Banner.js

@@ -13,7 +13,7 @@ var Banner = /*#__PURE__*/forwardRef(function Banner(props, ref) {
     "data-taco": "banner",
     ref: ref
   }, getBannerIcon(state), children, onClose ? createElement(IconButton, {
-    className: "ml-auto",
+    className: "ml-auto -mr-2",
     icon: "close",
     appearance: "discrete",
     onClick: onClose

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

@@ -1 +1 @@
-{"version":3,"file":"Banner.js","sources":["../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { State } from '../../types';\nimport { getBannerIcon } from './util';\nimport { IconButton } from '../IconButton/IconButton';\n\nexport type BannerProps = React.HTMLAttributes<HTMLDivElement> & {\n    /** Content can be any react element, for e.g. a `div` */\n    children: React.ReactNode;\n    /** State will change the icon displayed in banner */\n    state: State;\n    onClose?: () => void;\n};\n\nexport const Banner = React.forwardRef(function Banner(props: BannerProps, ref: React.Ref<HTMLDivElement>) {\n    const { children, state, onClose } = props;\n    const className = cn('bg-white relative flex items-center px-4 h-12 shadow-lg z-10', props.className);\n\n    return (\n        <div className={className} data-taco=\"banner\" ref={ref}>\n            {getBannerIcon(state)}\n            {children}\n            {onClose ? <IconButton className=\"ml-auto\" icon=\"close\" appearance=\"discrete\" onClick={onClose} /> : null}\n        </div>\n    );\n});\n"],"names":["Banner","React","props","ref","children","state","onClose","className","cn","getBannerIcon","IconButton","icon","appearance","onClick"],"mappings":";;;;;IAcaA,MAAM,gBAAGC,UAAA,CAAiB,SAASD,MAAT,CAAgBE,KAAhB,EAAoCC,GAApC;AACnC,MAAQC,QAAR,GAAqCF,KAArC,CAAQE,QAAR;AAAA,MAAkBC,KAAlB,GAAqCH,KAArC,CAAkBG,KAAlB;AAAA,MAAyBC,OAAzB,GAAqCJ,KAArC,CAAyBI,OAAzB;AACA,MAAMC,SAAS,GAAGC,EAAE,CAAC,8DAAD,EAAiEN,KAAK,CAACK,SAAvE,CAApB;AAEA,SACIN,aAAA,MAAA;AAAKM,IAAAA,SAAS,EAAEA;iBAAqB;AAASJ,IAAAA,GAAG,EAAEA;GAAnD,EACKM,aAAa,CAACJ,KAAD,CADlB,EAEKD,QAFL,EAGKE,OAAO,GAAGL,aAAA,CAACS,UAAD;AAAYH,IAAAA,SAAS,EAAC;AAAUI,IAAAA,IAAI,EAAC;AAAQC,IAAAA,UAAU,EAAC;AAAWC,IAAAA,OAAO,EAAEP;GAA5E,CAAH,GAA6F,IAHzG,CADJ;AAOH,CAXqB;;;;"}
+{"version":3,"file":"Banner.js","sources":["../../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport { State } from '../../types';\r\nimport { getBannerIcon } from './util';\r\nimport { IconButton } from '../IconButton/IconButton';\r\n\r\nexport type BannerProps = React.HTMLAttributes<HTMLDivElement> & {\r\n    /** Content can be any react element, for e.g. a `div` */\r\n    children: React.ReactNode;\r\n    /** State will change the icon displayed in banner */\r\n    state: State;\r\n    onClose?: () => void;\r\n};\r\n\r\nexport const Banner = React.forwardRef(function Banner(props: BannerProps, ref: React.Ref<HTMLDivElement>) {\r\n    const { children, state, onClose } = props;\r\n    const className = cn('bg-white relative flex items-center px-4 h-12 shadow-lg z-10', props.className);\r\n\r\n    return (\r\n        <div className={className} data-taco=\"banner\" ref={ref}>\r\n            {getBannerIcon(state)}\r\n            {children}\r\n            {onClose ? <IconButton className=\"ml-auto -mr-2\" icon=\"close\" appearance=\"discrete\" onClick={onClose} /> : null}\r\n        </div>\r\n    );\r\n});\r\n"],"names":["Banner","React","props","ref","children","state","onClose","className","cn","getBannerIcon","IconButton","icon","appearance","onClick"],"mappings":";;;;;IAcaA,MAAM,gBAAGC,UAAA,CAAiB,SAASD,MAAT,CAAgBE,KAAhB,EAAoCC,GAApC;AACnC,MAAQC,QAAR,GAAqCF,KAArC,CAAQE,QAAR;AAAA,MAAkBC,KAAlB,GAAqCH,KAArC,CAAkBG,KAAlB;AAAA,MAAyBC,OAAzB,GAAqCJ,KAArC,CAAyBI,OAAzB;AACA,MAAMC,SAAS,GAAGC,EAAE,CAAC,8DAAD,EAAiEN,KAAK,CAACK,SAAvE,CAApB;AAEA,SACIN,aAAA,MAAA;AAAKM,IAAAA,SAAS,EAAEA;iBAAqB;AAASJ,IAAAA,GAAG,EAAEA;GAAnD,EACKM,aAAa,CAACJ,KAAD,CADlB,EAEKD,QAFL,EAGKE,OAAO,GAAGL,aAAA,CAACS,UAAD;AAAYH,IAAAA,SAAS,EAAC;AAAgBI,IAAAA,IAAI,EAAC;AAAQC,IAAAA,UAAU,EAAC;AAAWC,IAAAA,OAAO,EAAEP;GAAlF,CAAH,GAAmG,IAH/G,CADJ;AAOH,CAXqB;;;;"}

package/dist/esm/components/Banner/util.js

@@ -1,7 +1,7 @@
 import React__default from 'react';
 import { Icon } from '../Icon/Icon.js';
 
-var getBannerIcon = function getBannerIcon(type) {
+const getBannerIcon = type => {
   switch (type) {
     case 'success':
       return React__default.createElement(Icon, {

package/dist/esm/components/Banner/util.js.map

@@ -1 +1 @@
-{"version":3,"file":"util.js","sources":["../../../../src/components/Banner/util.tsx"],"sourcesContent":["import React from 'react';\nimport { Icon } from '../Icon/Icon';\nimport { State } from '../../types';\n\nexport const getBannerIcon = (type: State): JSX.Element | null => {\n    switch (type) {\n        case 'success':\n            return <Icon name=\"tick\" className=\"rounded-full yt-green-solid mr-4\" />;\n\n        case 'error':\n            return <Icon name=\"warning\" className=\"rounded-full yt-red-solid mr-4\" />;\n\n        case 'warning':\n            return <Icon name=\"warning\" className=\"rounded-full yt-yellow-solid mr-4\" />;\n\n        case 'information':\n            return <Icon name=\"info\" className=\"rounded-full yt-blue-solid mr-4\" />;\n\n        default:\n            return null;\n    }\n};\n"],"names":["getBannerIcon","type","React","Icon","name","className"],"mappings":";;;IAIaA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,IAAD;AACzB,UAAQA,IAAR;AACI,SAAK,SAAL;AACI,aAAOC,4BAAA,CAACC,IAAD;AAAMC,QAAAA,IAAI,EAAC;AAAOC,QAAAA,SAAS,EAAC;OAA5B,CAAP;;AAEJ,SAAK,OAAL;AACI,aAAOH,4BAAA,CAACC,IAAD;AAAMC,QAAAA,IAAI,EAAC;AAAUC,QAAAA,SAAS,EAAC;OAA/B,CAAP;;AAEJ,SAAK,SAAL;AACI,aAAOH,4BAAA,CAACC,IAAD;AAAMC,QAAAA,IAAI,EAAC;AAAUC,QAAAA,SAAS,EAAC;OAA/B,CAAP;;AAEJ,SAAK,aAAL;AACI,aAAOH,4BAAA,CAACC,IAAD;AAAMC,QAAAA,IAAI,EAAC;AAAOC,QAAAA,SAAS,EAAC;OAA5B,CAAP;;AAEJ;AACI,aAAO,IAAP;AAdR;AAgBH;;;;"}
+{"version":3,"file":"util.js","sources":["../../../../src/components/Banner/util.tsx"],"sourcesContent":["import React from 'react';\r\nimport { Icon } from '../Icon/Icon';\r\nimport { State } from '../../types';\r\n\r\nexport const getBannerIcon = (type: State): JSX.Element | null => {\r\n    switch (type) {\r\n        case 'success':\r\n            return <Icon name=\"tick\" className=\"rounded-full yt-green-solid mr-4\" />;\r\n\r\n        case 'error':\r\n            return <Icon name=\"warning\" className=\"rounded-full yt-red-solid mr-4\" />;\r\n\r\n        case 'warning':\r\n            return <Icon name=\"warning\" className=\"rounded-full yt-yellow-solid mr-4\" />;\r\n\r\n        case 'information':\r\n            return <Icon name=\"info\" className=\"rounded-full yt-blue-solid mr-4\" />;\r\n\r\n        default:\r\n            return null;\r\n    }\r\n};\r\n"],"names":["getBannerIcon","type","React","Icon","name","className"],"mappings":";;;MAIaA,aAAa,GAAIC,IAAD;AACzB,UAAQA,IAAR;AACI,SAAK,SAAL;AACI,aAAOC,4BAAA,CAACC,IAAD;AAAMC,QAAAA,IAAI,EAAC;AAAOC,QAAAA,SAAS,EAAC;OAA5B,CAAP;;AAEJ,SAAK,OAAL;AACI,aAAOH,4BAAA,CAACC,IAAD;AAAMC,QAAAA,IAAI,EAAC;AAAUC,QAAAA,SAAS,EAAC;OAA/B,CAAP;;AAEJ,SAAK,SAAL;AACI,aAAOH,4BAAA,CAACC,IAAD;AAAMC,QAAAA,IAAI,EAAC;AAAUC,QAAAA,SAAS,EAAC;OAA/B,CAAP;;AAEJ,SAAK,aAAL;AACI,aAAOH,4BAAA,CAACC,IAAD;AAAMC,QAAAA,IAAI,EAAC;AAAOC,QAAAA,SAAS,EAAC;OAA5B,CAAP;;AAEJ;AACI,aAAO,IAAP;AAdR;AAgBH;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { Appearance } from '../../types';\nimport * as ButtonPrimitive from '../../primitives/Button';\nimport { getAppearanceClasses, getButtonClasses, createButton } from './util';\nimport { HangerProps } from '../Hanger/Hanger';\nimport { MenuProps } from '../Menu/Menu';\nimport { DialogProps } from '../Dialog/Dialog';\nimport { PopoverProps } from '../Popover/Popover';\nimport './Button.css';\n\nexport type ButtonProps = ButtonPrimitive.ButtonProps & {\n    /** Appearance will change the style of the button */\n    appearance?: Appearance;\n    /**\n     * Dialog component associated with the button, clicking the button will open the dialog.\n     * *Note* that `onClick` event on button won't be handled, as in this case, the purpose of\n     * the button should be only to open the associated dialog when clicked.\n     */\n    dialog?: (props: Partial<DialogProps>) => JSX.Element;\n    /** If fluid, button expands to the width of it's container */\n    fluid?: boolean;\n    /** Hanger component associated with the button. */\n    hanger?: (props: Partial<HangerProps>) => JSX.Element;\n    /** Menu component associated with the button. */\n    menu?: (props: Partial<MenuProps>) => JSX.Element;\n    /**\n     * Popover component associated with the button, clicking the button will open the popover.\n     * *Note* that `onClick` event on button won't be handled, as in this case, the purpose of\n     * the button should be only to open the associated popover when clicked.\n     */\n    popover?: (props: Partial<PopoverProps>) => JSX.Element;\n    /** A tooltip to show when hovering over the button */\n    tooltip?: string;\n};\n\nexport const Button = React.forwardRef(function Button(\n    props: ButtonProps,\n    ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\n) {\n    const { appearance, fluid, ...otherProps } = props;\n    const className = cn(\n        getButtonClasses(),\n        getAppearanceClasses(appearance),\n        'rounded px-3',\n        {\n            'cursor-not-allowed opacity-50': props.disabled,\n            'focus:yt-focus active:focus:yt-focus': !props.disabled,\n            'w-full': fluid,\n        },\n        props.className\n    );\n\n    return createButton({ ...otherProps, 'data-taco': 'button' }, className, ref);\n});\n"],"names":["Button","React","props","ref","appearance","fluid","otherProps","className","cn","getButtonClasses","getAppearanceClasses","disabled","createButton"],"mappings":";;;;;;IAoCaA,MAAM,gBAAGC,UAAA,CAAiB,SAASD,MAAT,CACnCE,KADmC,EAEnCC,GAFmC;AAInC,MAAQC,UAAR,GAA6CF,KAA7C,CAAQE,UAAR;AAAA,MAAoBC,KAApB,GAA6CH,KAA7C,CAAoBG,KAApB;AAAA,MAA8BC,UAA9B,iCAA6CJ,KAA7C;;AACA,MAAMK,SAAS,GAAGC,EAAE,CAChBC,gBAAgB,EADA,EAEhBC,oBAAoB,CAACN,UAAD,CAFJ,EAGhB,cAHgB,EAIhB;AACI,qCAAiCF,KAAK,CAACS,QAD3C;AAEI,4CAAwC,CAACT,KAAK,CAACS,QAFnD;AAGI,cAAUN;AAHd,GAJgB,EAShBH,KAAK,CAACK,SATU,CAApB;AAYA,SAAOK,YAAY,cAAMN,UAAN;AAAkB,iBAAa;AAA/B,MAA2CC,SAA3C,EAAsDJ,GAAtD,CAAnB;AACH,CAlBqB;;;;"}
+{"version":3,"file":"Button.js","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport { Appearance } from '../../types';\r\nimport * as ButtonPrimitive from '../../primitives/Button';\r\nimport { getAppearanceClasses, getButtonClasses, createButton } from './util';\r\nimport { HangerProps } from '../Hanger/Hanger';\r\nimport { MenuProps } from '../Menu/Menu';\r\nimport { DialogProps } from '../Dialog/Dialog';\r\nimport { PopoverProps } from '../Popover/Popover';\r\nimport './Button.css';\r\n\r\nexport type ButtonProps = ButtonPrimitive.ButtonProps & {\r\n    /** Appearance will change the style of the button */\r\n    appearance?: Appearance;\r\n    /**\r\n     * Dialog component associated with the button, clicking the button will open the dialog.\r\n     * *Note* that `onClick` event on button won't be handled, as in this case, the purpose of\r\n     * the button should be only to open the associated dialog when clicked.\r\n     */\r\n    dialog?: (props: Partial<DialogProps>) => JSX.Element;\r\n    /** If fluid, button expands to the width of it's container */\r\n    fluid?: boolean;\r\n    /** Hanger component associated with the button. */\r\n    hanger?: (props: Partial<HangerProps>) => JSX.Element;\r\n    /** Menu component associated with the button. */\r\n    menu?: (props: Partial<MenuProps>) => JSX.Element;\r\n    /**\r\n     * Popover component associated with the button, clicking the button will open the popover.\r\n     * *Note* that `onClick` event on button won't be handled, as in this case, the purpose of\r\n     * the button should be only to open the associated popover when clicked.\r\n     */\r\n    popover?: (props: Partial<PopoverProps>) => JSX.Element;\r\n    /** A tooltip to show when hovering over the button */\r\n    tooltip?: string;\r\n};\r\n\r\nexport const Button = React.forwardRef(function Button(\r\n    props: ButtonProps,\r\n    ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\r\n) {\r\n    const { appearance, fluid, ...otherProps } = props;\r\n    const className = cn(\r\n        getButtonClasses(),\r\n        getAppearanceClasses(appearance),\r\n        'rounded px-3',\r\n        {\r\n            'cursor-not-allowed opacity-50': props.disabled,\r\n            'focus:yt-focus active:focus:yt-focus': !props.disabled,\r\n            'w-full': fluid,\r\n        },\r\n        props.className\r\n    );\r\n\r\n    return createButton({ ...otherProps, 'data-taco': 'button' }, className, ref);\r\n});\r\n"],"names":["Button","React","props","ref","appearance","fluid","otherProps","className","cn","getButtonClasses","getAppearanceClasses","disabled","createButton"],"mappings":";;;;;;IAoCaA,MAAM,gBAAGC,UAAA,CAAiB,SAASD,MAAT,CACnCE,KADmC,EAEnCC,GAFmC;AAInC,MAAQC,UAAR,GAA6CF,KAA7C,CAAQE,UAAR;AAAA,MAAoBC,KAApB,GAA6CH,KAA7C,CAAoBG,KAApB;AAAA,MAA8BC,UAA9B,iCAA6CJ,KAA7C;;AACA,MAAMK,SAAS,GAAGC,EAAE,CAChBC,gBAAgB,EADA,EAEhBC,oBAAoB,CAACN,UAAD,CAFJ,EAGhB,cAHgB,EAIhB;AACI,qCAAiCF,KAAK,CAACS,QAD3C;AAEI,4CAAwC,CAACT,KAAK,CAACS,QAFnD;AAGI,cAAUN;AAHd,GAJgB,EAShBH,KAAK,CAACK,SATU,CAApB;AAYA,SAAOK,YAAY,cAAMN,UAAN;AAAkB,iBAAa;AAA/B,MAA2CC,SAA3C,EAAsDJ,GAAtD,CAAnB;AACH,CAlBqB;;;;"}

package/dist/esm/components/Button/util.js

@@ -1,49 +1,74 @@
-import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
 import { Button } from '../../primitives/Button.js';
 import { Tooltip } from '../Tooltip/Tooltip.js';
 
-var _excluded = ["dialog", "hanger", "menu", "popover", "tooltip"];
-var getButtonClasses = function getButtonClasses() {
-  return 'min-h-[theme(spacing.8)] min-w-[theme(spacing.8)] leading-6 inline-flex items-center justify-center transition-all delay-100 ease-in border';
+const getButtonClasses = () => {
+  return 'min-h-[theme(spacing.8)] min-w-[theme(spacing.8)] h-max leading-6 inline-flex items-center justify-center transition-all delay-100 ease-in border';
 };
-var getAppearanceClasses = function getAppearanceClasses(value, icon) {
-  if (icon === void 0) {
-    icon = false;
-  }
-
+const getAppearanceClasses = (value, icon = false) => {
   switch (value) {
     case 'primary':
-      return "yt-blue-solid border-blue\n                focus:bg-blue focus:text-white focus:yt-focus\n                active:bg-blue-dark active:text-white \n                hover:bg-blue-light hover:border-blue-light hover:text-white\n                hover:focus:bg-blue-light hover:focus:border-blue-light hover:focus:text-white\n                disabled:hover:yt-blue-solid";
+      return `yt-blue-solid border-blue
+                focus:bg-blue focus:text-white focus:yt-focus
+                active:bg-blue-dark active:text-white 
+                hover:bg-blue-light hover:border-blue-light hover:text-white
+                hover:focus:bg-blue-light hover:focus:border-blue-light hover:focus:text-white
+                disabled:hover:yt-blue-solid`;
 
     case 'danger':
-      return "yt-red-solid border-red\n                focus:bg-red focus:text-white focus:yt-focus-red\n                active:bg-red-dark active:text-white \n                hover:bg-red-light hover:text-white\n                hover:focus:bg-red-light hover:focus:text-white\n                disabled:hover:yt-red-solid";
+      return `yt-red-solid border-red
+                focus:bg-red focus:text-white focus:yt-focus-red
+                active:bg-red-dark active:text-white 
+                hover:bg-red-light hover:text-white
+                hover:focus:bg-red-light hover:focus:text-white
+                disabled:hover:yt-red-solid`;
 
     case 'ghost':
-      return "yt-blue-inverted\n                focus:bg-transparent focus:text-blue focus:yt-focus\n                active:bg-blue-lightest active:border-blue active:text-blue-dark \n                hover:bg-blue-lightest hover:border-blue-light hover:text-blue-light\n                hover:focus:bg-blue-lightest hover:focus:border-blue-light hover:focus:text-blue-light\n                disabled:hover:yt-blue-inverted";
+      return `yt-blue-inverted
+                focus:bg-transparent focus:text-blue focus:yt-focus
+                active:bg-blue-lightest active:border-blue active:text-blue-dark 
+                hover:bg-blue-lightest hover:border-blue-light hover:text-blue-light
+                hover:focus:bg-blue-lightest hover:focus:border-blue-light hover:focus:text-blue-light
+                disabled:hover:yt-blue-inverted`;
 
     case 'discrete':
       {
         if (icon) {
-          return "bg-transparent text-black border-transparent\n                    focus:text-black focus:yt-focus\n                    active:text-black\n                    hover:text-grey-darkest\n                    hover:focus:text-grey-darkest\n                    disabled:hover:yt-transparent";
+          return `bg-transparent text-black border-transparent
+                    focus:text-black focus:yt-focus
+                    active:text-black
+                    hover:text-grey-darkest
+                    hover:focus:text-grey-darkest
+                    disabled:hover:yt-transparent`;
         }
 
-        return "yt-transparent border-transparent\n                focus:text-blue focus:yt-focus\n                active:text-blue-dark\n                hover:text-blue-light\n                hover:focus:text-blue-light\n                disabled:hover:yt-transparent";
+        return `yt-transparent border-transparent
+                focus:text-blue focus:yt-focus
+                active:text-blue-dark
+                hover:text-blue-light
+                hover:focus:text-blue-light
+                disabled:hover:yt-transparent`;
       }
 
     default:
-      return "yt-grey-solid border-grey\n                focus:bg-grey focus:yt-focus\n                active:bg-grey-dark active:text-black\n                hover:bg-grey-light hover:text-grey-darkest\n                hover:focus:bg-grey-light hover:focus:text-grey-darkest\n                disabled:hover:yt-grey-solid";
+      return `yt-grey-solid border-grey
+                focus:bg-grey focus:yt-focus
+                active:bg-grey-dark active:text-black
+                hover:bg-grey-light hover:text-grey-darkest
+                hover:focus:bg-grey-light hover:focus:text-grey-darkest
+                disabled:hover:yt-grey-solid`;
   }
 };
-var createButton = function createButton(props, className, ref) {
-  var dialog = props.dialog,
-      hanger = props.hanger,
-      menu = props.menu,
-      popover = props.popover,
-      tooltip = props.tooltip,
-      otherProps = _objectWithoutPropertiesLoose(props, _excluded);
-
-  var button = React__default.createElement(Button, Object.assign({}, otherProps, {
+const createButton = (props, className, ref) => {
+  const {
+    dialog,
+    hanger,
+    menu,
+    popover,
+    tooltip,
+    ...otherProps
+  } = props;
+  let button = React__default.createElement(Button, Object.assign({}, otherProps, {
     className: className,
     ref: ref
   }));

package/dist/esm/components/Button/util.js.map

@@ -1 +1 @@
-{"version":3,"file":"util.js","sources":["../../../../src/components/Button/util.tsx"],"sourcesContent":["import React from 'react';\nimport { Appearance } from '../../types';\nimport * as ButtonPrimitive from '../../primitives/Button';\nimport { Tooltip } from '../Tooltip/Tooltip';\n\nexport const getButtonClasses = () => {\n    return 'min-h-[theme(spacing.8)] min-w-[theme(spacing.8)] leading-6 inline-flex items-center justify-center transition-all delay-100 ease-in border';\n};\n\nexport const getAppearanceClasses = (value: Appearance | undefined, icon = false): string => {\n    switch (value) {\n        case 'primary':\n            return `yt-blue-solid border-blue\n                focus:bg-blue focus:text-white focus:yt-focus\n                active:bg-blue-dark active:text-white \n                hover:bg-blue-light hover:border-blue-light hover:text-white\n                hover:focus:bg-blue-light hover:focus:border-blue-light hover:focus:text-white\n                disabled:hover:yt-blue-solid`;\n\n        case 'danger':\n            return `yt-red-solid border-red\n                focus:bg-red focus:text-white focus:yt-focus-red\n                active:bg-red-dark active:text-white \n                hover:bg-red-light hover:text-white\n                hover:focus:bg-red-light hover:focus:text-white\n                disabled:hover:yt-red-solid`;\n\n        case 'ghost':\n            return `yt-blue-inverted\n                focus:bg-transparent focus:text-blue focus:yt-focus\n                active:bg-blue-lightest active:border-blue active:text-blue-dark \n                hover:bg-blue-lightest hover:border-blue-light hover:text-blue-light\n                hover:focus:bg-blue-lightest hover:focus:border-blue-light hover:focus:text-blue-light\n                disabled:hover:yt-blue-inverted`;\n\n        case 'discrete': {\n            if (icon) {\n                return `bg-transparent text-black border-transparent\n                    focus:text-black focus:yt-focus\n                    active:text-black\n                    hover:text-grey-darkest\n                    hover:focus:text-grey-darkest\n                    disabled:hover:yt-transparent`;\n            }\n\n            return `yt-transparent border-transparent\n                focus:text-blue focus:yt-focus\n                active:text-blue-dark\n                hover:text-blue-light\n                hover:focus:text-blue-light\n                disabled:hover:yt-transparent`;\n        }\n\n        default:\n            return `yt-grey-solid border-grey\n                focus:bg-grey focus:yt-focus\n                active:bg-grey-dark active:text-black\n                hover:bg-grey-light hover:text-grey-darkest\n                hover:focus:bg-grey-light hover:focus:text-grey-darkest\n                disabled:hover:yt-grey-solid`;\n    }\n};\n\nexport const createButton = (\n    props: any,\n    className: string,\n    ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\n): JSX.Element => {\n    const { dialog, hanger, menu, popover, tooltip, ...otherProps } = props;\n\n    let button = <ButtonPrimitive.Button {...otherProps} className={className} ref={ref} />;\n\n    if (typeof dialog === 'function') {\n        button = dialog({ trigger: button });\n    } else if (typeof menu === 'function') {\n        button = menu({ trigger: button });\n    } else if (typeof popover === 'function') {\n        button = popover({ trigger: button });\n    }\n\n    if (typeof hanger === 'function') {\n        button = hanger({ anchor: button });\n    }\n\n    if (tooltip) {\n        button = <Tooltip title={tooltip}>{button}</Tooltip>;\n    }\n\n    return button;\n};\n"],"names":["getButtonClasses","getAppearanceClasses","value","icon","createButton","props","className","ref","dialog","hanger","menu","popover","tooltip","otherProps","button","React","ButtonPrimitive","trigger","anchor","Tooltip","title"],"mappings":";;;;;;IAKaA,gBAAgB,GAAG,SAAnBA,gBAAmB;AAC5B,SAAO,6IAAP;AACH;IAEYC,oBAAoB,GAAG,SAAvBA,oBAAuB,CAACC,KAAD,EAAgCC,IAAhC;MAAgCA;AAAAA,IAAAA,OAAO;;;AACvE,UAAQD,KAAR;AACI,SAAK,SAAL;AACI;;AAOJ,SAAK,QAAL;AACI;;AAOJ,SAAK,OAAL;AACI;;AAOJ,SAAK,UAAL;AAAiB;AACb,YAAIC,IAAJ,EAAU;AACN;AAMH;;AAED;AAMH;;AAED;AACI;AA5CR;AAmDH;IAEYC,YAAY,GAAG,SAAfA,YAAe,CACxBC,KADwB,EAExBC,SAFwB,EAGxBC,GAHwB;AAKxB,MAAQC,MAAR,GAAkEH,KAAlE,CAAQG,MAAR;AAAA,MAAgBC,MAAhB,GAAkEJ,KAAlE,CAAgBI,MAAhB;AAAA,MAAwBC,IAAxB,GAAkEL,KAAlE,CAAwBK,IAAxB;AAAA,MAA8BC,OAA9B,GAAkEN,KAAlE,CAA8BM,OAA9B;AAAA,MAAuCC,OAAvC,GAAkEP,KAAlE,CAAuCO,OAAvC;AAAA,MAAmDC,UAAnD,iCAAkER,KAAlE;;AAEA,MAAIS,MAAM,GAAGC,4BAAA,CAACC,MAAD,oBAA4BH;AAAYP,IAAAA,SAAS,EAAEA;AAAWC,IAAAA,GAAG,EAAEA;IAAnE,CAAb;;AAEA,MAAI,OAAOC,MAAP,KAAkB,UAAtB,EAAkC;AAC9BM,IAAAA,MAAM,GAAGN,MAAM,CAAC;AAAES,MAAAA,OAAO,EAAEH;AAAX,KAAD,CAAf;AACH,GAFD,MAEO,IAAI,OAAOJ,IAAP,KAAgB,UAApB,EAAgC;AACnCI,IAAAA,MAAM,GAAGJ,IAAI,CAAC;AAAEO,MAAAA,OAAO,EAAEH;AAAX,KAAD,CAAb;AACH,GAFM,MAEA,IAAI,OAAOH,OAAP,KAAmB,UAAvB,EAAmC;AACtCG,IAAAA,MAAM,GAAGH,OAAO,CAAC;AAAEM,MAAAA,OAAO,EAAEH;AAAX,KAAD,CAAhB;AACH;;AAED,MAAI,OAAOL,MAAP,KAAkB,UAAtB,EAAkC;AAC9BK,IAAAA,MAAM,GAAGL,MAAM,CAAC;AAAES,MAAAA,MAAM,EAAEJ;AAAV,KAAD,CAAf;AACH;;AAED,MAAIF,OAAJ,EAAa;AACTE,IAAAA,MAAM,GAAGC,4BAAA,CAACI,OAAD;AAASC,MAAAA,KAAK,EAAER;KAAhB,EAA0BE,MAA1B,CAAT;AACH;;AAED,SAAOA,MAAP;AACH;;;;"}
+{"version":3,"file":"util.js","sources":["../../../../src/components/Button/util.tsx"],"sourcesContent":["import React from 'react';\r\nimport { Appearance } from '../../types';\r\nimport * as ButtonPrimitive from '../../primitives/Button';\r\nimport { Tooltip } from '../Tooltip/Tooltip';\r\n\r\nexport const getButtonClasses = () => {\r\n    return 'min-h-[theme(spacing.8)] min-w-[theme(spacing.8)] h-max leading-6 inline-flex items-center justify-center transition-all delay-100 ease-in border';\r\n};\r\n\r\nexport const getAppearanceClasses = (value: Appearance | undefined, icon = false): string => {\r\n    switch (value) {\r\n        case 'primary':\r\n            return `yt-blue-solid border-blue\r\n                focus:bg-blue focus:text-white focus:yt-focus\r\n                active:bg-blue-dark active:text-white \r\n                hover:bg-blue-light hover:border-blue-light hover:text-white\r\n                hover:focus:bg-blue-light hover:focus:border-blue-light hover:focus:text-white\r\n                disabled:hover:yt-blue-solid`;\r\n\r\n        case 'danger':\r\n            return `yt-red-solid border-red\r\n                focus:bg-red focus:text-white focus:yt-focus-red\r\n                active:bg-red-dark active:text-white \r\n                hover:bg-red-light hover:text-white\r\n                hover:focus:bg-red-light hover:focus:text-white\r\n                disabled:hover:yt-red-solid`;\r\n\r\n        case 'ghost':\r\n            return `yt-blue-inverted\r\n                focus:bg-transparent focus:text-blue focus:yt-focus\r\n                active:bg-blue-lightest active:border-blue active:text-blue-dark \r\n                hover:bg-blue-lightest hover:border-blue-light hover:text-blue-light\r\n                hover:focus:bg-blue-lightest hover:focus:border-blue-light hover:focus:text-blue-light\r\n                disabled:hover:yt-blue-inverted`;\r\n\r\n        case 'discrete': {\r\n            if (icon) {\r\n                return `bg-transparent text-black border-transparent\r\n                    focus:text-black focus:yt-focus\r\n                    active:text-black\r\n                    hover:text-grey-darkest\r\n                    hover:focus:text-grey-darkest\r\n                    disabled:hover:yt-transparent`;\r\n            }\r\n\r\n            return `yt-transparent border-transparent\r\n                focus:text-blue focus:yt-focus\r\n                active:text-blue-dark\r\n                hover:text-blue-light\r\n                hover:focus:text-blue-light\r\n                disabled:hover:yt-transparent`;\r\n        }\r\n\r\n        default:\r\n            return `yt-grey-solid border-grey\r\n                focus:bg-grey focus:yt-focus\r\n                active:bg-grey-dark active:text-black\r\n                hover:bg-grey-light hover:text-grey-darkest\r\n                hover:focus:bg-grey-light hover:focus:text-grey-darkest\r\n                disabled:hover:yt-grey-solid`;\r\n    }\r\n};\r\n\r\nexport const createButton = (\r\n    props: any,\r\n    className: string,\r\n    ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\r\n): JSX.Element => {\r\n    const { dialog, hanger, menu, popover, tooltip, ...otherProps } = props;\r\n\r\n    let button = <ButtonPrimitive.Button {...otherProps} className={className} ref={ref} />;\r\n\r\n    if (typeof dialog === 'function') {\r\n        button = dialog({ trigger: button });\r\n    } else if (typeof menu === 'function') {\r\n        button = menu({ trigger: button });\r\n    } else if (typeof popover === 'function') {\r\n        button = popover({ trigger: button });\r\n    }\r\n\r\n    if (typeof hanger === 'function') {\r\n        button = hanger({ anchor: button });\r\n    }\r\n\r\n    if (tooltip) {\r\n        button = <Tooltip title={tooltip}>{button}</Tooltip>;\r\n    }\r\n\r\n    return button;\r\n};\r\n"],"names":["getButtonClasses","getAppearanceClasses","value","icon","createButton","props","className","ref","dialog","hanger","menu","popover","tooltip","otherProps","button","React","ButtonPrimitive","trigger","anchor","Tooltip","title"],"mappings":";;;;MAKaA,gBAAgB,GAAG;AAC5B,SAAO,mJAAP;AACH;MAEYC,oBAAoB,GAAG,CAACC,KAAD,EAAgCC,IAAI,GAAG,KAAvC;AAChC,UAAQD,KAAR;AACI,SAAK,SAAL;AACI;;;;;6CAAA;;AAOJ,SAAK,QAAL;AACI;;;;;4CAAA;;AAOJ,SAAK,OAAL;AACI;;;;;gDAAA;;AAOJ,SAAK,UAAL;AAAiB;AACb,YAAIC,IAAJ,EAAU;AACN;;;;;kDAAA;AAMH;;AAED;;;;;8CAAA;AAMH;;AAED;AACI;;;;;6CAAA;AA5CR;AAmDH;MAEYC,YAAY,GAAG,CACxBC,KADwB,EAExBC,SAFwB,EAGxBC,GAHwB;AAKxB,QAAM;AAAEC,IAAAA,MAAF;AAAUC,IAAAA,MAAV;AAAkBC,IAAAA,IAAlB;AAAwBC,IAAAA,OAAxB;AAAiCC,IAAAA,OAAjC;AAA0C,OAAGC;AAA7C,MAA4DR,KAAlE;AAEA,MAAIS,MAAM,GAAGC,4BAAA,CAACC,MAAD,oBAA4BH;AAAYP,IAAAA,SAAS,EAAEA;AAAWC,IAAAA,GAAG,EAAEA;IAAnE,CAAb;;AAEA,MAAI,OAAOC,MAAP,KAAkB,UAAtB,EAAkC;AAC9BM,IAAAA,MAAM,GAAGN,MAAM,CAAC;AAAES,MAAAA,OAAO,EAAEH;AAAX,KAAD,CAAf;AACH,GAFD,MAEO,IAAI,OAAOJ,IAAP,KAAgB,UAApB,EAAgC;AACnCI,IAAAA,MAAM,GAAGJ,IAAI,CAAC;AAAEO,MAAAA,OAAO,EAAEH;AAAX,KAAD,CAAb;AACH,GAFM,MAEA,IAAI,OAAOH,OAAP,KAAmB,UAAvB,EAAmC;AACtCG,IAAAA,MAAM,GAAGH,OAAO,CAAC;AAAEM,MAAAA,OAAO,EAAEH;AAAX,KAAD,CAAhB;AACH;;AAED,MAAI,OAAOL,MAAP,KAAkB,UAAtB,EAAkC;AAC9BK,IAAAA,MAAM,GAAGL,MAAM,CAAC;AAAES,MAAAA,MAAM,EAAEJ;AAAV,KAAD,CAAf;AACH;;AAED,MAAIF,OAAJ,EAAa;AACTE,IAAAA,MAAM,GAAGC,4BAAA,CAACI,OAAD;AAASC,MAAAA,KAAK,EAAER;KAAhB,EAA0BE,MAA1B,CAAT;AACH;;AAED,SAAOA,MAAP;AACH;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"Calendar.js","sources":["../../../../src/components/Calendar/Calendar.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport ReactDayPicker, { NavbarElementProps, DayModifiers } from 'react-day-picker';\nimport { useLocalization } from '../Provider/Provider';\nimport './Calendar.css';\nimport { IconButton } from '../IconButton/IconButton';\n\nexport type CalendarTextsActions = {\n    /** Aria-label for previous month action button */\n    previousMonth: string;\n    /** Aria-label for next month action button */\n    nextMonth: string;\n    /** Aria-label for previous year action button */\n    previousYear: string;\n    /** Aria-label for next year action button */\n    nextYear: string;\n    /** Text displayed within today action button */\n    today: string;\n};\n\nexport type CalendarTexts = {\n    /** Text and aria-label for action buttons in Calendar */\n    actions: CalendarTextsActions;\n    /** Text abbreviation for months in Calendar's header, starting with January */\n    months: string[];\n    /** Text abbreviation for days in Calendar's header, starting with Sunday */\n    weekdaysShort: string[];\n};\n\nconst renderDay = (day: Date, modifiers: DayModifiers): React.ReactNode =>\n    modifiers.disabled ? <span className=\"dot\" /> : day.getDate();\n\n/** @internal */\ntype CustomNavbarElementProps = NavbarElementProps & {\n    showYearControls?: boolean;\n    onMonthChange: (month: Date) => void;\n    value?: Date;\n};\n\nconst thisYear = new Date().getFullYear();\nconst years: number[] = [];\n\nfor (let i = thisYear - 10; i <= thisYear + 10; i += 1) {\n    years.push(i);\n}\n\nconst Navbar = React.memo(\n    ({ onMonthChange, onNextClick, onPreviousClick, value = new Date() }: CustomNavbarElementProps): JSX.Element => {\n        const {\n            texts: {\n                calendar: { actions, months },\n            },\n        } = useLocalization();\n\n        const handleChange = function handleChange(event) {\n            const { year, month } = event.target.form;\n            onMonthChange(new Date(year.value, month.value));\n        };\n\n        return (\n            <div className=\"flex justify-between items-center mb-2\">\n                <form className=\"inline-flex space-x-1\">\n                    <select className=\"h-8 px-2\" name=\"month\" onChange={handleChange} value={value.getMonth()}>\n                        {months.map((month, i) => (\n                            <option value={i}>{month}</option>\n                        ))}\n                    </select>\n                    <select className=\"h-8 px-2\" name=\"year\" onChange={handleChange} value={value.getFullYear()}>\n                        {years.map(year => (\n                            <option value={year}>{String(year)}</option>\n                        ))}\n                    </select>\n                </form>\n                <div>\n                    <IconButton\n                        appearance=\"discrete\"\n                        icon=\"chevron-left\"\n                        aria-label={actions.previousMonth}\n                        onClick={() => onPreviousClick()}\n                        rounded\n                    />\n                    <IconButton\n                        appearance=\"discrete\"\n                        icon=\"chevron-right\"\n                        aria-label={actions.nextMonth}\n                        onClick={() => onNextClick()}\n                        rounded\n                    />\n                </div>\n            </div>\n        );\n    }\n);\n\nexport type CalendarProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'value'> & {\n    /** Handler called when a day is clicked in calendar */\n    onChange: (date: Date, event?: React.MouseEvent<HTMLDivElement>) => void;\n    value?: Date;\n};\n\nexport const Calendar = React.forwardRef(function Calendar(props: CalendarProps, ref: React.Ref<ReactDayPicker>) {\n    const { onChange: handleChange, value, ...otherProps } = props;\n    const { locale, texts } = useLocalization();\n    const [visibleMonth, setVisibleMonth] = React.useState(value ?? new Date());\n\n    React.useEffect(() => {\n        if (visibleMonth !== value) {\n            setVisibleMonth(value ?? new Date());\n        }\n    }, [value]);\n\n    const handleDayClick = (date, modifiers, event) => {\n        if (modifiers.outside || modifiers.disabled) {\n            return;\n        }\n\n        handleChange(date, event);\n    };\n\n    const handleCalendarClickToday = (): void => {\n        const today = new Date();\n\n        // set to midday to avoid UTC offset causing dates to be mismatched server side\n        today.setHours(12);\n        today.setMinutes(0);\n        today.setSeconds(0);\n\n        handleChange(today);\n    };\n\n    const className = cn('flex bg-white text-xs p-4', otherProps.className);\n\n    return (\n        <div data-taco=\"calendar\">\n            <ReactDayPicker\n                {...otherProps}\n                className={className}\n                month={visibleMonth}\n                selectedDays={value}\n                locale={locale.substring(0, 2)}\n                firstDayOfWeek={1}\n                months={texts.calendar.months}\n                weekdaysShort={texts.calendar.weekdaysShort}\n                navbarElement={navProps => <Navbar {...navProps} onMonthChange={setVisibleMonth} value={visibleMonth} />}\n                onDayClick={handleDayClick}\n                onMonthChange={setVisibleMonth}\n                onTodayButtonClick={handleCalendarClickToday}\n                captionElement={() => null}\n                todayButton={texts.calendar.actions.today}\n                showOutsideDays\n                renderDay={renderDay}\n                numberOfMonths={1}\n                ref={ref}\n            />\n        </div>\n    );\n});\n"],"names":["renderDay","day","modifiers","disabled","React","className","getDate","thisYear","Date","getFullYear","years","i","push","Navbar","onMonthChange","onNextClick","onPreviousClick","value","useLocalization","texts","calendar","actions","months","handleChange","event","target","form","year","month","name","onChange","getMonth","map","String","IconButton","appearance","icon","previousMonth","onClick","rounded","nextMonth","Calendar","props","ref","otherProps","locale","visibleMonth","setVisibleMonth","handleDayClick","date","outside","handleCalendarClickToday","today","setHours","setMinutes","setSeconds","cn","ReactDayPicker","selectedDays","substring","firstDayOfWeek","weekdaysShort","navbarElement","navProps","onDayClick","onTodayButtonClick","captionElement","todayButton","showOutsideDays","numberOfMonths"],"mappings":"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"}
+{"version":3,"file":"Calendar.js","sources":["../../../../src/components/Calendar/Calendar.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport ReactDayPicker, { NavbarElementProps, DayModifiers } from 'react-day-picker';\r\nimport { useLocalization } from '../Provider/Provider';\r\nimport './Calendar.css';\r\nimport { IconButton } from '../IconButton/IconButton';\r\n\r\nexport type CalendarTextsActions = {\r\n    /** Aria-label for previous month action button */\r\n    previousMonth: string;\r\n    /** Aria-label for next month action button */\r\n    nextMonth: string;\r\n    /** Aria-label for previous year action button */\r\n    previousYear: string;\r\n    /** Aria-label for next year action button */\r\n    nextYear: string;\r\n    /** Text displayed within today action button */\r\n    today: string;\r\n};\r\n\r\nexport type CalendarTexts = {\r\n    /** Text and aria-label for action buttons in Calendar */\r\n    actions: CalendarTextsActions;\r\n    /** Text abbreviation for months in Calendar's header, starting with January */\r\n    months: string[];\r\n    /** Text abbreviation for days in Calendar's header, starting with Sunday */\r\n    weekdaysShort: string[];\r\n};\r\n\r\nconst renderDay = (day: Date, modifiers: DayModifiers): React.ReactNode =>\r\n    modifiers.disabled ? <span className=\"dot\" /> : day.getDate();\r\n\r\n/** @internal */\r\ntype CustomNavbarElementProps = NavbarElementProps & {\r\n    showYearControls?: boolean;\r\n    onMonthChange: (month: Date) => void;\r\n    value?: Date;\r\n};\r\n\r\nconst thisYear = new Date().getFullYear();\r\nconst years: number[] = [];\r\n\r\nfor (let i = thisYear - 10; i <= thisYear + 10; i += 1) {\r\n    years.push(i);\r\n}\r\n\r\nconst Navbar = React.memo(\r\n    ({ onMonthChange, onNextClick, onPreviousClick, value = new Date() }: CustomNavbarElementProps): JSX.Element => {\r\n        const {\r\n            texts: {\r\n                calendar: { actions, months },\r\n            },\r\n        } = useLocalization();\r\n\r\n        const handleChange = function handleChange(event) {\r\n            const { year, month } = event.target.form;\r\n            onMonthChange(new Date(year.value, month.value));\r\n        };\r\n\r\n        return (\r\n            <div className=\"flex justify-between items-center mb-2\">\r\n                <form className=\"inline-flex space-x-1\">\r\n                    <select className=\"h-8 px-2\" name=\"month\" onChange={handleChange} value={value.getMonth()}>\r\n                        {months.map((month, i) => (\r\n                            <option value={i}>{month}</option>\r\n                        ))}\r\n                    </select>\r\n                    <select className=\"h-8 px-2\" name=\"year\" onChange={handleChange} value={value.getFullYear()}>\r\n                        {years.map(year => (\r\n                            <option value={year}>{String(year)}</option>\r\n                        ))}\r\n                    </select>\r\n                </form>\r\n                <div>\r\n                    <IconButton\r\n                        appearance=\"discrete\"\r\n                        icon=\"chevron-left\"\r\n                        aria-label={actions.previousMonth}\r\n                        onClick={() => onPreviousClick()}\r\n                        rounded\r\n                    />\r\n                    <IconButton\r\n                        appearance=\"discrete\"\r\n                        icon=\"chevron-right\"\r\n                        aria-label={actions.nextMonth}\r\n                        onClick={() => onNextClick()}\r\n                        rounded\r\n                    />\r\n                </div>\r\n            </div>\r\n        );\r\n    }\r\n);\r\n\r\nexport type CalendarProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'value'> & {\r\n    /** Handler called when a day is clicked in calendar */\r\n    onChange: (date: Date, event?: React.MouseEvent<HTMLDivElement>) => void;\r\n    value?: Date;\r\n};\r\n\r\nexport const Calendar = React.forwardRef(function Calendar(props: CalendarProps, ref: React.Ref<ReactDayPicker>) {\r\n    const { onChange: handleChange, value, ...otherProps } = props;\r\n    const { locale, texts } = useLocalization();\r\n    const [visibleMonth, setVisibleMonth] = React.useState(value ?? new Date());\r\n\r\n    React.useEffect(() => {\r\n        if (visibleMonth !== value) {\r\n            setVisibleMonth(value ?? new Date());\r\n        }\r\n    }, [value]);\r\n\r\n    const handleDayClick = (date, modifiers, event) => {\r\n        if (modifiers.outside || modifiers.disabled) {\r\n            return;\r\n        }\r\n\r\n        handleChange(date, event);\r\n    };\r\n\r\n    const handleCalendarClickToday = (): void => {\r\n        const today = new Date();\r\n\r\n        // set to midday to avoid UTC offset causing dates to be mismatched server side\r\n        today.setHours(12);\r\n        today.setMinutes(0);\r\n        today.setSeconds(0);\r\n\r\n        handleChange(today);\r\n    };\r\n\r\n    const className = cn('flex bg-white text-xs p-4', otherProps.className);\r\n\r\n    return (\r\n        <div data-taco=\"calendar\">\r\n            <ReactDayPicker\r\n                {...otherProps}\r\n                className={className}\r\n                month={visibleMonth}\r\n                selectedDays={value}\r\n                locale={locale.substring(0, 2)}\r\n                firstDayOfWeek={1}\r\n                months={texts.calendar.months}\r\n                weekdaysShort={texts.calendar.weekdaysShort}\r\n                navbarElement={navProps => <Navbar {...navProps} onMonthChange={setVisibleMonth} value={visibleMonth} />}\r\n                onDayClick={handleDayClick}\r\n                onMonthChange={setVisibleMonth}\r\n                onTodayButtonClick={handleCalendarClickToday}\r\n                captionElement={() => null}\r\n                todayButton={texts.calendar.actions.today}\r\n                showOutsideDays\r\n                renderDay={renderDay}\r\n                numberOfMonths={1}\r\n                ref={ref}\r\n            />\r\n        </div>\r\n    );\r\n});\r\n"],"names":["renderDay","day","modifiers","disabled","React","className","getDate","thisYear","Date","getFullYear","years","i","push","Navbar","onMonthChange","onNextClick","onPreviousClick","value","useLocalization","texts","calendar","actions","months","handleChange","event","target","form","year","month","name","onChange","getMonth","map","String","IconButton","appearance","icon","previousMonth","onClick","rounded","nextMonth","Calendar","props","ref","otherProps","locale","visibleMonth","setVisibleMonth","handleDayClick","date","outside","handleCalendarClickToday","today","setHours","setMinutes","setSeconds","cn","ReactDayPicker","selectedDays","substring","firstDayOfWeek","weekdaysShort","navbarElement","navProps","onDayClick","onTodayButtonClick","captionElement","todayButton","showOutsideDays","numberOfMonths"],"mappings":";;;;;;;;;AA6BA,IAAMA,SAAS,GAAG,SAAZA,SAAY,CAACC,GAAD,EAAYC,SAAZ;AAAA,SACdA,SAAS,CAACC,QAAV,GAAqBC,aAAA,OAAA;AAAMC,IAAAA,SAAS,EAAC;GAAhB,CAArB,GAAgDJ,GAAG,CAACK,OAAJ,EADlC;AAAA,CAAlB;;AAUA,IAAMC,QAAQ,gBAAG,IAAIC,IAAJ,GAAWC,WAAX,EAAjB;AACA,IAAMC,KAAK,GAAa,EAAxB;;AAEA,KAAK,IAAIC,CAAC,GAAGJ,QAAQ,GAAG,EAAxB,EAA4BI,CAAC,IAAIJ,QAAQ,GAAG,EAA5C,EAAgDI,CAAC,IAAI,CAArD,EAAwD;AACpDD,EAAAA,KAAK,CAACE,IAAN,CAAWD,CAAX;AACH;;AAED,IAAME,MAAM,gBAAGT,IAAA,CACX;MAAGU,qBAAAA;MAAeC,mBAAAA;MAAaC,uBAAAA;wBAAiBC;MAAAA,gCAAQ,IAAIT,IAAJ;;AACpD,yBAIIU,eAAe,EAJnB;AAAA,+CACIC,KADJ,CAEQC,QAFR;AAAA,MAEoBC,OAFpB,yBAEoBA,OAFpB;AAAA,MAE6BC,MAF7B,yBAE6BA,MAF7B;;AAMA,MAAMC,YAAY,GAAG,SAASA,YAAT,CAAsBC,KAAtB;AACjB,6BAAwBA,KAAK,CAACC,MAAN,CAAaC,IAArC;AAAA,QAAQC,IAAR,sBAAQA,IAAR;AAAA,QAAcC,KAAd,sBAAcA,KAAd;AACAd,IAAAA,aAAa,CAAC,IAAIN,IAAJ,CAASmB,IAAI,CAACV,KAAd,EAAqBW,KAAK,CAACX,KAA3B,CAAD,CAAb;AACH,GAHD;;AAKA,SACIb,aAAA,MAAA;AAAKC,IAAAA,SAAS,EAAC;GAAf,EACID,aAAA,OAAA;AAAMC,IAAAA,SAAS,EAAC;GAAhB,EACID,aAAA,SAAA;AAAQC,IAAAA,SAAS,EAAC;AAAWwB,IAAAA,IAAI,EAAC;AAAQC,IAAAA,QAAQ,EAAEP;AAAcN,IAAAA,KAAK,EAAEA,KAAK,CAACc,QAAN;GAAzE,EACKT,MAAM,CAACU,GAAP,CAAW,UAACJ,KAAD,EAAQjB,CAAR;AAAA,WACRP,aAAA,SAAA;AAAQa,MAAAA,KAAK,EAAEN;KAAf,EAAmBiB,KAAnB,CADQ;AAAA,GAAX,CADL,CADJ,EAMIxB,aAAA,SAAA;AAAQC,IAAAA,SAAS,EAAC;AAAWwB,IAAAA,IAAI,EAAC;AAAOC,IAAAA,QAAQ,EAAEP;AAAcN,IAAAA,KAAK,EAAEA,KAAK,CAACR,WAAN;GAAxE,EACKC,KAAK,CAACsB,GAAN,CAAU,UAAAL,IAAI;AAAA,WACXvB,aAAA,SAAA;AAAQa,MAAAA,KAAK,EAAEU;KAAf,EAAsBM,MAAM,CAACN,IAAD,CAA5B,CADW;AAAA,GAAd,CADL,CANJ,CADJ,EAaIvB,aAAA,MAAA,MAAA,EACIA,aAAA,CAAC8B,UAAD;AACIC,IAAAA,UAAU,EAAC;AACXC,IAAAA,IAAI,EAAC;kBACOf,OAAO,CAACgB;AACpBC,IAAAA,OAAO,EAAE;AAAA,aAAMtB,eAAe,EAArB;AAAA;AACTuB,IAAAA,OAAO;GALX,CADJ,EAQInC,aAAA,CAAC8B,UAAD;AACIC,IAAAA,UAAU,EAAC;AACXC,IAAAA,IAAI,EAAC;kBACOf,OAAO,CAACmB;AACpBF,IAAAA,OAAO,EAAE;AAAA,aAAMvB,WAAW,EAAjB;AAAA;AACTwB,IAAAA,OAAO;GALX,CARJ,CAbJ,CADJ;AAgCH,CA7CU,CAAf;IAsDaE,QAAQ,gBAAGrC,UAAA,CAAiB,SAASqC,QAAT,CAAkBC,KAAlB,EAAwCC,GAAxC;AACrC,MAAkBpB,YAAlB,GAAyDmB,KAAzD,CAAQZ,QAAR;AAAA,MAAgCb,KAAhC,GAAyDyB,KAAzD,CAAgCzB,KAAhC;AAAA,MAA0C2B,UAA1C,iCAAyDF,KAAzD;;AACA,0BAA0BxB,eAAe,EAAzC;AAAA,MAAQ2B,MAAR,qBAAQA,MAAR;AAAA,MAAgB1B,KAAhB,qBAAgBA,KAAhB;;AACA,wBAAwCf,QAAA,CAAea,KAAf,aAAeA,KAAf,cAAeA,KAAf,GAAwB,IAAIT,IAAJ,EAAxB,CAAxC;AAAA,MAAOsC,YAAP;AAAA,MAAqBC,eAArB;;AAEA3C,EAAAA,SAAA,CAAgB;AACZ,QAAI0C,YAAY,KAAK7B,KAArB,EAA4B;AACxB8B,MAAAA,eAAe,CAAC9B,KAAD,aAACA,KAAD,cAACA,KAAD,GAAU,IAAIT,IAAJ,EAAV,CAAf;AACH;AACJ,GAJD,EAIG,CAACS,KAAD,CAJH;;AAMA,MAAM+B,cAAc,GAAG,SAAjBA,cAAiB,CAACC,IAAD,EAAO/C,SAAP,EAAkBsB,KAAlB;AACnB,QAAItB,SAAS,CAACgD,OAAV,IAAqBhD,SAAS,CAACC,QAAnC,EAA6C;AACzC;AACH;;AAEDoB,IAAAA,YAAY,CAAC0B,IAAD,EAAOzB,KAAP,CAAZ;AACH,GAND;;AAQA,MAAM2B,wBAAwB,GAAG,SAA3BA,wBAA2B;AAC7B,QAAMC,KAAK,GAAG,IAAI5C,IAAJ,EAAd;;AAGA4C,IAAAA,KAAK,CAACC,QAAN,CAAe,EAAf;AACAD,IAAAA,KAAK,CAACE,UAAN,CAAiB,CAAjB;AACAF,IAAAA,KAAK,CAACG,UAAN,CAAiB,CAAjB;AAEAhC,IAAAA,YAAY,CAAC6B,KAAD,CAAZ;AACH,GATD;;AAWA,MAAM/C,SAAS,GAAGmD,EAAE,CAAC,2BAAD,EAA8BZ,UAAU,CAACvC,SAAzC,CAApB;AAEA,SACID,aAAA,MAAA;iBAAe;GAAf,EACIA,aAAA,CAACqD,cAAD,oBACQb;AACJvC,IAAAA,SAAS,EAAEA;AACXuB,IAAAA,KAAK,EAAEkB;AACPY,IAAAA,YAAY,EAAEzC;AACd4B,IAAAA,MAAM,EAAEA,MAAM,CAACc,SAAP,CAAiB,CAAjB,EAAoB,CAApB;AACRC,IAAAA,cAAc,EAAE;AAChBtC,IAAAA,MAAM,EAAEH,KAAK,CAACC,QAAN,CAAeE;AACvBuC,IAAAA,aAAa,EAAE1C,KAAK,CAACC,QAAN,CAAeyC;AAC9BC,IAAAA,aAAa,EAAE,uBAAAC,QAAQ;AAAA,aAAI3D,aAAA,CAACS,MAAD,oBAAYkD;AAAUjD,QAAAA,aAAa,EAAEiC;AAAiB9B,QAAAA,KAAK,EAAE6B;QAA7D,CAAJ;AAAA;AACvBkB,IAAAA,UAAU,EAAEhB;AACZlC,IAAAA,aAAa,EAAEiC;AACfkB,IAAAA,kBAAkB,EAAEd;AACpBe,IAAAA,cAAc,EAAE;AAAA,aAAM,IAAN;AAAA;AAChBC,IAAAA,WAAW,EAAEhD,KAAK,CAACC,QAAN,CAAeC,OAAf,CAAuB+B;AACpCgB,IAAAA,eAAe;AACfpE,IAAAA,SAAS,EAAEA;AACXqE,IAAAA,cAAc,EAAE;AAChB1B,IAAAA,GAAG,EAAEA;IAlBT,CADJ,CADJ;AAwBH,CAxDuB;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox';\nimport { Icon } from '../Icon/Icon';\n\ntype CheckedState = boolean | 'indeterminate';\n\ntype CheckboxBaseProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onChange'> & {\n    /* Increases visual prominenance of the checkbox */\n    highlighted?: boolean;\n    /**\n     * Indeterminate state should only be used with sub-checkboxes. The indeterminate state is shown if not all\n     * sub-checkboxes are selected. This only affects the style, changing the icon in the checkbox.\n     */\n    indeterminate?: boolean;\n    /* Whether the checkbox is in an invalid state */\n    invalid?: boolean;\n    /** Label for the checkbox */\n    label?: React.ReactNode;\n    /* Whether user input is required */\n    required?: boolean;\n};\n\ninterface UncontrolledCheckboxProps extends CheckboxBaseProps {\n    checked?: never;\n    onChange?: never;\n    /* The default checked state (uncontrolled) */\n    defaultChecked?: boolean;\n}\n\ninterface ControlledCheckboxProps extends CheckboxBaseProps {\n    defaultChecked?: never;\n    /* The current checked state (controlled) */\n    checked: boolean;\n    /* Handler called when the checked state changes */\n    onChange: (checked: boolean) => void;\n}\n\nexport type CheckboxProps = UncontrolledCheckboxProps | ControlledCheckboxProps;\n\nexport const Checkbox = React.forwardRef(function Checkbox(props: CheckboxProps, ref: React.Ref<HTMLButtonElement>) {\n    const { checked, highlighted, indeterminate, invalid, label, onChange, ...otherProps } = props;\n\n    const className = cn(\n        'h-5 w-5 border rounded text-sm',\n        {\n            'mr-2': !!label,\n            'border-grey-dark text-blue focus:border-blue focus:yt-focus': !props.disabled && !invalid,\n            'border-grey text-blue-light cursor-not-allowed': props.disabled,\n            'bg-[rgba(255,255,0,0.2)] disabled:bg-[rgba(255,255,0,0.075)]': highlighted,\n            'border-red text-red focus:border-red focus:yt-focus-red': invalid && !props.disabled,\n        },\n        props.className\n    );\n\n    let handleChange: ((checked: CheckedState) => void) | undefined;\n\n    if (onChange) {\n        handleChange = (checked: CheckedState) => onChange(checked === 'indeterminate' ? false : checked);\n    }\n\n    const element = (\n        <CheckboxPrimitive.Root\n            {...otherProps}\n            data-taco=\"checkbox\"\n            checked={indeterminate ? 'indeterminate' : checked}\n            className={className}\n            onCheckedChange={handleChange}\n            ref={ref}\n        >\n            <CheckboxPrimitive.Indicator className=\"flex h-full w-full\">\n                <Icon name={indeterminate ? 'line' : 'tick'} className=\"!h-full !w-full\" />\n            </CheckboxPrimitive.Indicator>\n        </CheckboxPrimitive.Root>\n    );\n\n    if (label) {\n        const labelClassName = cn('flex items-center cursor-pointer', {\n            'cursor-not-allowed text-grey-dark': props.disabled,\n        });\n\n        return (\n            <label className={labelClassName}>\n                {element}\n                {label}\n            </label>\n        );\n    }\n\n    return element;\n});\n"],"names":["Checkbox","React","props","ref","checked","highlighted","indeterminate","invalid","label","onChange","otherProps","className","cn","disabled","handleChange","element","CheckboxPrimitive","onCheckedChange","Icon","name","labelClassName"],"mappings":";;;;;;;IAwCaA,QAAQ,gBAAGC,UAAA,CAAiB,SAASD,QAAT,CAAkBE,KAAlB,EAAwCC,GAAxC;AACrC,MAAQC,OAAR,GAAyFF,KAAzF,CAAQE,OAAR;AAAA,MAAiBC,WAAjB,GAAyFH,KAAzF,CAAiBG,WAAjB;AAAA,MAA8BC,aAA9B,GAAyFJ,KAAzF,CAA8BI,aAA9B;AAAA,MAA6CC,OAA7C,GAAyFL,KAAzF,CAA6CK,OAA7C;AAAA,MAAsDC,KAAtD,GAAyFN,KAAzF,CAAsDM,KAAtD;AAAA,MAA6DC,QAA7D,GAAyFP,KAAzF,CAA6DO,QAA7D;AAAA,MAA0EC,UAA1E,iCAAyFR,KAAzF;;AAEA,MAAMS,SAAS,GAAGC,EAAE,CAChB,gCADgB,EAEhB;AACI,YAAQ,CAAC,CAACJ,KADd;AAEI,mEAA+D,CAACN,KAAK,CAACW,QAAP,IAAmB,CAACN,OAFvF;AAGI,sDAAkDL,KAAK,CAACW,QAH5D;AAII,oEAAgER,WAJpE;AAKI,+DAA2DE,OAAO,IAAI,CAACL,KAAK,CAACW;AALjF,GAFgB,EAShBX,KAAK,CAACS,SATU,CAApB;AAYA,MAAIG,YAAJ;;AAEA,MAAIL,QAAJ,EAAc;AACVK,IAAAA,YAAY,GAAG,sBAACV,OAAD;AAAA,aAA2BK,QAAQ,CAACL,OAAO,KAAK,eAAZ,GAA8B,KAA9B,GAAsCA,OAAvC,CAAnC;AAAA,KAAf;AACH;;AAED,MAAMW,OAAO,GACTd,aAAA,CAACe,IAAD,oBACQN;iBACM;AACVN,IAAAA,OAAO,EAAEE,aAAa,GAAG,eAAH,GAAqBF;AAC3CO,IAAAA,SAAS,EAAEA;AACXM,IAAAA,eAAe,EAAEH;AACjBX,IAAAA,GAAG,EAAEA;IANT,EAQIF,aAAA,CAACe,SAAD;AAA6BL,IAAAA,SAAS,EAAC;GAAvC,EACIV,aAAA,CAACiB,IAAD;AAAMC,IAAAA,IAAI,EAAEb,aAAa,GAAG,MAAH,GAAY;AAAQK,IAAAA,SAAS,EAAC;GAAvD,CADJ,CARJ,CADJ;;AAeA,MAAIH,KAAJ,EAAW;AACP,QAAMY,cAAc,GAAGR,EAAE,CAAC,kCAAD,EAAqC;AAC1D,2CAAqCV,KAAK,CAACW;AADe,KAArC,CAAzB;AAIA,WACIZ,aAAA,QAAA;AAAOU,MAAAA,SAAS,EAAES;KAAlB,EACKL,OADL,EAEKP,KAFL,CADJ;AAMH;;AAED,SAAOO,OAAP;AACH,CAlDuB;;;;"}
+{"version":3,"file":"Checkbox.js","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox';\r\nimport { Icon } from '../Icon/Icon';\r\n\r\ntype CheckedState = boolean | 'indeterminate';\r\n\r\ntype CheckboxBaseProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onChange'> & {\r\n    /* Increases visual prominenance of the checkbox */\r\n    highlighted?: boolean;\r\n    /**\r\n     * Indeterminate state should only be used with sub-checkboxes. The indeterminate state is shown if not all\r\n     * sub-checkboxes are selected. This only affects the style, changing the icon in the checkbox.\r\n     */\r\n    indeterminate?: boolean;\r\n    /* Whether the checkbox is in an invalid state */\r\n    invalid?: boolean;\r\n    /** Label for the checkbox */\r\n    label?: React.ReactNode;\r\n    /* Whether user input is required */\r\n    required?: boolean;\r\n};\r\n\r\ninterface UncontrolledCheckboxProps extends CheckboxBaseProps {\r\n    checked?: never;\r\n    onChange?: never;\r\n    /* The default checked state (uncontrolled) */\r\n    defaultChecked?: boolean;\r\n}\r\n\r\ninterface ControlledCheckboxProps extends CheckboxBaseProps {\r\n    defaultChecked?: never;\r\n    /* The current checked state (controlled) */\r\n    checked: boolean;\r\n    /* Handler called when the checked state changes */\r\n    onChange: (checked: boolean) => void;\r\n}\r\n\r\nexport type CheckboxProps = UncontrolledCheckboxProps | ControlledCheckboxProps;\r\n\r\nexport const Checkbox = React.forwardRef(function Checkbox(props: CheckboxProps, ref: React.Ref<HTMLButtonElement>) {\r\n    const { checked, highlighted, indeterminate, invalid, label, onChange, ...otherProps } = props;\r\n\r\n    const className = cn(\r\n        'h-5 w-5 border rounded text-sm',\r\n        {\r\n            'mr-2': !!label,\r\n            'border-grey-dark text-blue focus:border-blue focus:yt-focus': !props.disabled && !invalid,\r\n            'border-grey text-blue-light cursor-not-allowed': props.disabled,\r\n            'bg-[rgba(255,255,0,0.2)] disabled:bg-[rgba(255,255,0,0.075)]': highlighted,\r\n            'border-red text-red focus:border-red focus:yt-focus-red': invalid && !props.disabled,\r\n        },\r\n        props.className\r\n    );\r\n\r\n    let handleChange: ((checked: CheckedState) => void) | undefined;\r\n\r\n    if (onChange) {\r\n        handleChange = (checked: CheckedState) => onChange(checked === 'indeterminate' ? false : checked);\r\n    }\r\n\r\n    const element = (\r\n        <CheckboxPrimitive.Root\r\n            {...otherProps}\r\n            data-taco=\"checkbox\"\r\n            checked={indeterminate ? 'indeterminate' : checked}\r\n            className={className}\r\n            onCheckedChange={handleChange}\r\n            ref={ref}\r\n        >\r\n            <CheckboxPrimitive.Indicator className=\"flex h-full w-full\">\r\n                <Icon name={indeterminate ? 'line' : 'tick'} className=\"!h-full !w-full\" />\r\n            </CheckboxPrimitive.Indicator>\r\n        </CheckboxPrimitive.Root>\r\n    );\r\n\r\n    if (label) {\r\n        const labelClassName = cn('flex items-center cursor-pointer', {\r\n            'cursor-not-allowed text-grey-dark': props.disabled,\r\n        });\r\n\r\n        return (\r\n            <label className={labelClassName}>\r\n                {element}\r\n                {label}\r\n            </label>\r\n        );\r\n    }\r\n\r\n    return element;\r\n});\r\n"],"names":["Checkbox","React","props","ref","checked","highlighted","indeterminate","invalid","label","onChange","otherProps","className","cn","disabled","handleChange","element","CheckboxPrimitive","onCheckedChange","Icon","name","labelClassName"],"mappings":";;;;;;;IAwCaA,QAAQ,gBAAGC,UAAA,CAAiB,SAASD,QAAT,CAAkBE,KAAlB,EAAwCC,GAAxC;AACrC,MAAQC,OAAR,GAAyFF,KAAzF,CAAQE,OAAR;AAAA,MAAiBC,WAAjB,GAAyFH,KAAzF,CAAiBG,WAAjB;AAAA,MAA8BC,aAA9B,GAAyFJ,KAAzF,CAA8BI,aAA9B;AAAA,MAA6CC,OAA7C,GAAyFL,KAAzF,CAA6CK,OAA7C;AAAA,MAAsDC,KAAtD,GAAyFN,KAAzF,CAAsDM,KAAtD;AAAA,MAA6DC,QAA7D,GAAyFP,KAAzF,CAA6DO,QAA7D;AAAA,MAA0EC,UAA1E,iCAAyFR,KAAzF;;AAEA,MAAMS,SAAS,GAAGC,EAAE,CAChB,gCADgB,EAEhB;AACI,YAAQ,CAAC,CAACJ,KADd;AAEI,mEAA+D,CAACN,KAAK,CAACW,QAAP,IAAmB,CAACN,OAFvF;AAGI,sDAAkDL,KAAK,CAACW,QAH5D;AAII,oEAAgER,WAJpE;AAKI,+DAA2DE,OAAO,IAAI,CAACL,KAAK,CAACW;AALjF,GAFgB,EAShBX,KAAK,CAACS,SATU,CAApB;AAYA,MAAIG,YAAJ;;AAEA,MAAIL,QAAJ,EAAc;AACVK,IAAAA,YAAY,GAAG,sBAACV,OAAD;AAAA,aAA2BK,QAAQ,CAACL,OAAO,KAAK,eAAZ,GAA8B,KAA9B,GAAsCA,OAAvC,CAAnC;AAAA,KAAf;AACH;;AAED,MAAMW,OAAO,GACTd,aAAA,CAACe,IAAD,oBACQN;iBACM;AACVN,IAAAA,OAAO,EAAEE,aAAa,GAAG,eAAH,GAAqBF;AAC3CO,IAAAA,SAAS,EAAEA;AACXM,IAAAA,eAAe,EAAEH;AACjBX,IAAAA,GAAG,EAAEA;IANT,EAQIF,aAAA,CAACe,SAAD;AAA6BL,IAAAA,SAAS,EAAC;GAAvC,EACIV,aAAA,CAACiB,IAAD;AAAMC,IAAAA,IAAI,EAAEb,aAAa,GAAG,MAAH,GAAY;AAAQK,IAAAA,SAAS,EAAC;GAAvD,CADJ,CARJ,CADJ;;AAeA,MAAIH,KAAJ,EAAW;AACP,QAAMY,cAAc,GAAGR,EAAE,CAAC,kCAAD,EAAqC;AAC1D,2CAAqCV,KAAK,CAACW;AADe,KAArC,CAAzB;AAIA,WACIZ,aAAA,QAAA;AAAOU,MAAAA,SAAS,EAAES;KAAlB,EACKL,OADL,EAEKP,KAFL,CADJ;AAMH;;AAED,SAAOO,OAAP;AACH,CAlDuB;;;;"}