@economic/taco 0.0.33-alpha.0 → 0.0.33-alpha.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/dist/components/Listbox/useMultiListbox.d.ts +1 -1
  2. package/dist/components/Select/useSelect.d.ts +13 -8
  3. package/dist/esm/components/Banner/Banner.js +7 -5
  4. package/dist/esm/components/Banner/Banner.js.map +1 -1
  5. package/dist/esm/components/Checkbox/Checkbox.js +15 -18
  6. package/dist/esm/components/Checkbox/Checkbox.js.map +1 -1
  7. package/dist/esm/components/Datepicker/Datepicker.js +48 -52
  8. package/dist/esm/components/Datepicker/Datepicker.js.map +1 -1
  9. package/dist/esm/components/Dialog/Dialog.js +39 -58
  10. package/dist/esm/components/Dialog/Dialog.js.map +1 -1
  11. package/dist/esm/components/Field/Field.js +10 -12
  12. package/dist/esm/components/Field/Field.js.map +1 -1
  13. package/dist/esm/components/Form/Form.js +6 -8
  14. package/dist/esm/components/Form/Form.js.map +1 -1
  15. package/dist/esm/components/Group/Group.js +6 -8
  16. package/dist/esm/components/Group/Group.js.map +1 -1
  17. package/dist/esm/components/Hanger/Hanger.js +25 -33
  18. package/dist/esm/components/Hanger/Hanger.js.map +1 -1
  19. package/dist/esm/components/Icon/Icon.js +7 -8
  20. package/dist/esm/components/Icon/Icon.js.map +1 -1
  21. package/dist/esm/components/IconButton/IconButton.js +9 -11
  22. package/dist/esm/components/IconButton/IconButton.js.map +1 -1
  23. package/dist/esm/components/Input/Input.js +26 -24
  24. package/dist/esm/components/Input/Input.js.map +1 -1
  25. package/dist/esm/components/Listbox/Listbox.js +24 -25
  26. package/dist/esm/components/Listbox/Listbox.js.map +1 -1
  27. package/dist/esm/components/Listbox/useListbox.js +1 -1
  28. package/dist/esm/components/Listbox/useListbox.js.map +1 -1
  29. package/dist/esm/components/Listbox/useMultiListbox.js +1 -0
  30. package/dist/esm/components/Listbox/useMultiListbox.js.map +1 -1
  31. package/dist/esm/components/Listbox/util.js +4 -7
  32. package/dist/esm/components/Listbox/util.js.map +1 -1
  33. package/dist/esm/components/Menu/Menu.js +20 -43
  34. package/dist/esm/components/Menu/Menu.js.map +1 -1
  35. package/dist/esm/components/Navigation/Navigation.js +35 -44
  36. package/dist/esm/components/Navigation/Navigation.js.map +1 -1
  37. package/dist/esm/components/Pagination/Pagination.js +39 -56
  38. package/dist/esm/components/Pagination/Pagination.js.map +1 -1
  39. package/dist/esm/components/Popover/Popover.js +29 -34
  40. package/dist/esm/components/Popover/Popover.js.map +1 -1
  41. package/dist/esm/components/Progress/Progress.js +11 -15
  42. package/dist/esm/components/Progress/Progress.js.map +1 -1
  43. package/dist/esm/components/Provider/Provider.js +13 -18
  44. package/dist/esm/components/Provider/Provider.js.map +1 -1
  45. package/dist/esm/components/RadioGroup/RadioGroup.js +45 -57
  46. package/dist/esm/components/RadioGroup/RadioGroup.js.map +1 -1
  47. package/dist/esm/components/SearchInput/SearchInput.js +10 -11
  48. package/dist/esm/components/SearchInput/SearchInput.js.map +1 -1
  49. package/dist/esm/components/Select/Select.js +30 -31
  50. package/dist/esm/components/Select/Select.js.map +1 -1
  51. package/dist/esm/components/Select/useSelect.js +48 -30
  52. package/dist/esm/components/Select/useSelect.js.map +1 -1
  53. package/dist/taco.cjs.development.js +570 -667
  54. package/dist/taco.cjs.development.js.map +1 -1
  55. package/dist/taco.cjs.production.min.js +1 -1
  56. package/dist/taco.cjs.production.min.js.map +1 -1
  57. package/package.json +2 -2
@@ -5,5 +5,5 @@ declare type useListbox = {
5
5
  list: ScrollableListProps;
6
6
  input: Omit<React.HTMLAttributes<HTMLInputElement>, 'defaultValue'>;
7
7
  };
8
- export declare const useMultiListbox: ({ data: externalData, defaultValue, disabled, id: nativeId, name, onClick, onChange, onFocus, onKeyDown, value, ...otherProps }: ListboxProps, ref: React.Ref<HTMLInputElement>) => useListbox;
8
+ export declare const useMultiListbox: ({ data: externalData, defaultValue, disabled, emptyValue: _, id: nativeId, name, onClick, onChange, onFocus, onKeyDown, value, ...otherProps }: ListboxProps, ref: React.Ref<HTMLInputElement>) => useListbox;
9
9
  export {};
@@ -1,16 +1,21 @@
1
1
  import * as React from 'react';
2
+ import * as PopoverPrimitive from '@radix-ui/react-popover';
2
3
  import { SelectProps } from './Select';
3
4
  import { ListboxProps } from '../Listbox/Listbox';
5
+ declare type InternalButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
6
+ declare type InternalListboxProps = ListboxProps & {
7
+ ref: React.ForwardedRef<HTMLInputElement>;
8
+ };
9
+ declare type InternalInputProps = React.InputHTMLAttributes<HTMLInputElement> & {
10
+ ref: React.ForwardedRef<HTMLInputElement>;
11
+ };
4
12
  declare type useSelect = React.HtmlHTMLAttributes<HTMLDivElement> & {
5
- button: React.ButtonHTMLAttributes<HTMLButtonElement>;
6
- listbox: ListboxProps;
7
- input: any;
8
- popover: {
9
- open: boolean;
10
- onOpenChange: (open: boolean) => void;
11
- };
13
+ button: InternalButtonProps;
14
+ listbox: InternalListboxProps;
15
+ input: InternalInputProps;
16
+ popover: Pick<PopoverPrimitive.PopoverProps, 'onOpenChange' | 'open'>;
12
17
  text: string | JSX.Element;
13
18
  more?: number;
14
19
  };
15
- export declare const useSelect: ({ "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, data, defaultValue, disabled, emptyValue, id: nativeId, multiselect, onClick, onChange, readOnly, value, ...otherProps }: SelectProps, ref: React.Ref<HTMLInputElement>) => useSelect;
20
+ export declare const useSelect: ({ "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, data, defaultValue, disabled, emptyValue, id: nativeId, multiselect, onBlur, onClick, onChange, readOnly, value, ...otherProps }: SelectProps, ref: React.Ref<HTMLInputElement>) => useSelect;
16
21
  export {};
@@ -3,11 +3,13 @@ import cn from 'classnames';
3
3
  import { getBannerIcon } from './util.js';
4
4
  import { IconButton } from '../IconButton/IconButton.js';
5
5
 
6
- var Banner = /*#__PURE__*/forwardRef(function Banner(props, ref) {
7
- var children = props.children,
8
- state = props.state,
9
- onClose = props.onClose;
10
- var className = cn('bg-white relative flex items-center px-4 h-12 shadow-lg z-10', props.className);
6
+ const Banner = /*#__PURE__*/forwardRef(function Banner(props, ref) {
7
+ const {
8
+ children,
9
+ state,
10
+ onClose
11
+ } = props;
12
+ const className = cn('bg-white relative flex items-center px-4 h-12 shadow-lg z-10', props.className);
11
13
  return createElement("div", {
12
14
  className: className,
13
15
  "data-taco": "banner",
@@ -1 +1 @@
1
- {"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;;;;"}
1
+ {"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":";;;;;MAcaA,MAAM,gBAAGC,UAAA,CAAiB,SAASD,MAAT,CAAgBE,KAAhB,EAAoCC,GAApC;AACnC,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,KAAZ;AAAmBC,IAAAA;AAAnB,MAA+BJ,KAArC;AACA,QAAMK,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;;;;"}
@@ -1,35 +1,32 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import { forwardRef, createElement } from 'react';
3
2
  import cn from 'classnames';
4
3
  import { Icon } from '../Icon/Icon.js';
5
4
  import { Root, Indicator } from '@radix-ui/react-checkbox';
6
5
 
7
- var _excluded = ["checked", "highlighted", "indeterminate", "invalid", "label", "onChange"];
8
- var Checkbox = /*#__PURE__*/forwardRef(function Checkbox(props, ref) {
9
- var checked = props.checked,
10
- highlighted = props.highlighted,
11
- indeterminate = props.indeterminate,
12
- invalid = props.invalid,
13
- label = props.label,
14
- onChange = props.onChange,
15
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
16
-
17
- var className = cn('bg-white h-5 w-5 border rounded text-sm flex-shrink-0 self-start mt-[0.1rem]', {
6
+ const Checkbox = /*#__PURE__*/forwardRef(function Checkbox(props, ref) {
7
+ const {
8
+ checked,
9
+ highlighted,
10
+ indeterminate,
11
+ invalid,
12
+ label,
13
+ onChange,
14
+ ...otherProps
15
+ } = props;
16
+ const className = cn('bg-white h-5 w-5 border rounded text-sm flex-shrink-0 self-start mt-[0.1rem]', {
18
17
  'mr-2': !!label,
19
18
  'border-grey-dark text-blue focus:border-blue focus:yt-focus': !props.disabled && !invalid,
20
19
  'border-grey text-blue-light cursor-not-allowed': props.disabled,
21
20
  'bg-[rgba(255,255,0,0.2)] disabled:bg-[rgba(255,255,0,0.075)]': highlighted,
22
21
  'border-red text-red focus:border-red focus:yt-focus-red': invalid && !props.disabled
23
22
  });
24
- var handleChange;
23
+ let handleChange;
25
24
 
26
25
  if (onChange) {
27
- handleChange = function handleChange(checked) {
28
- return onChange(checked === 'indeterminate' ? false : checked);
29
- };
26
+ handleChange = checked => onChange(checked === 'indeterminate' ? false : checked);
30
27
  }
31
28
 
32
- var element = createElement(Root, Object.assign({}, otherProps, {
29
+ const element = createElement(Root, Object.assign({}, otherProps, {
33
30
  "data-taco": "checkbox",
34
31
  checked: indeterminate ? 'indeterminate' : checked,
35
32
  className: className,
@@ -43,7 +40,7 @@ var Checkbox = /*#__PURE__*/forwardRef(function Checkbox(props, ref) {
43
40
  })));
44
41
 
45
42
  if (label) {
46
- var labelClassName = cn('flex items-center cursor-pointer', {
43
+ const labelClassName = cn('flex items-center cursor-pointer', {
47
44
  'cursor-not-allowed text-grey-dark': props.disabled
48
45
  }, props.className);
49
46
  return createElement("label", {
@@ -1 +1 @@
1
- {"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('bg-white h-5 w-5 border rounded text-sm flex-shrink-0 self-start mt-[0.1rem]', {\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\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(\r\n 'flex items-center cursor-pointer',\r\n {\r\n 'cursor-not-allowed text-grey-dark': props.disabled,\r\n },\r\n props.className\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,CAAC,8EAAD,EAAiF;AACjG,YAAQ,CAAC,CAACJ,KADuF;AAEjG,mEAA+D,CAACN,KAAK,CAACW,QAAP,IAAmB,CAACN,OAFc;AAGjG,sDAAkDL,KAAK,CAACW,QAHyC;AAIjG,oEAAgER,WAJiC;AAKjG,+DAA2DE,OAAO,IAAI,CAACL,KAAK,CAACW;AALoB,GAAjF,CAApB;AAQA,MAAIC,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,CACrB,kCADqB,EAErB;AACI,2CAAqCV,KAAK,CAACW;AAD/C,KAFqB,EAKrBX,KAAK,CAACS,SALe,CAAzB;AAQA,WACIV,aAAA,QAAA;AAAOU,MAAAA,SAAS,EAAES;KAAlB,EACKL,OADL,EAEKP,KAFL,CADJ;AAMH;;AAED,SAAOO,OAAP;AACH,CAlDuB;;;;"}
1
+ {"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('bg-white h-5 w-5 border rounded text-sm flex-shrink-0 self-start mt-[0.1rem]', {\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\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(\r\n 'flex items-center cursor-pointer',\r\n {\r\n 'cursor-not-allowed text-grey-dark': props.disabled,\r\n },\r\n props.className\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":";;;;;MAwCaA,QAAQ,gBAAGC,UAAA,CAAiB,SAASD,QAAT,CAAkBE,KAAlB,EAAwCC,GAAxC;AACrC,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA,WAAX;AAAwBC,IAAAA,aAAxB;AAAuCC,IAAAA,OAAvC;AAAgDC,IAAAA,KAAhD;AAAuDC,IAAAA,QAAvD;AAAiE,OAAGC;AAApE,MAAmFR,KAAzF;AAEA,QAAMS,SAAS,GAAGC,EAAE,CAAC,8EAAD,EAAiF;AACjG,YAAQ,CAAC,CAACJ,KADuF;AAEjG,mEAA+D,CAACN,KAAK,CAACW,QAAP,IAAmB,CAACN,OAFc;AAGjG,sDAAkDL,KAAK,CAACW,QAHyC;AAIjG,oEAAgER,WAJiC;AAKjG,+DAA2DE,OAAO,IAAI,CAACL,KAAK,CAACW;AALoB,GAAjF,CAApB;AAQA,MAAIC,YAAJ;;AAEA,MAAIL,QAAJ,EAAc;AACVK,IAAAA,YAAY,GAAIV,OAAD,IAA2BK,QAAQ,CAACL,OAAO,KAAK,eAAZ,GAA8B,KAA9B,GAAsCA,OAAvC,CAAlD;AACH;;AAED,QAAMW,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,UAAMY,cAAc,GAAGR,EAAE,CACrB,kCADqB,EAErB;AACI,2CAAqCV,KAAK,CAACW;AAD/C,KAFqB,EAKrBX,KAAK,CAACS,SALe,CAAzB;AAQA,WACIV,aAAA,QAAA;AAAOU,MAAAA,SAAS,EAAES;KAAlB,EACKL,OADL,EAEKP,KAFL,CADJ;AAMH;;AAED,SAAOO,OAAP;AACH,CAlDuB;;;;"}
@@ -1,4 +1,3 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import { forwardRef, createElement } from 'react';
3
2
  import cn from 'classnames';
4
3
  import { IconButton } from '../IconButton/IconButton.js';
@@ -8,25 +7,25 @@ import { Input } from '../Input/Input.js';
8
7
  import { useDatepicker } from './useDatepicker.js';
9
8
  import { Popover } from '../Popover/Popover.js';
10
9
 
11
- var _excluded = ["className", "onReset", "style", "shortcuts", "shortcutsText"];
12
- var Datepicker = /*#__PURE__*/forwardRef(function Datepicker(props, ref) {
10
+ const Datepicker = /*#__PURE__*/forwardRef(function Datepicker(props, ref) {
13
11
  var _input$disabled;
14
12
 
15
- var externalClassName = props.className,
16
- handleReset = props.onReset,
17
- style = props.style,
18
- shortcuts = props.shortcuts,
19
- shortcutsText = props.shortcutsText,
20
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
21
-
22
- var _useDatepicker = useDatepicker(otherProps, ref),
23
- calendar = _useDatepicker.calendar,
24
- input = _useDatepicker.input;
25
-
26
- var _useLocalization = useLocalization(),
27
- texts = _useLocalization.texts;
28
-
29
- var className = cn('inline-flex w-full text-black font-normal', externalClassName);
13
+ const {
14
+ className: externalClassName,
15
+ onReset: handleReset,
16
+ style,
17
+ shortcuts,
18
+ shortcutsText,
19
+ ...otherProps
20
+ } = props;
21
+ const {
22
+ calendar,
23
+ input
24
+ } = useDatepicker(otherProps, ref);
25
+ const {
26
+ texts
27
+ } = useLocalization();
28
+ const className = cn('inline-flex w-full text-black font-normal', externalClassName);
30
29
  return createElement("span", {
31
30
  className: className,
32
31
  "data-taco": "datepicker",
@@ -36,40 +35,37 @@ var Datepicker = /*#__PURE__*/forwardRef(function Datepicker(props, ref) {
36
35
  "aria-label": texts.datepicker.expand,
37
36
  disabled: (_input$disabled = input.disabled) !== null && _input$disabled !== void 0 ? _input$disabled : input.readOnly,
38
37
  icon: "calendar"
39
- })), createElement(Popover.Content, null, function (_ref) {
40
- var close = _ref.close;
41
- return createElement("div", {
42
- className: "flex -m-3"
43
- }, createElement(Calendar, Object.assign({}, calendar, {
44
- onChange: function onChange(date, event) {
45
- calendar.onChange(date, event);
46
- close();
47
- },
48
- tabIndex: -1
49
- })), shortcuts && createElement("div", {
50
- className: "border-l border-grey-dark flex flex-col"
51
- }, createElement("span", {
52
- className: "font-semibold text-xs m-4 flex items-center h-8 w-32 mb-3"
53
- }, shortcutsText !== null && shortcutsText !== void 0 ? shortcutsText : texts.datepicker.shortcuts), createElement("ul", null, shortcuts.map(function (shortcut, i) {
54
- return createElement("li", {
55
- key: i
56
- }, createElement("button", {
57
- className: "w-full px-4 py-1 flex items-start hover:bg-grey-light text-xs",
58
- onClick: function onClick(event) {
59
- event.persist();
60
- shortcut.onClick(event);
61
- close();
62
- }
63
- }, shortcut.text));
64
- })), handleReset && createElement("button", {
65
- className: "text-blue hover:text-blue-light inline-flex border-none bg-transparent text-xs cursor-pointer mt-auto my-4 mx-auto",
66
- onClick: function onClick(event) {
67
- event.persist();
68
- handleReset(event);
69
- close();
70
- }
71
- }, texts.datepicker.clear)));
72
- }))
38
+ })), createElement(Popover.Content, null, ({
39
+ close
40
+ }) => createElement("div", {
41
+ className: "flex -m-3"
42
+ }, createElement(Calendar, Object.assign({}, calendar, {
43
+ onChange: (date, event) => {
44
+ calendar.onChange(date, event);
45
+ close();
46
+ },
47
+ tabIndex: -1
48
+ })), shortcuts && createElement("div", {
49
+ className: "border-l border-grey-dark flex flex-col"
50
+ }, createElement("span", {
51
+ className: "font-semibold text-xs m-4 flex items-center h-8 w-32 mb-3"
52
+ }, shortcutsText !== null && shortcutsText !== void 0 ? shortcutsText : texts.datepicker.shortcuts), createElement("ul", null, shortcuts.map((shortcut, i) => createElement("li", {
53
+ key: i
54
+ }, createElement("button", {
55
+ className: "w-full px-4 py-1 flex items-start hover:bg-grey-light text-xs",
56
+ onClick: event => {
57
+ event.persist();
58
+ shortcut.onClick(event);
59
+ close();
60
+ }
61
+ }, shortcut.text)))), handleReset && createElement("button", {
62
+ className: "text-blue hover:text-blue-light inline-flex border-none bg-transparent text-xs cursor-pointer mt-auto my-4 mx-auto",
63
+ onClick: event => {
64
+ event.persist();
65
+ handleReset(event);
66
+ close();
67
+ }
68
+ }, texts.datepicker.clear)))))
73
69
  })));
74
70
  });
75
71
 
@@ -1 +1 @@
1
- {"version":3,"file":"Datepicker.js","sources":["../../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport { Calendar, CalendarProps } from '../Calendar/Calendar';\r\nimport { Input, InputProps } from '../Input/Input';\r\nimport { useLocalization } from '../Provider/Provider';\r\nimport { useDatepicker } from './useDatepicker';\r\nimport { IconButton } from '../IconButton/IconButton';\r\nimport { Popover } from '../Popover/Popover';\r\n\r\nexport type DatepickerTexts = {\r\n /** Aria-label for calendar */\r\n calendar: string;\r\n /** Clear button text */\r\n clear: string;\r\n /**\r\n * Aria-label for calendar icon button in the input.\r\n * Calendar will open when user clicks this icon button.\r\n */\r\n expand: string;\r\n /** Shortcut heading text */\r\n shortcuts: string;\r\n};\r\n\r\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\r\n /** [Calendar](component:calendar) component associated with the DatePicker */\r\n calendar?: CalendarProps;\r\n /** List of shortcuts */\r\n shortcuts?: any;\r\n /** Title for the shortcuts panel */\r\n shortcutsText?: string;\r\n /** Handler to be called when the clear button is clicked */\r\n onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\r\n /**\r\n * Date value of the calendar.\r\n * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\r\n */\r\n value?: Date;\r\n};\r\n\r\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\r\n const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\r\n const { calendar, input } = useDatepicker(otherProps, ref);\r\n const { texts } = useLocalization();\r\n const className = cn('inline-flex w-full text-black font-normal', externalClassName);\r\n\r\n return (\r\n <span className={className} data-taco=\"datepicker\" style={style}>\r\n <Input\r\n {...input}\r\n button={\r\n <Popover>\r\n <Popover.Trigger>\r\n <IconButton\r\n aria-label={texts.datepicker.expand}\r\n disabled={input.disabled ?? input.readOnly}\r\n icon=\"calendar\"\r\n />\r\n </Popover.Trigger>\r\n <Popover.Content>\r\n {({ close }) => (\r\n <div className=\"flex -m-3\">\r\n <Calendar\r\n {...calendar}\r\n onChange={(date: Date, event?: React.MouseEvent<HTMLDivElement>) => {\r\n calendar.onChange(date, event);\r\n close();\r\n }}\r\n tabIndex={-1}\r\n />\r\n {shortcuts && (\r\n <div className=\"border-l border-grey-dark flex flex-col\">\r\n <span className=\"font-semibold text-xs m-4 flex items-center h-8 w-32 mb-3\">\r\n {shortcutsText ?? texts.datepicker.shortcuts}\r\n </span>\r\n <ul>\r\n {shortcuts.map((shortcut, i) => (\r\n <li key={i}>\r\n <button\r\n className=\"w-full px-4 py-1 flex items-start hover:bg-grey-light text-xs\"\r\n onClick={event => {\r\n event.persist();\r\n shortcut.onClick(event);\r\n close();\r\n }}\r\n >\r\n {shortcut.text}\r\n </button>\r\n </li>\r\n ))}\r\n </ul>\r\n {handleReset && (\r\n <button\r\n className=\"text-blue hover:text-blue-light inline-flex border-none bg-transparent text-xs cursor-pointer mt-auto my-4 mx-auto\"\r\n onClick={event => {\r\n event.persist();\r\n handleReset(event);\r\n close();\r\n }}\r\n >\r\n {texts.datepicker.clear}\r\n </button>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n </Popover.Content>\r\n </Popover>\r\n }\r\n />\r\n </span>\r\n );\r\n});\r\n"],"names":["Datepicker","React","props","ref","externalClassName","className","handleReset","onReset","style","shortcuts","shortcutsText","otherProps","useDatepicker","calendar","input","useLocalization","texts","cn","Input","button","Popover","Trigger","IconButton","datepicker","expand","disabled","readOnly","icon","Content","close","Calendar","onChange","date","event","tabIndex","map","shortcut","i","key","onClick","persist","text","clear"],"mappings":"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"}
1
+ {"version":3,"file":"Datepicker.js","sources":["../../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport { Calendar, CalendarProps } from '../Calendar/Calendar';\r\nimport { Input, InputProps } from '../Input/Input';\r\nimport { useLocalization } from '../Provider/Provider';\r\nimport { useDatepicker } from './useDatepicker';\r\nimport { IconButton } from '../IconButton/IconButton';\r\nimport { Popover } from '../Popover/Popover';\r\n\r\nexport type DatepickerTexts = {\r\n /** Aria-label for calendar */\r\n calendar: string;\r\n /** Clear button text */\r\n clear: string;\r\n /**\r\n * Aria-label for calendar icon button in the input.\r\n * Calendar will open when user clicks this icon button.\r\n */\r\n expand: string;\r\n /** Shortcut heading text */\r\n shortcuts: string;\r\n};\r\n\r\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\r\n /** [Calendar](component:calendar) component associated with the DatePicker */\r\n calendar?: CalendarProps;\r\n /** List of shortcuts */\r\n shortcuts?: any;\r\n /** Title for the shortcuts panel */\r\n shortcutsText?: string;\r\n /** Handler to be called when the clear button is clicked */\r\n onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\r\n /**\r\n * Date value of the calendar.\r\n * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\r\n */\r\n value?: Date;\r\n};\r\n\r\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\r\n const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\r\n const { calendar, input } = useDatepicker(otherProps, ref);\r\n const { texts } = useLocalization();\r\n const className = cn('inline-flex w-full text-black font-normal', externalClassName);\r\n\r\n return (\r\n <span className={className} data-taco=\"datepicker\" style={style}>\r\n <Input\r\n {...input}\r\n button={\r\n <Popover>\r\n <Popover.Trigger>\r\n <IconButton\r\n aria-label={texts.datepicker.expand}\r\n disabled={input.disabled ?? input.readOnly}\r\n icon=\"calendar\"\r\n />\r\n </Popover.Trigger>\r\n <Popover.Content>\r\n {({ close }) => (\r\n <div className=\"flex -m-3\">\r\n <Calendar\r\n {...calendar}\r\n onChange={(date: Date, event?: React.MouseEvent<HTMLDivElement>) => {\r\n calendar.onChange(date, event);\r\n close();\r\n }}\r\n tabIndex={-1}\r\n />\r\n {shortcuts && (\r\n <div className=\"border-l border-grey-dark flex flex-col\">\r\n <span className=\"font-semibold text-xs m-4 flex items-center h-8 w-32 mb-3\">\r\n {shortcutsText ?? texts.datepicker.shortcuts}\r\n </span>\r\n <ul>\r\n {shortcuts.map((shortcut, i) => (\r\n <li key={i}>\r\n <button\r\n className=\"w-full px-4 py-1 flex items-start hover:bg-grey-light text-xs\"\r\n onClick={event => {\r\n event.persist();\r\n shortcut.onClick(event);\r\n close();\r\n }}\r\n >\r\n {shortcut.text}\r\n </button>\r\n </li>\r\n ))}\r\n </ul>\r\n {handleReset && (\r\n <button\r\n className=\"text-blue hover:text-blue-light inline-flex border-none bg-transparent text-xs cursor-pointer mt-auto my-4 mx-auto\"\r\n onClick={event => {\r\n event.persist();\r\n handleReset(event);\r\n close();\r\n }}\r\n >\r\n {texts.datepicker.clear}\r\n </button>\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n </Popover.Content>\r\n </Popover>\r\n }\r\n />\r\n </span>\r\n );\r\n});\r\n"],"names":["Datepicker","React","props","ref","className","externalClassName","onReset","handleReset","style","shortcuts","shortcutsText","otherProps","calendar","input","useDatepicker","texts","useLocalization","cn","Input","button","Popover","Trigger","IconButton","datepicker","expand","disabled","readOnly","icon","Content","close","Calendar","onChange","date","event","tabIndex","map","shortcut","i","key","onClick","persist","text","clear"],"mappings":";;;;;;;;;MAuCaA,UAAU,gBAAGC,UAAA,CAAiB,SAASD,UAAT,CAAoBE,KAApB,EAA4CC,GAA5C;;;AACvC,QAAM;AAAEC,IAAAA,SAAS,EAAEC,iBAAb;AAAgCC,IAAAA,OAAO,EAAEC,WAAzC;AAAsDC,IAAAA,KAAtD;AAA6DC,IAAAA,SAA7D;AAAwEC,IAAAA,aAAxE;AAAuF,OAAGC;AAA1F,MAAyGT,KAA/G;AACA,QAAM;AAAEU,IAAAA,QAAF;AAAYC,IAAAA;AAAZ,MAAsBC,aAAa,CAACH,UAAD,EAAaR,GAAb,CAAzC;AACA,QAAM;AAAEY,IAAAA;AAAF,MAAYC,eAAe,EAAjC;AACA,QAAMZ,SAAS,GAAGa,EAAE,CAAC,2CAAD,EAA8CZ,iBAA9C,CAApB;AAEA,SACIJ,aAAA,OAAA;AAAMG,IAAAA,SAAS,EAAEA;iBAAqB;AAAaI,IAAAA,KAAK,EAAEA;GAA1D,EACIP,aAAA,CAACiB,KAAD,oBACQL;AACJM,IAAAA,MAAM,EACFlB,aAAA,CAACmB,OAAD,MAAA,EACInB,aAAA,CAACmB,OAAO,CAACC,OAAT,MAAA,EACIpB,aAAA,CAACqB,UAAD;oBACgBP,KAAK,CAACQ,UAAN,CAAiBC;AAC7BC,MAAAA,QAAQ,qBAAEZ,KAAK,CAACY,QAAR,6DAAoBZ,KAAK,CAACa;AAClCC,MAAAA,IAAI,EAAC;KAHT,CADJ,CADJ,EAQI1B,aAAA,CAACmB,OAAO,CAACQ,OAAT,MAAA,EACK,CAAC;AAAEC,MAAAA;AAAF,KAAD,KACG5B,aAAA,MAAA;AAAKG,MAAAA,SAAS,EAAC;KAAf,EACIH,aAAA,CAAC6B,QAAD,oBACQlB;AACJmB,MAAAA,QAAQ,EAAE,CAACC,IAAD,EAAaC,KAAb;AACNrB,QAAAA,QAAQ,CAACmB,QAAT,CAAkBC,IAAlB,EAAwBC,KAAxB;AACAJ,QAAAA,KAAK;AACR;AACDK,MAAAA,QAAQ,EAAE,CAAC;MANf,CADJ,EASKzB,SAAS,IACNR,aAAA,MAAA;AAAKG,MAAAA,SAAS,EAAC;KAAf,EACIH,aAAA,OAAA;AAAMG,MAAAA,SAAS,EAAC;KAAhB,EACKM,aADL,aACKA,aADL,cACKA,aADL,GACsBK,KAAK,CAACQ,UAAN,CAAiBd,SADvC,CADJ,EAIIR,aAAA,KAAA,MAAA,EACKQ,SAAS,CAAC0B,GAAV,CAAc,CAACC,QAAD,EAAWC,CAAX,KACXpC,aAAA,KAAA;AAAIqC,MAAAA,GAAG,EAAED;KAAT,EACIpC,aAAA,SAAA;AACIG,MAAAA,SAAS,EAAC;AACVmC,MAAAA,OAAO,EAAEN,KAAK;AACVA,QAAAA,KAAK,CAACO,OAAN;AACAJ,QAAAA,QAAQ,CAACG,OAAT,CAAiBN,KAAjB;AACAJ,QAAAA,KAAK;AACR;KANL,EAQKO,QAAQ,CAACK,IARd,CADJ,CADH,CADL,CAJJ,EAoBKlC,WAAW,IACRN,aAAA,SAAA;AACIG,MAAAA,SAAS,EAAC;AACVmC,MAAAA,OAAO,EAAEN,KAAK;AACVA,QAAAA,KAAK,CAACO,OAAN;AACAjC,QAAAA,WAAW,CAAC0B,KAAD,CAAX;AACAJ,QAAAA,KAAK;AACR;KANL,EAQKd,KAAK,CAACQ,UAAN,CAAiBmB,KARtB,CArBR,CAVR,CAFR,CARJ;IAHR,CADJ,CADJ;AAmEH,CAzEyB;;;;"}
@@ -1,4 +1,3 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import { forwardRef, useMemo, Children, useState, createElement } from 'react';
3
2
  import { Root } from '@radix-ui/react-dialog';
4
3
  import { DialogContext } from './Context.js';
@@ -7,14 +6,12 @@ import { Content, Title, Footer, Close } from './components/Content.js';
7
6
  import { Drawer } from './components/Drawer.js';
8
7
  import { Extra } from './components/Extra.js';
9
8
 
10
- var _excluded = ["children", "closeOnEscape", "defaultOpen", "draggable", "onChange", "onClose", "open", "showCloseButton", "size", "trigger"];
11
-
12
- var useSeparatedChildren = function useSeparatedChildren(initialChildren) {
13
- return useMemo(function () {
14
- var children = [];
15
- var drawer;
16
- var extra;
17
- Children.toArray(initialChildren).forEach(function (child) {
9
+ const useSeparatedChildren = initialChildren => {
10
+ return useMemo(() => {
11
+ const children = [];
12
+ let drawer;
13
+ let extra;
14
+ Children.toArray(initialChildren).forEach(child => {
18
15
  var _child$type, _child$type2;
19
16
 
20
17
  if (((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.displayName) === Drawer.displayName) {
@@ -29,55 +26,39 @@ var useSeparatedChildren = function useSeparatedChildren(initialChildren) {
29
26
  }, [initialChildren]);
30
27
  };
31
28
 
32
- var Dialog = /*#__PURE__*/forwardRef(function Dialog(props, ref) {
33
- var initialChildren = props.children,
34
- _props$closeOnEscape = props.closeOnEscape,
35
- closeOnEscape = _props$closeOnEscape === void 0 ? true : _props$closeOnEscape,
36
- defaultOpen = props.defaultOpen,
37
- _props$draggable = props.draggable,
38
- draggable = _props$draggable === void 0 ? false : _props$draggable,
39
- onChange = props.onChange,
40
- onClose = props.onClose,
41
- open = props.open,
42
- _props$showCloseButto = props.showCloseButton,
43
- showCloseButton = _props$showCloseButto === void 0 ? true : _props$showCloseButto,
44
- _props$size = props.size,
45
- size = _props$size === void 0 ? 'sm' : _props$size,
46
- trigger = props.trigger,
47
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
48
-
49
- var _useSeparatedChildren = useSeparatedChildren(initialChildren),
50
- children = _useSeparatedChildren[0],
51
- drawer = _useSeparatedChildren[1],
52
- extra = _useSeparatedChildren[2];
53
-
54
- var _React$useState = useState(false),
55
- drawerOpen = _React$useState[0],
56
- setDrawerOpen = _React$useState[1];
57
-
58
- var context = useMemo(function () {
59
- return {
60
- closeOnEscape: closeOnEscape,
61
- draggable: draggable,
62
- drawer: {
63
- open: drawerOpen,
64
- toggle: function toggle() {
65
- return setDrawerOpen(function (isDrawerOpen) {
66
- return !isDrawerOpen;
67
- });
68
- }
69
- },
70
- elements: {
71
- drawer: drawer,
72
- extra: extra
73
- },
74
- onClose: onClose,
75
- props: otherProps,
76
- showCloseButton: showCloseButton,
77
- size: size,
78
- ref: ref
79
- };
80
- }, [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]);
29
+ const Dialog = /*#__PURE__*/forwardRef(function Dialog(props, ref) {
30
+ const {
31
+ children: initialChildren,
32
+ closeOnEscape = true,
33
+ defaultOpen,
34
+ draggable = false,
35
+ onChange,
36
+ onClose,
37
+ open,
38
+ showCloseButton = true,
39
+ size = 'sm',
40
+ trigger,
41
+ ...otherProps
42
+ } = props;
43
+ const [children, drawer, extra] = useSeparatedChildren(initialChildren);
44
+ const [drawerOpen, setDrawerOpen] = useState(false);
45
+ const context = useMemo(() => ({
46
+ closeOnEscape,
47
+ draggable,
48
+ drawer: {
49
+ open: drawerOpen,
50
+ toggle: () => setDrawerOpen(isDrawerOpen => !isDrawerOpen)
51
+ },
52
+ elements: {
53
+ drawer,
54
+ extra
55
+ },
56
+ onClose,
57
+ props: otherProps,
58
+ showCloseButton,
59
+ size,
60
+ ref
61
+ }), [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]);
81
62
  return createElement(DialogContext.Provider, {
82
63
  value: context
83
64
  }, createElement(Root, {
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\r\nimport './Dialog.css';\r\nimport { DialogTriggerProps, Trigger } from './components/Trigger';\r\nimport {\r\n Content,\r\n Title,\r\n Footer,\r\n Close,\r\n DialogContentProps,\r\n DialogContentRenderProps,\r\n DialogContentDrawerRenderProps,\r\n DialogTitleProps,\r\n DialogFooterProps,\r\n DialogCloseProps,\r\n} from './components/Content';\r\nimport { DialogDrawerProps, DialogDrawerRenderProps, Drawer } from './components/Drawer';\r\nimport { DialogExtraProps, Extra } from './components/Extra';\r\nimport { DialogContext } from './Context';\r\nimport { DialogSize } from './types';\r\n\r\nexport {\r\n DialogCloseProps,\r\n DialogContentDrawerRenderProps,\r\n DialogContentProps,\r\n DialogContentRenderProps,\r\n DialogDrawerProps,\r\n DialogDrawerRenderProps,\r\n DialogFooterProps,\r\n DialogSize,\r\n DialogTitleProps,\r\n};\r\n\r\nexport type DialogTexts = {\r\n /**\r\n * Aria-label for close icon button in dialog.\r\n * To read more about how to provide the text, see [Provider](component:provider) component\r\n */\r\n close: string;\r\n drag: string;\r\n};\r\n\r\nexport type DialogProps = {\r\n children: React.ReactNode | React.ReactNode[];\r\n /** When `true`, pressing escape will close the dialog */\r\n closeOnEscape?: boolean;\r\n /** Set whether the dialog is open by default or not, use when not providing a trigger */\r\n defaultOpen?: boolean;\r\n /** Allows dragging the dialog around the screen (window constrained) */\r\n draggable?: boolean;\r\n /** Handler called when dialog closes by user interaction */\r\n onClose?: () => void;\r\n /** Called when the dialog opens or closes, must be used in conjunction with open */\r\n onChange?: (open: boolean) => void;\r\n /** Control the open state of the dialog from outside the component */\r\n open?: boolean;\r\n /** Shows the close icon button of the dialog */\r\n showCloseButton?: boolean;\r\n /** Size of the dialog. This is the recommended way to set a size for dialog component. */\r\n size?: DialogSize;\r\n /** A trigger to be used for the dialog, should not be set if `children` already contains a trigger */\r\n trigger?: JSX.Element;\r\n};\r\n\r\nconst useSeparatedChildren = initialChildren => {\r\n return React.useMemo(() => {\r\n const children: any[] = [];\r\n let drawer;\r\n let extra;\r\n\r\n React.Children.toArray(initialChildren).forEach((child: any) => {\r\n if (child.type?.displayName === Drawer.displayName) {\r\n drawer = child;\r\n } else if (child.type?.displayName === Extra.displayName) {\r\n extra = child;\r\n } else {\r\n children.push(child);\r\n }\r\n });\r\n\r\n return [children, drawer, extra];\r\n }, [initialChildren]);\r\n};\r\n\r\nexport type ForwardedDialogWithStatics = React.ForwardRefExoticComponent<DialogProps & React.RefAttributes<HTMLElement>> & {\r\n Trigger: React.ForwardRefExoticComponent<DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;\r\n Content: React.ForwardRefExoticComponent<DialogContentProps & React.RefAttributes<HTMLDivElement>>;\r\n Title: React.ForwardRefExoticComponent<DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;\r\n Footer: React.ForwardRefExoticComponent<DialogFooterProps & React.RefAttributes<HTMLDivElement>>;\r\n Extra: React.ForwardRefExoticComponent<DialogExtraProps & React.RefAttributes<HTMLDivElement>>;\r\n Drawer: React.ForwardRefExoticComponent<DialogDrawerProps & React.RefAttributes<HTMLDivElement>>;\r\n Close: React.ForwardRefExoticComponent<DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;\r\n};\r\n\r\nexport const Dialog = React.forwardRef(function Dialog(props: DialogProps, ref: React.Ref<HTMLElement>) {\r\n const {\r\n children: initialChildren,\r\n closeOnEscape = true,\r\n defaultOpen,\r\n draggable = false,\r\n onChange,\r\n onClose,\r\n open,\r\n showCloseButton = true,\r\n size = 'sm',\r\n trigger,\r\n ...otherProps\r\n } = props;\r\n const [children, drawer, extra] = useSeparatedChildren(initialChildren);\r\n const [drawerOpen, setDrawerOpen] = React.useState(false);\r\n\r\n const context = React.useMemo(\r\n () => ({\r\n closeOnEscape,\r\n draggable,\r\n drawer: {\r\n open: drawerOpen,\r\n toggle: () => setDrawerOpen(isDrawerOpen => !isDrawerOpen),\r\n },\r\n elements: {\r\n drawer,\r\n extra,\r\n },\r\n onClose,\r\n props: otherProps,\r\n showCloseButton,\r\n size,\r\n ref,\r\n }),\r\n [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]\r\n );\r\n\r\n return (\r\n <DialogContext.Provider value={context}>\r\n <DialogPrimitive.Root defaultOpen={defaultOpen} open={open} onOpenChange={onChange}>\r\n {trigger && <Trigger>{trigger}</Trigger>}\r\n {children}\r\n </DialogPrimitive.Root>\r\n </DialogContext.Provider>\r\n );\r\n}) as ForwardedDialogWithStatics;\r\n\r\nDialog.Trigger = Trigger;\r\nDialog.Content = Content;\r\nDialog.Title = Title;\r\nDialog.Footer = Footer;\r\nDialog.Extra = Extra;\r\nDialog.Drawer = Drawer;\r\nDialog.Close = Close;\r\n"],"names":["useSeparatedChildren","initialChildren","React","children","drawer","extra","toArray","forEach","child","type","displayName","Drawer","Extra","push","Dialog","props","ref","closeOnEscape","defaultOpen","draggable","onChange","onClose","open","showCloseButton","size","trigger","otherProps","drawerOpen","setDrawerOpen","context","toggle","isDrawerOpen","elements","DialogContext","Provider","value","DialogPrimitive","onOpenChange","Trigger","Content","Title","Footer","Close"],"mappings":"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"}
1
+ {"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\r\nimport './Dialog.css';\r\nimport { DialogTriggerProps, Trigger } from './components/Trigger';\r\nimport {\r\n Content,\r\n Title,\r\n Footer,\r\n Close,\r\n DialogContentProps,\r\n DialogContentRenderProps,\r\n DialogContentDrawerRenderProps,\r\n DialogTitleProps,\r\n DialogFooterProps,\r\n DialogCloseProps,\r\n} from './components/Content';\r\nimport { DialogDrawerProps, DialogDrawerRenderProps, Drawer } from './components/Drawer';\r\nimport { DialogExtraProps, Extra } from './components/Extra';\r\nimport { DialogContext } from './Context';\r\nimport { DialogSize } from './types';\r\n\r\nexport {\r\n DialogCloseProps,\r\n DialogContentDrawerRenderProps,\r\n DialogContentProps,\r\n DialogContentRenderProps,\r\n DialogDrawerProps,\r\n DialogDrawerRenderProps,\r\n DialogFooterProps,\r\n DialogSize,\r\n DialogTitleProps,\r\n};\r\n\r\nexport type DialogTexts = {\r\n /**\r\n * Aria-label for close icon button in dialog.\r\n * To read more about how to provide the text, see [Provider](component:provider) component\r\n */\r\n close: string;\r\n drag: string;\r\n};\r\n\r\nexport type DialogProps = {\r\n children: React.ReactNode | React.ReactNode[];\r\n /** When `true`, pressing escape will close the dialog */\r\n closeOnEscape?: boolean;\r\n /** Set whether the dialog is open by default or not, use when not providing a trigger */\r\n defaultOpen?: boolean;\r\n /** Allows dragging the dialog around the screen (window constrained) */\r\n draggable?: boolean;\r\n /** Handler called when dialog closes by user interaction */\r\n onClose?: () => void;\r\n /** Called when the dialog opens or closes, must be used in conjunction with open */\r\n onChange?: (open: boolean) => void;\r\n /** Control the open state of the dialog from outside the component */\r\n open?: boolean;\r\n /** Shows the close icon button of the dialog */\r\n showCloseButton?: boolean;\r\n /** Size of the dialog. This is the recommended way to set a size for dialog component. */\r\n size?: DialogSize;\r\n /** A trigger to be used for the dialog, should not be set if `children` already contains a trigger */\r\n trigger?: JSX.Element;\r\n};\r\n\r\nconst useSeparatedChildren = initialChildren => {\r\n return React.useMemo(() => {\r\n const children: any[] = [];\r\n let drawer;\r\n let extra;\r\n\r\n React.Children.toArray(initialChildren).forEach((child: any) => {\r\n if (child.type?.displayName === Drawer.displayName) {\r\n drawer = child;\r\n } else if (child.type?.displayName === Extra.displayName) {\r\n extra = child;\r\n } else {\r\n children.push(child);\r\n }\r\n });\r\n\r\n return [children, drawer, extra];\r\n }, [initialChildren]);\r\n};\r\n\r\nexport type ForwardedDialogWithStatics = React.ForwardRefExoticComponent<DialogProps & React.RefAttributes<HTMLElement>> & {\r\n Trigger: React.ForwardRefExoticComponent<DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;\r\n Content: React.ForwardRefExoticComponent<DialogContentProps & React.RefAttributes<HTMLDivElement>>;\r\n Title: React.ForwardRefExoticComponent<DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;\r\n Footer: React.ForwardRefExoticComponent<DialogFooterProps & React.RefAttributes<HTMLDivElement>>;\r\n Extra: React.ForwardRefExoticComponent<DialogExtraProps & React.RefAttributes<HTMLDivElement>>;\r\n Drawer: React.ForwardRefExoticComponent<DialogDrawerProps & React.RefAttributes<HTMLDivElement>>;\r\n Close: React.ForwardRefExoticComponent<DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;\r\n};\r\n\r\nexport const Dialog = React.forwardRef(function Dialog(props: DialogProps, ref: React.Ref<HTMLElement>) {\r\n const {\r\n children: initialChildren,\r\n closeOnEscape = true,\r\n defaultOpen,\r\n draggable = false,\r\n onChange,\r\n onClose,\r\n open,\r\n showCloseButton = true,\r\n size = 'sm',\r\n trigger,\r\n ...otherProps\r\n } = props;\r\n const [children, drawer, extra] = useSeparatedChildren(initialChildren);\r\n const [drawerOpen, setDrawerOpen] = React.useState(false);\r\n\r\n const context = React.useMemo(\r\n () => ({\r\n closeOnEscape,\r\n draggable,\r\n drawer: {\r\n open: drawerOpen,\r\n toggle: () => setDrawerOpen(isDrawerOpen => !isDrawerOpen),\r\n },\r\n elements: {\r\n drawer,\r\n extra,\r\n },\r\n onClose,\r\n props: otherProps,\r\n showCloseButton,\r\n size,\r\n ref,\r\n }),\r\n [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]\r\n );\r\n\r\n return (\r\n <DialogContext.Provider value={context}>\r\n <DialogPrimitive.Root defaultOpen={defaultOpen} open={open} onOpenChange={onChange}>\r\n {trigger && <Trigger>{trigger}</Trigger>}\r\n {children}\r\n </DialogPrimitive.Root>\r\n </DialogContext.Provider>\r\n );\r\n}) as ForwardedDialogWithStatics;\r\n\r\nDialog.Trigger = Trigger;\r\nDialog.Content = Content;\r\nDialog.Title = Title;\r\nDialog.Footer = Footer;\r\nDialog.Extra = Extra;\r\nDialog.Drawer = Drawer;\r\nDialog.Close = Close;\r\n"],"names":["useSeparatedChildren","initialChildren","React","children","drawer","extra","toArray","forEach","child","type","displayName","Drawer","Extra","push","Dialog","props","ref","closeOnEscape","defaultOpen","draggable","onChange","onClose","open","showCloseButton","size","trigger","otherProps","drawerOpen","setDrawerOpen","context","toggle","isDrawerOpen","elements","DialogContext","Provider","value","DialogPrimitive","onOpenChange","Trigger","Content","Title","Footer","Close"],"mappings":"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"}
@@ -1,20 +1,18 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import { forwardRef, createElement } from 'react';
3
2
  import cn from 'classnames';
4
3
 
5
- var _excluded = ["disabled", "children", "invalid", "message"];
6
- var Field = /*#__PURE__*/forwardRef(function Field(props, ref) {
7
- var disabled = props.disabled,
8
- children = props.children,
9
- _props$invalid = props.invalid,
10
- invalid = _props$invalid === void 0 ? false : _props$invalid,
11
- message = props.message,
12
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
13
-
14
- var className = cn('flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]', {
4
+ const Field = /*#__PURE__*/forwardRef(function Field(props, ref) {
5
+ const {
6
+ disabled,
7
+ children,
8
+ invalid = false,
9
+ message,
10
+ ...otherProps
11
+ } = props;
12
+ const className = cn('flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]', {
15
13
  'text-grey-dark': disabled
16
14
  }, props.className);
17
- var messageClassName = cn('h-4 text-xs text-left leading-normal font-normal truncate -mb-4', {
15
+ const messageClassName = cn('h-4 text-xs text-left leading-normal font-normal truncate -mb-4', {
18
16
  'text-grey-darkest': !invalid,
19
17
  'text-red': invalid,
20
18
  'opacity-50': disabled
@@ -1 +1 @@
1
- {"version":3,"file":"Field.js","sources":["../../../../src/components/Field/Field.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\n\r\nimport './Field.css';\r\n\r\nexport type FieldProps = React.LabelHTMLAttributes<HTMLLabelElement> & {\r\n /** Content of the field */\r\n children: React.ReactNode;\r\n /**\tChanges the style to indicate the element is disabled */\r\n disabled?: boolean;\r\n /* Whether the input is in an invalid state */\r\n invalid?: boolean;\r\n /**\r\n * Text displayed below the children of Field.\r\n * Should be a short text that indicates feedback for user.\r\n */\r\n message?: string;\r\n};\r\n\r\nexport const Field = React.forwardRef(function Field(props: FieldProps, ref: React.Ref<HTMLLabelElement>) {\r\n const { disabled, children, invalid = false, message, ...otherProps } = props;\r\n const className = cn(\r\n 'flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]',\r\n {\r\n 'text-grey-dark': disabled,\r\n },\r\n props.className\r\n );\r\n const messageClassName = cn(\r\n 'h-4 text-xs text-left leading-normal font-normal truncate -mb-4',\r\n {\r\n 'text-grey-darkest': !invalid,\r\n 'text-red': invalid,\r\n 'opacity-50': disabled,\r\n },\r\n props.className\r\n );\r\n\r\n return (\r\n <label {...otherProps} className={className} data-taco=\"label\" ref={ref}>\r\n {children}\r\n {message && (\r\n <span className={messageClassName} role={invalid ? 'alert' : undefined}>\r\n {message}\r\n </span>\r\n )}\r\n </label>\r\n );\r\n});\r\n"],"names":["Field","React","props","ref","disabled","children","invalid","message","otherProps","className","cn","messageClassName","role","undefined"],"mappings":";;;;;IAmBaA,KAAK,gBAAGC,UAAA,CAAiB,SAASD,KAAT,CAAeE,KAAf,EAAkCC,GAAlC;AAClC,MAAQC,QAAR,GAAwEF,KAAxE,CAAQE,QAAR;AAAA,MAAkBC,QAAlB,GAAwEH,KAAxE,CAAkBG,QAAlB;AAAA,uBAAwEH,KAAxE,CAA4BI,OAA5B;AAAA,MAA4BA,OAA5B,+BAAsC,KAAtC;AAAA,MAA6CC,OAA7C,GAAwEL,KAAxE,CAA6CK,OAA7C;AAAA,MAAyDC,UAAzD,iCAAwEN,KAAxE;;AACA,MAAMO,SAAS,GAAGC,EAAE,CAChB,8EADgB,EAEhB;AACI,sBAAkBN;AADtB,GAFgB,EAKhBF,KAAK,CAACO,SALU,CAApB;AAOA,MAAME,gBAAgB,GAAGD,EAAE,CACvB,iEADuB,EAEvB;AACI,yBAAqB,CAACJ,OAD1B;AAEI,gBAAYA,OAFhB;AAGI,kBAAcF;AAHlB,GAFuB,EAOvBF,KAAK,CAACO,SAPiB,CAA3B;AAUA,SACIR,aAAA,QAAA,oBAAWO;AAAYC,IAAAA,SAAS,EAAEA;iBAAqB;AAAQN,IAAAA,GAAG,EAAEA;IAApE,EACKE,QADL,EAEKE,OAAO,IACJN,aAAA,OAAA;AAAMQ,IAAAA,SAAS,EAAEE;AAAkBC,IAAAA,IAAI,EAAEN,OAAO,GAAG,OAAH,GAAaO;GAA7D,EACKN,OADL,CAHR,CADJ;AAUH,CA7BoB;;;;"}
1
+ {"version":3,"file":"Field.js","sources":["../../../../src/components/Field/Field.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\n\r\nimport './Field.css';\r\n\r\nexport type FieldProps = React.LabelHTMLAttributes<HTMLLabelElement> & {\r\n /** Content of the field */\r\n children: React.ReactNode;\r\n /**\tChanges the style to indicate the element is disabled */\r\n disabled?: boolean;\r\n /* Whether the input is in an invalid state */\r\n invalid?: boolean;\r\n /**\r\n * Text displayed below the children of Field.\r\n * Should be a short text that indicates feedback for user.\r\n */\r\n message?: string;\r\n};\r\n\r\nexport const Field = React.forwardRef(function Field(props: FieldProps, ref: React.Ref<HTMLLabelElement>) {\r\n const { disabled, children, invalid = false, message, ...otherProps } = props;\r\n const className = cn(\r\n 'flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]',\r\n {\r\n 'text-grey-dark': disabled,\r\n },\r\n props.className\r\n );\r\n const messageClassName = cn(\r\n 'h-4 text-xs text-left leading-normal font-normal truncate -mb-4',\r\n {\r\n 'text-grey-darkest': !invalid,\r\n 'text-red': invalid,\r\n 'opacity-50': disabled,\r\n },\r\n props.className\r\n );\r\n\r\n return (\r\n <label {...otherProps} className={className} data-taco=\"label\" ref={ref}>\r\n {children}\r\n {message && (\r\n <span className={messageClassName} role={invalid ? 'alert' : undefined}>\r\n {message}\r\n </span>\r\n )}\r\n </label>\r\n );\r\n});\r\n"],"names":["Field","React","props","ref","disabled","children","invalid","message","otherProps","className","cn","messageClassName","role","undefined"],"mappings":";;;MAmBaA,KAAK,gBAAGC,UAAA,CAAiB,SAASD,KAAT,CAAeE,KAAf,EAAkCC,GAAlC;AAClC,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,QAAZ;AAAsBC,IAAAA,OAAO,GAAG,KAAhC;AAAuCC,IAAAA,OAAvC;AAAgD,OAAGC;AAAnD,MAAkEN,KAAxE;AACA,QAAMO,SAAS,GAAGC,EAAE,CAChB,8EADgB,EAEhB;AACI,sBAAkBN;AADtB,GAFgB,EAKhBF,KAAK,CAACO,SALU,CAApB;AAOA,QAAME,gBAAgB,GAAGD,EAAE,CACvB,iEADuB,EAEvB;AACI,yBAAqB,CAACJ,OAD1B;AAEI,gBAAYA,OAFhB;AAGI,kBAAcF;AAHlB,GAFuB,EAOvBF,KAAK,CAACO,SAPiB,CAA3B;AAUA,SACIR,aAAA,QAAA,oBAAWO;AAAYC,IAAAA,SAAS,EAAEA;iBAAqB;AAAQN,IAAAA,GAAG,EAAEA;IAApE,EACKE,QADL,EAEKE,OAAO,IACJN,aAAA,OAAA;AAAMQ,IAAAA,SAAS,EAAEE;AAAkBC,IAAAA,IAAI,EAAEN,OAAO,GAAG,OAAH,GAAaO;GAA7D,EACKN,OADL,CAHR,CADJ;AAUH,CA7BoB;;;;"}
@@ -1,14 +1,12 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import { forwardRef, createElement } from 'react';
3
2
  import cn from 'classnames';
4
3
 
5
- var _excluded = ["horizontal"];
6
- var Form = /*#__PURE__*/forwardRef(function Form(props, ref) {
7
- var _props$horizontal = props.horizontal,
8
- horizontal = _props$horizontal === void 0 ? false : _props$horizontal,
9
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
10
-
11
- var className = cn('yt-form', {
4
+ const Form = /*#__PURE__*/forwardRef(function Form(props, ref) {
5
+ const {
6
+ horizontal = false,
7
+ ...otherProps
8
+ } = props;
9
+ const className = cn('yt-form', {
12
10
  'yt-form--horizontal flex flex-wrap': horizontal
13
11
  }, props.className);
14
12
  return createElement("form", Object.assign({}, otherProps, {
@@ -1 +1 @@
1
- {"version":3,"file":"Form.js","sources":["../../../../src/components/Form/Form.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport './Form.css';\r\n\r\nexport type FormProps = React.FormHTMLAttributes<HTMLFormElement> & {\r\n /** Content should be composed of other Taco form elements */\r\n children: React.ReactNode;\r\n /** Display the form fields in a horizontal layout */\r\n horizontal?: boolean;\r\n};\r\n\r\nexport const Form = React.forwardRef(function Form(props: FormProps, ref: React.Ref<HTMLFormElement>) {\r\n const { horizontal = false, ...otherProps } = props;\r\n const className = cn(\r\n 'yt-form',\r\n {\r\n 'yt-form--horizontal flex flex-wrap': horizontal,\r\n },\r\n props.className\r\n );\r\n\r\n return <form {...otherProps} className={className} data-taco=\"form\" ref={ref} />;\r\n});\r\n"],"names":["Form","React","props","ref","horizontal","otherProps","className","cn"],"mappings":";;;;;IAWaA,IAAI,gBAAGC,UAAA,CAAiB,SAASD,IAAT,CAAcE,KAAd,EAAgCC,GAAhC;AACjC,0BAA8CD,KAA9C,CAAQE,UAAR;AAAA,MAAQA,UAAR,kCAAqB,KAArB;AAAA,MAA+BC,UAA/B,iCAA8CH,KAA9C;;AACA,MAAMI,SAAS,GAAGC,EAAE,CAChB,SADgB,EAEhB;AACI,0CAAsCH;AAD1C,GAFgB,EAKhBF,KAAK,CAACI,SALU,CAApB;AAQA,SAAOL,aAAA,OAAA,oBAAUI;AAAYC,IAAAA,SAAS,EAAEA;iBAAqB;AAAOH,IAAAA,GAAG,EAAEA;IAAlE,CAAP;AACH,CAXmB;;;;"}
1
+ {"version":3,"file":"Form.js","sources":["../../../../src/components/Form/Form.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport './Form.css';\r\n\r\nexport type FormProps = React.FormHTMLAttributes<HTMLFormElement> & {\r\n /** Content should be composed of other Taco form elements */\r\n children: React.ReactNode;\r\n /** Display the form fields in a horizontal layout */\r\n horizontal?: boolean;\r\n};\r\n\r\nexport const Form = React.forwardRef(function Form(props: FormProps, ref: React.Ref<HTMLFormElement>) {\r\n const { horizontal = false, ...otherProps } = props;\r\n const className = cn(\r\n 'yt-form',\r\n {\r\n 'yt-form--horizontal flex flex-wrap': horizontal,\r\n },\r\n props.className\r\n );\r\n\r\n return <form {...otherProps} className={className} data-taco=\"form\" ref={ref} />;\r\n});\r\n"],"names":["Form","React","props","ref","horizontal","otherProps","className","cn"],"mappings":";;;MAWaA,IAAI,gBAAGC,UAAA,CAAiB,SAASD,IAAT,CAAcE,KAAd,EAAgCC,GAAhC;AACjC,QAAM;AAAEC,IAAAA,UAAU,GAAG,KAAf;AAAsB,OAAGC;AAAzB,MAAwCH,KAA9C;AACA,QAAMI,SAAS,GAAGC,EAAE,CAChB,SADgB,EAEhB;AACI,0CAAsCH;AAD1C,GAFgB,EAKhBF,KAAK,CAACI,SALU,CAApB;AAQA,SAAOL,aAAA,OAAA,oBAAUI;AAAYC,IAAAA,SAAS,EAAEA;iBAAqB;AAAOH,IAAAA,GAAG,EAAEA;IAAlE,CAAP;AACH,CAXmB;;;;"}
@@ -1,14 +1,12 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import { forwardRef, createElement } from 'react';
3
2
  import cn from 'classnames';
4
3
 
5
- var _excluded = ["as"];
6
- var Group = /*#__PURE__*/forwardRef(function Group(props, ref) {
7
- var _props$as = props.as,
8
- Tag = _props$as === void 0 ? 'span' : _props$as,
9
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
10
-
11
- var className = cn('flex ', props.className);
4
+ const Group = /*#__PURE__*/forwardRef(function Group(props, ref) {
5
+ const {
6
+ as: Tag = 'span',
7
+ ...otherProps
8
+ } = props;
9
+ const className = cn('flex ', props.className);
12
10
  return createElement(Tag, Object.assign({}, otherProps, {
13
11
  className: className,
14
12
  "data-taco": "group",