@economic/taco 0.0.31-alpha.2 → 0.0.33-alpha.1

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 (48) hide show
  1. package/dist/esm/components/Button/util.js +1 -1
  2. package/dist/esm/components/Button/util.js.map +1 -1
  3. package/dist/esm/components/Listbox/Listbox.js +24 -25
  4. package/dist/esm/components/Listbox/Listbox.js.map +1 -1
  5. package/dist/esm/components/Menu/Menu.js +20 -43
  6. package/dist/esm/components/Menu/Menu.js.map +1 -1
  7. package/dist/esm/components/Navigation/Navigation.js +35 -44
  8. package/dist/esm/components/Navigation/Navigation.js.map +1 -1
  9. package/dist/esm/components/Pagination/Pagination.js +39 -56
  10. package/dist/esm/components/Pagination/Pagination.js.map +1 -1
  11. package/dist/esm/components/Popover/Popover.js +29 -34
  12. package/dist/esm/components/Popover/Popover.js.map +1 -1
  13. package/dist/esm/components/Progress/Progress.js +11 -15
  14. package/dist/esm/components/Progress/Progress.js.map +1 -1
  15. package/dist/esm/components/Provider/Provider.js +13 -18
  16. package/dist/esm/components/Provider/Provider.js.map +1 -1
  17. package/dist/esm/components/RadioGroup/RadioGroup.js +45 -57
  18. package/dist/esm/components/RadioGroup/RadioGroup.js.map +1 -1
  19. package/dist/esm/components/SearchInput/SearchInput.js +10 -11
  20. package/dist/esm/components/SearchInput/SearchInput.js.map +1 -1
  21. package/dist/esm/components/Select/Select.js +30 -31
  22. package/dist/esm/components/Select/Select.js.map +1 -1
  23. package/dist/esm/components/Select/useSelect.js +3 -6
  24. package/dist/esm/components/Select/useSelect.js.map +1 -1
  25. package/dist/esm/components/Spinner/Spinner.js +12 -19
  26. package/dist/esm/components/Spinner/Spinner.js.map +1 -1
  27. package/dist/esm/components/Switch/Switch.js +9 -10
  28. package/dist/esm/components/Switch/Switch.js.map +1 -1
  29. package/dist/esm/components/Tabs/Tabs.js +25 -27
  30. package/dist/esm/components/Tabs/Tabs.js.map +1 -1
  31. package/dist/esm/components/Textarea/Textarea.js +11 -9
  32. package/dist/esm/components/Textarea/Textarea.js.map +1 -1
  33. package/dist/esm/components/Toast/Toaster.js +88 -118
  34. package/dist/esm/components/Toast/Toaster.js.map +1 -1
  35. package/dist/esm/components/Tooltip/Tooltip.js +7 -8
  36. package/dist/esm/components/Tooltip/Tooltip.js.map +1 -1
  37. package/dist/esm/components/Treeview/Treeview.js +26 -36
  38. package/dist/esm/components/Treeview/Treeview.js.map +1 -1
  39. package/dist/esm/components/VisuallyHidden/VisuallyHidden.js +1 -1
  40. package/dist/esm/components/VisuallyHidden/VisuallyHidden.js.map +1 -1
  41. package/dist/esm/index.css +3 -3
  42. package/dist/index.css +3 -3
  43. package/dist/taco.cjs.development.js +531 -647
  44. package/dist/taco.cjs.development.js.map +1 -1
  45. package/dist/taco.cjs.production.min.js +1 -1
  46. package/dist/taco.cjs.production.min.js.map +1 -1
  47. package/dist/utils/tailwind.d.ts +1 -1
  48. package/package.json +2 -2
@@ -1,4 +1,3 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import { forwardRef, createElement } from 'react';
3
2
  import '../Icon/components/index.js';
4
3
  import '../Icon/Icon.js';
@@ -49,22 +48,22 @@ import '../Switch/Switch.js';
49
48
  import '../Tour/Tour.js';
50
49
  import '../../utils/hooks/useOnClickOutside.js';
51
50
 
52
- var _excluded = ["onSearch"];
53
- var SearchInput = /*#__PURE__*/forwardRef(function SearchInput(_ref, ref) {
54
- var onSearch = _ref.onSearch,
55
- props = _objectWithoutPropertiesLoose(_ref, _excluded);
51
+ const SearchInput = /*#__PURE__*/forwardRef(function SearchInput({
52
+ onSearch,
53
+ ...props
54
+ }, ref) {
55
+ const {
56
+ texts
57
+ } = useLocalization();
56
58
 
57
- var _useLocalization = useLocalization(),
58
- texts = _useLocalization.texts;
59
-
60
- var handleClick = function handleClick() {
59
+ const handleClick = () => {
61
60
  if (!props.disabled) {
62
61
  onSearch === null || onSearch === void 0 ? void 0 : onSearch(props.value);
63
62
  }
64
63
  };
65
64
 
66
- var handleKeyDown = function handleKeyDown(event) {
67
- var isEnterKeyPressed = event.keyCode === keycode('enter');
65
+ const handleKeyDown = event => {
66
+ const isEnterKeyPressed = event.keyCode === keycode('enter');
68
67
 
69
68
  if (isEnterKeyPressed) {
70
69
  handleClick();
@@ -1 +1 @@
1
- {"version":3,"file":"SearchInput.js","sources":["../../../../src/components/SearchInput/SearchInput.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport keycode from 'keycode';\r\nimport { Input, InputProps, useLocalization, IconButton } from '../..';\r\n\r\nexport type SearchInputTexts = {\r\n /**\r\n * aria-label text for input\r\n */\r\n inputLabel: string;\r\n};\r\n\r\nexport type SearchInputProps = Omit<InputProps, 'icon'> & {\r\n /** Current input value will be passed to the method. In order to get the value, the component must be controlled otherwise value will always be undefined */\r\n onSearch?: (value: string | number | readonly string[] | undefined) => void;\r\n};\r\n\r\nexport const SearchInput = React.forwardRef(function SearchInput(\r\n { onSearch, ...props }: SearchInputProps,\r\n ref: React.Ref<HTMLInputElement>\r\n) {\r\n const { texts } = useLocalization();\r\n\r\n const handleClick = (): void => {\r\n if (!props.disabled) {\r\n onSearch?.(props.value);\r\n }\r\n };\r\n\r\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\r\n const isEnterKeyPressed = event.keyCode === keycode('enter');\r\n\r\n if (isEnterKeyPressed) {\r\n handleClick();\r\n }\r\n };\r\n\r\n return (\r\n <Input\r\n aria-label={texts.searchInput.inputLabel}\r\n {...props}\r\n button={\r\n <IconButton\r\n icon=\"search\"\r\n className=\"!border-transparent !bg-transparent focus:!border-transparent peer-focus:!border-transparent peer-focus:peer-active:!border-transparent\"\r\n disabled={props.disabled}\r\n onClick={handleClick}\r\n />\r\n }\r\n onKeyDown={handleKeyDown}\r\n ref={ref}\r\n type=\"search\"\r\n />\r\n );\r\n});\r\n"],"names":["SearchInput","React","ref","onSearch","props","useLocalization","texts","handleClick","disabled","value","handleKeyDown","event","isEnterKeyPressed","keyCode","keycode","Input","searchInput","inputLabel","button","IconButton","icon","className","onClick","onKeyDown","type"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgBaA,WAAW,gBAAGC,UAAA,CAAiB,SAASD,WAAT,OAExCE,GAFwC;MACtCC,gBAAAA;MAAaC;;AAGf,yBAAkBC,eAAe,EAAjC;AAAA,MAAQC,KAAR,oBAAQA,KAAR;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc;AAChB,QAAI,CAACH,KAAK,CAACI,QAAX,EAAqB;AACjBL,MAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGC,KAAK,CAACK,KAAT,CAAR;AACH;AACJ,GAJD;;AAMA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD;AAClB,QAAMC,iBAAiB,GAAGD,KAAK,CAACE,OAAN,KAAkBC,OAAO,CAAC,OAAD,CAAnD;;AAEA,QAAIF,iBAAJ,EAAuB;AACnBL,MAAAA,WAAW;AACd;AACJ,GAND;;AAQA,SACIN,aAAA,CAACc,KAAD;kBACgBT,KAAK,CAACU,WAAN,CAAkBC;KAC1Bb;AACJc,IAAAA,MAAM,EACFjB,aAAA,CAACkB,UAAD;AACIC,MAAAA,IAAI,EAAC;AACLC,MAAAA,SAAS,EAAC;AACVb,MAAAA,QAAQ,EAAEJ,KAAK,CAACI;AAChBc,MAAAA,OAAO,EAAEf;KAJb;AAOJgB,IAAAA,SAAS,EAAEb;AACXR,IAAAA,GAAG,EAAEA;AACLsB,IAAAA,IAAI,EAAC;IAbT,CADJ;AAiBH,CArC0B;;;;"}
1
+ {"version":3,"file":"SearchInput.js","sources":["../../../../src/components/SearchInput/SearchInput.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport keycode from 'keycode';\r\nimport { Input, InputProps, useLocalization, IconButton } from '../..';\r\n\r\nexport type SearchInputTexts = {\r\n /**\r\n * aria-label text for input\r\n */\r\n inputLabel: string;\r\n};\r\n\r\nexport type SearchInputProps = Omit<InputProps, 'icon'> & {\r\n /** Current input value will be passed to the method. In order to get the value, the component must be controlled otherwise value will always be undefined */\r\n onSearch?: (value: string | number | readonly string[] | undefined) => void;\r\n};\r\n\r\nexport const SearchInput = React.forwardRef(function SearchInput(\r\n { onSearch, ...props }: SearchInputProps,\r\n ref: React.Ref<HTMLInputElement>\r\n) {\r\n const { texts } = useLocalization();\r\n\r\n const handleClick = (): void => {\r\n if (!props.disabled) {\r\n onSearch?.(props.value);\r\n }\r\n };\r\n\r\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\r\n const isEnterKeyPressed = event.keyCode === keycode('enter');\r\n\r\n if (isEnterKeyPressed) {\r\n handleClick();\r\n }\r\n };\r\n\r\n return (\r\n <Input\r\n aria-label={texts.searchInput.inputLabel}\r\n {...props}\r\n button={\r\n <IconButton\r\n icon=\"search\"\r\n className=\"!border-transparent !bg-transparent focus:!border-transparent peer-focus:!border-transparent peer-focus:peer-active:!border-transparent\"\r\n disabled={props.disabled}\r\n onClick={handleClick}\r\n />\r\n }\r\n onKeyDown={handleKeyDown}\r\n ref={ref}\r\n type=\"search\"\r\n />\r\n );\r\n});\r\n"],"names":["SearchInput","React","onSearch","props","ref","texts","useLocalization","handleClick","disabled","value","handleKeyDown","event","isEnterKeyPressed","keyCode","keycode","Input","searchInput","inputLabel","button","IconButton","icon","className","onClick","onKeyDown","type"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAgBaA,WAAW,gBAAGC,UAAA,CAAiB,SAASD,WAAT,CACxC;AAAEE,EAAAA,QAAF;AAAY,KAAGC;AAAf,CADwC,EAExCC,GAFwC;AAIxC,QAAM;AAAEC,IAAAA;AAAF,MAAYC,eAAe,EAAjC;;AAEA,QAAMC,WAAW,GAAG;AAChB,QAAI,CAACJ,KAAK,CAACK,QAAX,EAAqB;AACjBN,MAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGC,KAAK,CAACM,KAAT,CAAR;AACH;AACJ,GAJD;;AAMA,QAAMC,aAAa,GAAIC,KAAD;AAClB,UAAMC,iBAAiB,GAAGD,KAAK,CAACE,OAAN,KAAkBC,OAAO,CAAC,OAAD,CAAnD;;AAEA,QAAIF,iBAAJ,EAAuB;AACnBL,MAAAA,WAAW;AACd;AACJ,GAND;;AAQA,SACIN,aAAA,CAACc,KAAD;kBACgBV,KAAK,CAACW,WAAN,CAAkBC;KAC1Bd;AACJe,IAAAA,MAAM,EACFjB,aAAA,CAACkB,UAAD;AACIC,MAAAA,IAAI,EAAC;AACLC,MAAAA,SAAS,EAAC;AACVb,MAAAA,QAAQ,EAAEL,KAAK,CAACK;AAChBc,MAAAA,OAAO,EAAEf;KAJb;AAOJgB,IAAAA,SAAS,EAAEb;AACXN,IAAAA,GAAG,EAAEA;AACLoB,IAAAA,IAAI,EAAC;IAbT,CADJ;AAiBH,CArC0B;;;;"}
@@ -1,4 +1,3 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import { forwardRef, createElement, useRef, useEffect, Fragment } from 'react';
3
2
  import cn from 'classnames';
4
3
  import { Icon } from '../Icon/Icon.js';
@@ -10,54 +9,52 @@ import { Combobox } from '../Combobox/Combobox.js';
10
9
  import { MultiListbox, Listbox } from '../Listbox/Listbox.js';
11
10
  import { useSelect } from './useSelect.js';
12
11
 
13
- var _excluded = ["autoFocus", "className", "highlighted", "style"],
14
- _excluded2 = ["editable"];
15
- var BaseSelect = /*#__PURE__*/forwardRef(function BaseSelect(props, ref) {
16
- var autoFocus = props.autoFocus,
17
- externalClassName = props.className,
18
- style = props.style,
19
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
20
-
21
- var _useSelect = useSelect(otherProps, ref),
22
- button = _useSelect.button,
23
- listbox = _useSelect.listbox,
24
- popover = _useSelect.popover,
25
- input = _useSelect.input,
26
- text = _useSelect.text,
27
- _useSelect$more = _useSelect.more,
28
- more = _useSelect$more === void 0 ? 0 : _useSelect$more;
29
-
30
- var internalRef = useRef(null);
31
- var selectDimensions = useBoundingClientRectListener(internalRef);
32
- var className = cn('inline-flex relative w-full', {
12
+ const BaseSelect = /*#__PURE__*/forwardRef(function BaseSelect(props, ref) {
13
+ const {
14
+ autoFocus,
15
+ className: externalClassName,
16
+ highlighted,
17
+ style,
18
+ ...otherProps
19
+ } = props;
20
+ const {
21
+ button,
22
+ listbox,
23
+ popover,
24
+ input,
25
+ text,
26
+ more = 0
27
+ } = useSelect(otherProps, ref);
28
+ const internalRef = useRef(null);
29
+ const selectDimensions = useBoundingClientRectListener(internalRef);
30
+ const className = cn('inline-flex relative w-full', {
33
31
  'yt-select--readonly': props.readOnly
34
32
  }, externalClassName);
35
- var inputClassname = cn(getInputClasses(props), 'h-8 text-left pr-0', {
33
+ const inputClassname = cn(getInputClasses(props), 'h-8 text-left pr-0', {
36
34
  'border-blue': popover.open
37
35
  });
38
- useEffect(function () {
36
+ useEffect(() => {
39
37
  if (autoFocus && internalRef.current) {
40
38
  internalRef.current.focus();
41
39
  }
42
40
  }, []);
43
41
 
44
- var renderMultiSelection = function renderMultiSelection() {
42
+ const renderMultiSelection = () => {
45
43
  return createElement(Fragment, null, createElement("span", {
46
44
  className: "flex-grow truncate text-left"
47
45
  }, text), more > 0 && createElement(Badge, {
48
46
  className: "ml-2"
49
- }, "+" + more));
47
+ }, `+${more}`));
50
48
  };
51
49
 
52
- var commonListboxProps = _extends({}, listbox, {
50
+ const commonListboxProps = { ...listbox,
53
51
  className: 'w-auto',
54
52
  invalid: undefined,
55
53
  style: {
56
54
  minWidth: selectDimensions === null || selectDimensions === void 0 ? void 0 : selectDimensions.width
57
55
  },
58
56
  tabIndex: popover.open ? 0 : -1
59
- });
60
-
57
+ };
61
58
  return createElement("span", {
62
59
  className: className,
63
60
  "data-taco": "select",
@@ -80,9 +77,11 @@ var BaseSelect = /*#__PURE__*/forwardRef(function BaseSelect(props, ref) {
80
77
  type: "text"
81
78
  }))));
82
79
  });
83
- var Select = /*#__PURE__*/forwardRef(function Select(props, ref) {
84
- var editable = props.editable,
85
- otherProps = _objectWithoutPropertiesLoose(props, _excluded2);
80
+ const Select = /*#__PURE__*/forwardRef(function Select(props, ref) {
81
+ const {
82
+ editable,
83
+ ...otherProps
84
+ } = props;
86
85
 
87
86
  if (editable) {
88
87
  return createElement(Combobox, Object.assign({}, otherProps, {
@@ -1 +1 @@
1
- {"version":3,"file":"Select.js","sources":["../../../../src/components/Select/Select.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\r\nimport { Icon } from '../Icon/Icon';\r\nimport { Listbox, MultiListbox, ListboxProps } from '../Listbox/Listbox';\r\nimport { useBoundingClientRectListener } from '../../utils/hooks/useBoundingClientRectListener';\r\nimport { useSelect } from './useSelect';\r\nimport { Combobox, ComboboxProps } from '../Combobox/Combobox';\r\nimport { Badge } from '../Badge/Badge';\r\nimport { getInputClasses } from '../Input/util';\r\n\r\nexport type SelectTexts = {\r\n /**\r\n * The text displayed when all options are selected when multiselect mode in on.\r\n */\r\n allOptionsSelected: string;\r\n};\r\n\r\nexport type BaseSelectProps = Omit<ListboxProps, 'dialog'> &\r\n Omit<ComboboxProps, 'inline'> & {\r\n /**\r\n * Allows to select multiple values.\r\n * All the selected values will be combined in a comma-seperated string as the value of the input.\r\n */\r\n multiselect?: boolean;\r\n };\r\n\r\nexport type SelectProps = BaseSelectProps & {\r\n /**\r\n * Creates an editable select.\r\n * Setting this will render a inline Combobox which will display the provided data on click/focus,\r\n * even if there is no value in the input.\r\n * After user starts typing, matching data will be displayed.\r\n */\r\n editable?: boolean;\r\n};\r\n\r\nconst BaseSelect = React.forwardRef(function BaseSelect(props: BaseSelectProps, ref: React.Ref<HTMLInputElement>) {\r\n const { autoFocus, className: externalClassName, highlighted, style, ...otherProps } = props;\r\n const { button, listbox, popover, input, text, more = 0 } = useSelect(otherProps, ref);\r\n const internalRef = React.useRef<HTMLButtonElement>(null);\r\n const selectDimensions = useBoundingClientRectListener(internalRef);\r\n const className = cn('inline-flex relative w-full', { 'yt-select--readonly': props.readOnly }, externalClassName);\r\n const inputClassname = cn(getInputClasses(props), 'h-8 text-left pr-0', {\r\n 'border-blue': popover.open,\r\n });\r\n\r\n React.useEffect(() => {\r\n if (autoFocus && internalRef.current) {\r\n internalRef.current.focus();\r\n }\r\n }, []);\r\n\r\n const renderMultiSelection = (): React.ReactNode => {\r\n return (\r\n <>\r\n <span className=\"flex-grow truncate text-left\">{text}</span>\r\n {more > 0 && <Badge className=\"ml-2\">{`+${more}`}</Badge>}\r\n </>\r\n );\r\n };\r\n\r\n const commonListboxProps = {\r\n ...listbox,\r\n className: 'w-auto',\r\n invalid: undefined,\r\n style: { minWidth: selectDimensions?.width },\r\n tabIndex: popover.open ? 0 : -1,\r\n };\r\n\r\n return (\r\n <span className={className} data-taco=\"select\" style={style}>\r\n <PopoverPrimitive.Root {...popover}>\r\n <PopoverPrimitive.Trigger {...button} className={inputClassname} ref={internalRef}>\r\n {props.multiselect ? renderMultiSelection() : <span className=\"flex-grow truncate text-left\">{text}</span>}\r\n <span className=\"flex h-8 w-8 items-center justify-center\">\r\n <Icon className=\"pointer-events-none\" name={popover.open ? 'chevron-up' : 'chevron-down'} />\r\n </span>\r\n </PopoverPrimitive.Trigger>\r\n <PopoverPrimitive.Content align=\"start\" sideOffset={4}>\r\n {props.multiselect ? <MultiListbox {...commonListboxProps} /> : <Listbox {...commonListboxProps} />}\r\n </PopoverPrimitive.Content>\r\n <input {...input} className=\"hidden\" type=\"text\" />\r\n </PopoverPrimitive.Root>\r\n </span>\r\n );\r\n});\r\n\r\nexport const Select = React.forwardRef(function Select(props: SelectProps, ref: React.Ref<HTMLInputElement>) {\r\n const { editable, ...otherProps } = props;\r\n\r\n if (editable) {\r\n return <Combobox {...otherProps} dialog={undefined} inline ref={ref} />;\r\n }\r\n\r\n return <BaseSelect {...otherProps} ref={ref} />;\r\n});\r\n"],"names":["BaseSelect","React","props","ref","autoFocus","externalClassName","className","style","otherProps","useSelect","button","listbox","popover","input","text","more","internalRef","selectDimensions","useBoundingClientRectListener","cn","readOnly","inputClassname","getInputClasses","open","current","focus","renderMultiSelection","Badge","commonListboxProps","invalid","undefined","minWidth","width","tabIndex","PopoverPrimitive","multiselect","Icon","name","align","sideOffset","MultiListbox","Listbox","type","Select","editable","Combobox","dialog","inline"],"mappings":"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"}
1
+ {"version":3,"file":"Select.js","sources":["../../../../src/components/Select/Select.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\r\nimport { Icon } from '../Icon/Icon';\r\nimport { Listbox, MultiListbox, ListboxProps } from '../Listbox/Listbox';\r\nimport { useBoundingClientRectListener } from '../../utils/hooks/useBoundingClientRectListener';\r\nimport { useSelect } from './useSelect';\r\nimport { Combobox, ComboboxProps } from '../Combobox/Combobox';\r\nimport { Badge } from '../Badge/Badge';\r\nimport { getInputClasses } from '../Input/util';\r\n\r\nexport type SelectTexts = {\r\n /**\r\n * The text displayed when all options are selected when multiselect mode in on.\r\n */\r\n allOptionsSelected: string;\r\n};\r\n\r\nexport type BaseSelectProps = Omit<ListboxProps, 'dialog'> &\r\n Omit<ComboboxProps, 'inline'> & {\r\n /**\r\n * Allows to select multiple values.\r\n * All the selected values will be combined in a comma-seperated string as the value of the input.\r\n */\r\n multiselect?: boolean;\r\n };\r\n\r\nexport type SelectProps = BaseSelectProps & {\r\n /**\r\n * Creates an editable select.\r\n * Setting this will render a inline Combobox which will display the provided data on click/focus,\r\n * even if there is no value in the input.\r\n * After user starts typing, matching data will be displayed.\r\n */\r\n editable?: boolean;\r\n};\r\n\r\nconst BaseSelect = React.forwardRef(function BaseSelect(props: BaseSelectProps, ref: React.Ref<HTMLInputElement>) {\r\n const { autoFocus, className: externalClassName, highlighted, style, ...otherProps } = props;\r\n const { button, listbox, popover, input, text, more = 0 } = useSelect(otherProps, ref);\r\n const internalRef = React.useRef<HTMLButtonElement>(null);\r\n const selectDimensions = useBoundingClientRectListener(internalRef);\r\n const className = cn('inline-flex relative w-full', { 'yt-select--readonly': props.readOnly }, externalClassName);\r\n const inputClassname = cn(getInputClasses(props), 'h-8 text-left pr-0', {\r\n 'border-blue': popover.open,\r\n });\r\n\r\n React.useEffect(() => {\r\n if (autoFocus && internalRef.current) {\r\n internalRef.current.focus();\r\n }\r\n }, []);\r\n\r\n const renderMultiSelection = (): React.ReactNode => {\r\n return (\r\n <>\r\n <span className=\"flex-grow truncate text-left\">{text}</span>\r\n {more > 0 && <Badge className=\"ml-2\">{`+${more}`}</Badge>}\r\n </>\r\n );\r\n };\r\n\r\n const commonListboxProps = {\r\n ...listbox,\r\n className: 'w-auto',\r\n invalid: undefined,\r\n style: { minWidth: selectDimensions?.width },\r\n tabIndex: popover.open ? 0 : -1,\r\n };\r\n\r\n return (\r\n <span className={className} data-taco=\"select\" style={style}>\r\n <PopoverPrimitive.Root {...popover}>\r\n <PopoverPrimitive.Trigger {...button} className={inputClassname} ref={internalRef}>\r\n {props.multiselect ? renderMultiSelection() : <span className=\"flex-grow truncate text-left\">{text}</span>}\r\n <span className=\"flex h-8 w-8 items-center justify-center\">\r\n <Icon className=\"pointer-events-none\" name={popover.open ? 'chevron-up' : 'chevron-down'} />\r\n </span>\r\n </PopoverPrimitive.Trigger>\r\n <PopoverPrimitive.Content align=\"start\" sideOffset={4}>\r\n {props.multiselect ? <MultiListbox {...commonListboxProps} /> : <Listbox {...commonListboxProps} />}\r\n </PopoverPrimitive.Content>\r\n <input {...input} className=\"hidden\" type=\"text\" />\r\n </PopoverPrimitive.Root>\r\n </span>\r\n );\r\n});\r\n\r\nexport const Select = React.forwardRef(function Select(props: SelectProps, ref: React.Ref<HTMLInputElement>) {\r\n const { editable, ...otherProps } = props;\r\n\r\n if (editable) {\r\n return <Combobox {...otherProps} dialog={undefined} inline ref={ref} />;\r\n }\r\n\r\n return <BaseSelect {...otherProps} ref={ref} />;\r\n});\r\n"],"names":["BaseSelect","React","props","ref","autoFocus","className","externalClassName","highlighted","style","otherProps","button","listbox","popover","input","text","more","useSelect","internalRef","selectDimensions","useBoundingClientRectListener","cn","readOnly","inputClassname","getInputClasses","open","current","focus","renderMultiSelection","Badge","commonListboxProps","invalid","undefined","minWidth","width","tabIndex","PopoverPrimitive","multiselect","Icon","name","align","sideOffset","MultiListbox","Listbox","type","Select","editable","Combobox","dialog","inline"],"mappings":"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"}
@@ -35,18 +35,15 @@ const useSelect = ({
35
35
  useEffect(() => {
36
36
  setLastValue(value);
37
37
  }, [open]);
38
- useEffect(() => {
39
- if (defaultValue !== undefined && value === undefined) {
40
- setInputValueByRef(internalInputRef.current, defaultValue);
41
- }
42
- }, [defaultValue]);
43
38
  useEffect(() => {
44
39
  // If emptyValue is defined, then set emptyValue
45
40
  if (emptyValue !== undefined && value === emptyValue) {
46
41
  setInputValueByRef(internalInputRef.current, value);
47
42
  } else if (value !== undefined && data.some(option => option.value === value)) {
48
43
  setInputValueByRef(internalInputRef.current, value);
49
- } else if (data.length && defaultValue === undefined) {
44
+ } else if (value === undefined && defaultValue !== undefined && data.some(option => option.value === defaultValue)) {
45
+ setInputValueByRef(internalInputRef.current, defaultValue);
46
+ } else if (value === undefined && data.length && defaultValue === undefined) {
50
47
  setInputValueByRef(internalInputRef.current, data[0].value);
51
48
  }
52
49
  }, []); // event handlers
@@ -1 +1 @@
1
- {"version":3,"file":"useSelect.js","sources":["../../../../src/components/Select/useSelect.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport keycode from 'keycode';\r\nimport cn from 'classnames';\r\nimport { v4 as uuid } from 'uuid';\r\nimport { useLocalization } from '../Provider/Provider';\r\nimport { SelectProps } from './Select';\r\nimport { ListboxProps } from '../Listbox/Listbox';\r\nimport { useProxiedRef } from '../../utils/hooks/useProxiedRef';\r\nimport { setInputValueByRef, findByValue, useFlattenedData, sanitizeItem } from '../Listbox/util';\r\nimport { ScrollableListItemValue } from '../Listbox/ScrollableList';\r\n\r\ntype useSelect = React.HtmlHTMLAttributes<HTMLDivElement> & {\r\n button: React.ButtonHTMLAttributes<HTMLButtonElement>;\r\n listbox: ListboxProps;\r\n input: any;\r\n popover: { open: boolean; onOpenChange: (open: boolean) => void };\r\n text: string | JSX.Element;\r\n more?: number;\r\n};\r\n\r\nexport const useSelect = (\r\n {\r\n 'aria-label': ariaLabel,\r\n 'aria-labelledby': ariaLabelledBy,\r\n data = [],\r\n defaultValue,\r\n disabled,\r\n emptyValue,\r\n id: nativeId,\r\n multiselect,\r\n onClick,\r\n onChange,\r\n readOnly,\r\n value = emptyValue,\r\n ...otherProps\r\n }: SelectProps,\r\n ref: React.Ref<HTMLInputElement>\r\n): useSelect => {\r\n const { texts } = useLocalization();\r\n const searchData = useFlattenedData(data);\r\n const inputRef = useProxiedRef<HTMLInputElement>(ref);\r\n const [open, setOpen] = React.useState(false);\r\n const id = React.useMemo(() => nativeId || `select_${uuid()}`, [nativeId]);\r\n const internalInputRef = React.useRef(null);\r\n const buttonId = `${id}-button`;\r\n // support 'escape' resetting to the value that was set when the listbox opened\r\n const [lastValue, setLastValue] = React.useState<ScrollableListItemValue | undefined>(value);\r\n\r\n React.useEffect(() => {\r\n setLastValue(value);\r\n }, [open]);\r\n\r\n React.useEffect(() => {\r\n if (defaultValue !== undefined && value === undefined) {\r\n setInputValueByRef(internalInputRef.current, defaultValue);\r\n }\r\n }, [defaultValue]);\r\n\r\n React.useEffect(() => {\r\n // If emptyValue is defined, then set emptyValue\r\n if (emptyValue !== undefined && value === emptyValue) {\r\n setInputValueByRef(internalInputRef.current, value);\r\n } else if (value !== undefined && data.some(option => option.value === value)) {\r\n setInputValueByRef(internalInputRef.current, value);\r\n } else if (data.length && defaultValue === undefined) {\r\n setInputValueByRef(internalInputRef.current, data[0].value);\r\n }\r\n }, []);\r\n\r\n // event handlers\r\n const handleButtonKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>): void => {\r\n if (event.keyCode === keycode('up') || event.keyCode === keycode('down')) {\r\n event.preventDefault();\r\n setOpen(true);\r\n }\r\n };\r\n\r\n const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\r\n switch (event.keyCode) {\r\n case keycode('escape'): {\r\n event.preventDefault();\r\n if (lastValue !== undefined) {\r\n setInputValueByRef(inputRef.current, lastValue);\r\n }\r\n\r\n setOpen(false);\r\n break;\r\n }\r\n\r\n case keycode('tab'):\r\n case keycode('enter'): {\r\n if (event.keyCode !== keycode('tab')) {\r\n event.preventDefault();\r\n }\r\n setOpen(false);\r\n break;\r\n }\r\n\r\n default:\r\n }\r\n\r\n if (otherProps.onKeyDown) {\r\n otherProps.onKeyDown(event);\r\n }\r\n };\r\n\r\n const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>): void => {\r\n event.preventDefault();\r\n if (!multiselect) {\r\n setOpen(false);\r\n }\r\n };\r\n\r\n let text: string | JSX.Element = '';\r\n let more = 0;\r\n\r\n if (value !== undefined) {\r\n if (multiselect) {\r\n const selectedValues = value?.toString().split(',') || [];\r\n\r\n if (selectedValues.length === searchData.filter(item => !item.disabled).length) {\r\n text = texts.select.allOptionsSelected;\r\n } else {\r\n text = findByValue(searchData, selectedValues[0])?.text ?? '';\r\n more = selectedValues.length > 1 ? selectedValues.length - 1 : 0;\r\n }\r\n } else {\r\n const item = findByValue(searchData, value);\r\n\r\n if (item) {\r\n text = item.icon ? (\r\n <>\r\n {React.cloneElement(item.icon, {\r\n className: cn(item.icon.props.className, 'mr-1 -mt-px'),\r\n })}\r\n {item.text}\r\n </>\r\n ) : (\r\n item.text\r\n );\r\n }\r\n }\r\n }\r\n\r\n const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\r\n event.persist();\r\n\r\n if (onChange) {\r\n const item = findByValue(searchData, event.target.value);\r\n (event as any).detail = sanitizeItem(item);\r\n\r\n const indexes = item?.path?.split('.') ?? [];\r\n\r\n if (indexes.length > 1) {\r\n // we don't want to map the current item\r\n indexes.pop();\r\n // we need to rebuild the path as we map\r\n let lastPath: string;\r\n\r\n (event as any).detail.parents = indexes.map(i => {\r\n lastPath = lastPath ? [lastPath, i].join('.') : i;\r\n return sanitizeItem(searchData.find(i => i.path === lastPath));\r\n });\r\n }\r\n\r\n onChange(event);\r\n }\r\n };\r\n\r\n const button: React.ButtonHTMLAttributes<HTMLButtonElement> = {\r\n 'aria-haspopup': 'listbox' as const,\r\n 'aria-label': ariaLabel ? `${ariaLabel} ${text}` : undefined,\r\n 'aria-labelledby': ariaLabelledBy ? `${ariaLabelledBy} ${buttonId}` : undefined,\r\n disabled,\r\n id: buttonId,\r\n onKeyDown: !disabled && !readOnly ? handleButtonKeyDown : undefined,\r\n type: 'button',\r\n };\r\n\r\n const listbox = {\r\n ...otherProps,\r\n 'aria-label': ariaLabel,\r\n 'aria-labelledby': ariaLabelledBy,\r\n data,\r\n disabled,\r\n emptyValue,\r\n onClick: handleListboxClick,\r\n onChange: event => {\r\n setInputValueByRef(internalInputRef.current, event.target?.value);\r\n },\r\n onKeyDown: handleListboxKeyDown,\r\n ref: inputRef,\r\n value,\r\n multiselect,\r\n };\r\n\r\n const input = {\r\n onChange: handleInputChange,\r\n ref: internalInputRef,\r\n value: value ?? '',\r\n };\r\n\r\n return {\r\n button,\r\n listbox,\r\n input,\r\n popover: {\r\n open,\r\n onOpenChange: setOpen,\r\n },\r\n text,\r\n more,\r\n };\r\n};\r\n"],"names":["useSelect","ariaLabel","ariaLabelledBy","data","defaultValue","disabled","emptyValue","id","nativeId","multiselect","onClick","onChange","readOnly","value","otherProps","ref","texts","useLocalization","searchData","useFlattenedData","inputRef","useProxiedRef","open","setOpen","React","uuid","internalInputRef","buttonId","lastValue","setLastValue","undefined","setInputValueByRef","current","some","option","length","handleButtonKeyDown","event","keyCode","keycode","preventDefault","handleListboxKeyDown","onKeyDown","handleListboxClick","text","more","selectedValues","toString","split","filter","item","select","allOptionsSelected","findByValue","icon","className","cn","props","handleInputChange","persist","target","detail","sanitizeItem","indexes","path","pop","lastPath","parents","map","i","join","find","button","type","listbox","input","popover","onOpenChange"],"mappings":"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"}
1
+ {"version":3,"file":"useSelect.js","sources":["../../../../src/components/Select/useSelect.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport keycode from 'keycode';\r\nimport cn from 'classnames';\r\nimport { v4 as uuid } from 'uuid';\r\nimport { useLocalization } from '../Provider/Provider';\r\nimport { SelectProps } from './Select';\r\nimport { ListboxProps } from '../Listbox/Listbox';\r\nimport { useProxiedRef } from '../../utils/hooks/useProxiedRef';\r\nimport { setInputValueByRef, findByValue, useFlattenedData, sanitizeItem } from '../Listbox/util';\r\nimport { ScrollableListItemValue } from '../Listbox/ScrollableList';\r\n\r\ntype useSelect = React.HtmlHTMLAttributes<HTMLDivElement> & {\r\n button: React.ButtonHTMLAttributes<HTMLButtonElement>;\r\n listbox: ListboxProps;\r\n input: any;\r\n popover: { open: boolean; onOpenChange: (open: boolean) => void };\r\n text: string | JSX.Element;\r\n more?: number;\r\n};\r\n\r\nexport const useSelect = (\r\n {\r\n 'aria-label': ariaLabel,\r\n 'aria-labelledby': ariaLabelledBy,\r\n data = [],\r\n defaultValue,\r\n disabled,\r\n emptyValue,\r\n id: nativeId,\r\n multiselect,\r\n onClick,\r\n onChange,\r\n readOnly,\r\n value = emptyValue,\r\n ...otherProps\r\n }: SelectProps,\r\n ref: React.Ref<HTMLInputElement>\r\n): useSelect => {\r\n const { texts } = useLocalization();\r\n const searchData = useFlattenedData(data);\r\n const inputRef = useProxiedRef<HTMLInputElement>(ref);\r\n const [open, setOpen] = React.useState(false);\r\n const id = React.useMemo(() => nativeId || `select_${uuid()}`, [nativeId]);\r\n const internalInputRef = React.useRef(null);\r\n const buttonId = `${id}-button`;\r\n // support 'escape' resetting to the value that was set when the listbox opened\r\n const [lastValue, setLastValue] = React.useState<ScrollableListItemValue | undefined>(value);\r\n\r\n React.useEffect(() => {\r\n setLastValue(value);\r\n }, [open]);\r\n\r\n React.useEffect(() => {\r\n // If emptyValue is defined, then set emptyValue\r\n if (emptyValue !== undefined && value === emptyValue) {\r\n setInputValueByRef(internalInputRef.current, value);\r\n } else if (value !== undefined && data.some(option => option.value === value)) {\r\n setInputValueByRef(internalInputRef.current, value);\r\n } else if (value === undefined && defaultValue !== undefined && data.some(option => option.value === defaultValue)) {\r\n setInputValueByRef(internalInputRef.current, defaultValue);\r\n } else if (value === undefined && data.length && defaultValue === undefined) {\r\n setInputValueByRef(internalInputRef.current, data[0].value);\r\n }\r\n }, []);\r\n\r\n // event handlers\r\n const handleButtonKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>): void => {\r\n if (event.keyCode === keycode('up') || event.keyCode === keycode('down')) {\r\n event.preventDefault();\r\n setOpen(true);\r\n }\r\n };\r\n\r\n const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\r\n switch (event.keyCode) {\r\n case keycode('escape'): {\r\n event.preventDefault();\r\n if (lastValue !== undefined) {\r\n setInputValueByRef(inputRef.current, lastValue);\r\n }\r\n\r\n setOpen(false);\r\n break;\r\n }\r\n\r\n case keycode('tab'):\r\n case keycode('enter'): {\r\n if (event.keyCode !== keycode('tab')) {\r\n event.preventDefault();\r\n }\r\n setOpen(false);\r\n break;\r\n }\r\n\r\n default:\r\n }\r\n\r\n if (otherProps.onKeyDown) {\r\n otherProps.onKeyDown(event);\r\n }\r\n };\r\n\r\n const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>): void => {\r\n event.preventDefault();\r\n if (!multiselect) {\r\n setOpen(false);\r\n }\r\n };\r\n\r\n let text: string | JSX.Element = '';\r\n let more = 0;\r\n\r\n if (value !== undefined) {\r\n if (multiselect) {\r\n const selectedValues = value?.toString().split(',') || [];\r\n\r\n if (selectedValues.length === searchData.filter(item => !item.disabled).length) {\r\n text = texts.select.allOptionsSelected;\r\n } else {\r\n text = findByValue(searchData, selectedValues[0])?.text ?? '';\r\n more = selectedValues.length > 1 ? selectedValues.length - 1 : 0;\r\n }\r\n } else {\r\n const item = findByValue(searchData, value);\r\n\r\n if (item) {\r\n text = item.icon ? (\r\n <>\r\n {React.cloneElement(item.icon, {\r\n className: cn(item.icon.props.className, 'mr-1 -mt-px'),\r\n })}\r\n {item.text}\r\n </>\r\n ) : (\r\n item.text\r\n );\r\n }\r\n }\r\n }\r\n\r\n const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\r\n event.persist();\r\n\r\n if (onChange) {\r\n const item = findByValue(searchData, event.target.value);\r\n (event as any).detail = sanitizeItem(item);\r\n\r\n const indexes = item?.path?.split('.') ?? [];\r\n\r\n if (indexes.length > 1) {\r\n // we don't want to map the current item\r\n indexes.pop();\r\n // we need to rebuild the path as we map\r\n let lastPath: string;\r\n\r\n (event as any).detail.parents = indexes.map(i => {\r\n lastPath = lastPath ? [lastPath, i].join('.') : i;\r\n return sanitizeItem(searchData.find(i => i.path === lastPath));\r\n });\r\n }\r\n\r\n onChange(event);\r\n }\r\n };\r\n\r\n const button: React.ButtonHTMLAttributes<HTMLButtonElement> = {\r\n 'aria-haspopup': 'listbox' as const,\r\n 'aria-label': ariaLabel ? `${ariaLabel} ${text}` : undefined,\r\n 'aria-labelledby': ariaLabelledBy ? `${ariaLabelledBy} ${buttonId}` : undefined,\r\n disabled,\r\n id: buttonId,\r\n onKeyDown: !disabled && !readOnly ? handleButtonKeyDown : undefined,\r\n type: 'button',\r\n };\r\n\r\n const listbox = {\r\n ...otherProps,\r\n 'aria-label': ariaLabel,\r\n 'aria-labelledby': ariaLabelledBy,\r\n data,\r\n disabled,\r\n emptyValue,\r\n onClick: handleListboxClick,\r\n onChange: event => {\r\n setInputValueByRef(internalInputRef.current, event.target?.value);\r\n },\r\n onKeyDown: handleListboxKeyDown,\r\n ref: inputRef,\r\n value,\r\n multiselect,\r\n };\r\n\r\n const input = {\r\n onChange: handleInputChange,\r\n ref: internalInputRef,\r\n value: value ?? '',\r\n };\r\n\r\n return {\r\n button,\r\n listbox,\r\n input,\r\n popover: {\r\n open,\r\n onOpenChange: setOpen,\r\n },\r\n text,\r\n more,\r\n };\r\n};\r\n"],"names":["useSelect","ariaLabel","ariaLabelledBy","data","defaultValue","disabled","emptyValue","id","nativeId","multiselect","onClick","onChange","readOnly","value","otherProps","ref","texts","useLocalization","searchData","useFlattenedData","inputRef","useProxiedRef","open","setOpen","React","uuid","internalInputRef","buttonId","lastValue","setLastValue","undefined","setInputValueByRef","current","some","option","length","handleButtonKeyDown","event","keyCode","keycode","preventDefault","handleListboxKeyDown","onKeyDown","handleListboxClick","text","more","selectedValues","toString","split","filter","item","select","allOptionsSelected","findByValue","icon","className","cn","props","handleInputChange","persist","target","detail","sanitizeItem","indexes","path","pop","lastPath","parents","map","i","join","find","button","type","listbox","input","popover","onOpenChange"],"mappings":"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"}
@@ -1,28 +1,21 @@
1
- import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
1
  import React__default from 'react';
3
2
  import cn from 'classnames';
4
3
 
5
- var _excluded = ["delay", "label"];
6
- var Spinner = /*#__PURE__*/React__default.forwardRef(function Spinner(props, ref) {
7
- var _props$delay = props.delay,
8
- delay = _props$delay === void 0 ? 500 : _props$delay,
9
- label = props.label,
10
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
11
-
12
- var _React$useState = React__default.useState(!delay),
13
- visible = _React$useState[0],
14
- setVisibility = _React$useState[1];
15
-
16
- React__default.useEffect(function () {
17
- var timeout;
4
+ const Spinner = /*#__PURE__*/React__default.forwardRef(function Spinner(props, ref) {
5
+ const {
6
+ delay = 500,
7
+ label,
8
+ ...otherProps
9
+ } = props;
10
+ const [visible, setVisibility] = React__default.useState(!delay);
11
+ React__default.useEffect(() => {
12
+ let timeout;
18
13
 
19
14
  if (delay) {
20
- timeout = window.setTimeout(function () {
21
- return setVisibility(true);
22
- }, delay);
15
+ timeout = window.setTimeout(() => setVisibility(true), delay);
23
16
  }
24
17
 
25
- return function () {
18
+ return () => {
26
19
  if (timeout) {
27
20
  clearTimeout(timeout);
28
21
  }
@@ -33,7 +26,7 @@ var Spinner = /*#__PURE__*/React__default.forwardRef(function Spinner(props, ref
33
26
  return null;
34
27
  }
35
28
 
36
- var className = cn('inline-flex flex-col relative items-center', otherProps.className);
29
+ const className = cn('inline-flex flex-col relative items-center', otherProps.className);
37
30
  return React__default.createElement("div", Object.assign({}, otherProps, {
38
31
  className: className,
39
32
  "data-taco": "spinner",
@@ -1 +1 @@
1
- {"version":3,"file":"Spinner.js","sources":["../../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\nimport './Spinner.css';\r\n\r\nexport type SpinnerProps = React.HTMLAttributes<HTMLDivElement> & {\r\n /**\r\n * Define a delay in milliseconds after which the spinner is shown.\r\n * Default value is `500`ms\r\n */\r\n delay?: number;\r\n /** Define a text that will be displayed below spinner */\r\n label?: string;\r\n};\r\n\r\nexport const Spinner = React.forwardRef(function Spinner(props: SpinnerProps, ref: React.Ref<HTMLDivElement>) {\r\n const { delay = 500, label, ...otherProps } = props;\r\n const [visible, setVisibility] = React.useState(!delay);\r\n\r\n React.useEffect(() => {\r\n let timeout: number;\r\n\r\n if (delay) {\r\n timeout = window.setTimeout(() => setVisibility(true), delay);\r\n }\r\n\r\n return () => {\r\n if (timeout) {\r\n clearTimeout(timeout);\r\n }\r\n };\r\n }, [delay]);\r\n\r\n if (!visible) {\r\n return null;\r\n }\r\n\r\n const className = cn('inline-flex flex-col relative items-center', otherProps.className);\r\n\r\n return (\r\n <div {...otherProps} className={className} data-taco=\"spinner\" ref={ref}>\r\n <svg\r\n className=\"h-10 w-10 animate-[spinnerRotation_2s_linear_infinite]\"\r\n viewBox=\"0 0 100 100\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <circle cx=\"50\" cy=\"50\" r=\"45\"></circle>\r\n </svg>\r\n {label && <span className=\"mt-4\">{label}</span>}\r\n </div>\r\n );\r\n});\r\n"],"names":["Spinner","React","forwardRef","props","ref","delay","label","otherProps","useState","visible","setVisibility","useEffect","timeout","window","setTimeout","clearTimeout","className","cn","viewBox","xmlns","cx","cy","r"],"mappings":";;;;;IAcaA,OAAO,gBAAGC,cAAK,CAACC,UAAN,CAAiB,SAASF,OAAT,CAAiBG,KAAjB,EAAsCC,GAAtC;AACpC,qBAA8CD,KAA9C,CAAQE,KAAR;AAAA,MAAQA,KAAR,6BAAgB,GAAhB;AAAA,MAAqBC,KAArB,GAA8CH,KAA9C,CAAqBG,KAArB;AAAA,MAA+BC,UAA/B,iCAA8CJ,KAA9C;;AACA,wBAAiCF,cAAK,CAACO,QAAN,CAAe,CAACH,KAAhB,CAAjC;AAAA,MAAOI,OAAP;AAAA,MAAgBC,aAAhB;;AAEAT,EAAAA,cAAK,CAACU,SAAN,CAAgB;AACZ,QAAIC,OAAJ;;AAEA,QAAIP,KAAJ,EAAW;AACPO,MAAAA,OAAO,GAAGC,MAAM,CAACC,UAAP,CAAkB;AAAA,eAAMJ,aAAa,CAAC,IAAD,CAAnB;AAAA,OAAlB,EAA6CL,KAA7C,CAAV;AACH;;AAED,WAAO;AACH,UAAIO,OAAJ,EAAa;AACTG,QAAAA,YAAY,CAACH,OAAD,CAAZ;AACH;AACJ,KAJD;AAKH,GAZD,EAYG,CAACP,KAAD,CAZH;;AAcA,MAAI,CAACI,OAAL,EAAc;AACV,WAAO,IAAP;AACH;;AAED,MAAMO,SAAS,GAAGC,EAAE,CAAC,4CAAD,EAA+CV,UAAU,CAACS,SAA1D,CAApB;AAEA,SACIf,4BAAA,MAAA,oBAASM;AAAYS,IAAAA,SAAS,EAAEA;iBAAqB;AAAUZ,IAAAA,GAAG,EAAEA;IAApE,EACIH,4BAAA,MAAA;AACIe,IAAAA,SAAS,EAAC;AACVE,IAAAA,OAAO,EAAC;AACRC,IAAAA,KAAK,EAAC;GAHV,EAKIlB,4BAAA,SAAA;AAAQmB,IAAAA,EAAE,EAAC;AAAKC,IAAAA,EAAE,EAAC;AAAKC,IAAAA,CAAC,EAAC;GAA1B,CALJ,CADJ,EAQKhB,KAAK,IAAIL,4BAAA,OAAA;AAAMe,IAAAA,SAAS,EAAC;GAAhB,EAAwBV,KAAxB,CARd,CADJ;AAYH,CApCsB;;;;"}
1
+ {"version":3,"file":"Spinner.js","sources":["../../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\nimport './Spinner.css';\r\n\r\nexport type SpinnerProps = React.HTMLAttributes<HTMLDivElement> & {\r\n /**\r\n * Define a delay in milliseconds after which the spinner is shown.\r\n * Default value is `500`ms\r\n */\r\n delay?: number;\r\n /** Define a text that will be displayed below spinner */\r\n label?: string;\r\n};\r\n\r\nexport const Spinner = React.forwardRef(function Spinner(props: SpinnerProps, ref: React.Ref<HTMLDivElement>) {\r\n const { delay = 500, label, ...otherProps } = props;\r\n const [visible, setVisibility] = React.useState(!delay);\r\n\r\n React.useEffect(() => {\r\n let timeout: number;\r\n\r\n if (delay) {\r\n timeout = window.setTimeout(() => setVisibility(true), delay);\r\n }\r\n\r\n return () => {\r\n if (timeout) {\r\n clearTimeout(timeout);\r\n }\r\n };\r\n }, [delay]);\r\n\r\n if (!visible) {\r\n return null;\r\n }\r\n\r\n const className = cn('inline-flex flex-col relative items-center', otherProps.className);\r\n\r\n return (\r\n <div {...otherProps} className={className} data-taco=\"spinner\" ref={ref}>\r\n <svg\r\n className=\"h-10 w-10 animate-[spinnerRotation_2s_linear_infinite]\"\r\n viewBox=\"0 0 100 100\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <circle cx=\"50\" cy=\"50\" r=\"45\"></circle>\r\n </svg>\r\n {label && <span className=\"mt-4\">{label}</span>}\r\n </div>\r\n );\r\n});\r\n"],"names":["Spinner","React","forwardRef","props","ref","delay","label","otherProps","visible","setVisibility","useState","useEffect","timeout","window","setTimeout","clearTimeout","className","cn","viewBox","xmlns","cx","cy","r"],"mappings":";;;MAcaA,OAAO,gBAAGC,cAAK,CAACC,UAAN,CAAiB,SAASF,OAAT,CAAiBG,KAAjB,EAAsCC,GAAtC;AACpC,QAAM;AAAEC,IAAAA,KAAK,GAAG,GAAV;AAAeC,IAAAA,KAAf;AAAsB,OAAGC;AAAzB,MAAwCJ,KAA9C;AACA,QAAM,CAACK,OAAD,EAAUC,aAAV,IAA2BR,cAAK,CAACS,QAAN,CAAe,CAACL,KAAhB,CAAjC;AAEAJ,EAAAA,cAAK,CAACU,SAAN,CAAgB;AACZ,QAAIC,OAAJ;;AAEA,QAAIP,KAAJ,EAAW;AACPO,MAAAA,OAAO,GAAGC,MAAM,CAACC,UAAP,CAAkB,MAAML,aAAa,CAAC,IAAD,CAArC,EAA6CJ,KAA7C,CAAV;AACH;;AAED,WAAO;AACH,UAAIO,OAAJ,EAAa;AACTG,QAAAA,YAAY,CAACH,OAAD,CAAZ;AACH;AACJ,KAJD;AAKH,GAZD,EAYG,CAACP,KAAD,CAZH;;AAcA,MAAI,CAACG,OAAL,EAAc;AACV,WAAO,IAAP;AACH;;AAED,QAAMQ,SAAS,GAAGC,EAAE,CAAC,4CAAD,EAA+CV,UAAU,CAACS,SAA1D,CAApB;AAEA,SACIf,4BAAA,MAAA,oBAASM;AAAYS,IAAAA,SAAS,EAAEA;iBAAqB;AAAUZ,IAAAA,GAAG,EAAEA;IAApE,EACIH,4BAAA,MAAA;AACIe,IAAAA,SAAS,EAAC;AACVE,IAAAA,OAAO,EAAC;AACRC,IAAAA,KAAK,EAAC;GAHV,EAKIlB,4BAAA,SAAA;AAAQmB,IAAAA,EAAE,EAAC;AAAKC,IAAAA,EAAE,EAAC;AAAKC,IAAAA,CAAC,EAAC;GAA1B,CALJ,CADJ,EAQKhB,KAAK,IAAIL,4BAAA,OAAA;AAAMe,IAAAA,SAAS,EAAC;GAAhB,EAAwBV,KAAxB,CARd,CADJ;AAYH,CApCsB;;;;"}
@@ -1,20 +1,19 @@
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 { Root, Thumb } from '@radix-ui/react-switch';
5
4
 
6
- var _excluded = ["label", "onChange"];
7
- var Switch = /*#__PURE__*/forwardRef(function Switch(props, ref) {
8
- var label = props.label,
9
- onChange = props.onChange,
10
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
11
-
12
- var className = cn('group h-6 w-10 flex rounded-full inline-flex', {
5
+ const Switch = /*#__PURE__*/forwardRef(function Switch(props, ref) {
6
+ const {
7
+ label,
8
+ onChange,
9
+ ...otherProps
10
+ } = props;
11
+ const className = cn('group h-6 w-10 flex rounded-full inline-flex', {
13
12
  'mr-2': !!label,
14
13
  'bg-grey-darker aria-checked:bg-blue focus:yt-focus': !props.disabled,
15
14
  'bg-grey-light cursor-not-allowed aria-checked:bg-blue-light': props.disabled
16
15
  }, props.className);
17
- var element = createElement(Root, Object.assign({}, otherProps, {
16
+ const element = createElement(Root, Object.assign({}, otherProps, {
18
17
  className: className,
19
18
  onCheckedChange: onChange,
20
19
  ref: ref
@@ -23,7 +22,7 @@ var Switch = /*#__PURE__*/forwardRef(function Switch(props, ref) {
23
22
  }));
24
23
 
25
24
  if (label) {
26
- var labelClassName = cn('flex items-center cursor-pointer', {
25
+ const labelClassName = cn('flex items-center cursor-pointer', {
27
26
  'cursor-not-allowed text-grey-dark': props.disabled
28
27
  });
29
28
  return createElement("label", {
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.js","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport * as PrimitiveSwitch from '@radix-ui/react-switch';\r\n\r\ntype SwitchBaseProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onChange'> & {\r\n /** Label for the switch */\r\n label?: React.ReactNode;\r\n /* Whether user input is required */\r\n required?: boolean;\r\n};\r\n\r\ninterface UncontrolledSwitchProps extends SwitchBaseProps {\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 ControlledSwitchProps extends SwitchBaseProps {\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 SwitchProps = UncontrolledSwitchProps | ControlledSwitchProps;\r\n\r\nexport const Switch = React.forwardRef(function Switch(props: SwitchProps, ref: React.Ref<HTMLButtonElement>) {\r\n const { label, onChange, ...otherProps } = props;\r\n\r\n const className = cn(\r\n 'group h-6 w-10 flex rounded-full inline-flex',\r\n {\r\n 'mr-2': !!label,\r\n 'bg-grey-darker aria-checked:bg-blue focus:yt-focus': !props.disabled,\r\n 'bg-grey-light cursor-not-allowed aria-checked:bg-blue-light': props.disabled,\r\n },\r\n props.className\r\n );\r\n\r\n const element = (\r\n <PrimitiveSwitch.Root {...otherProps} className={className} onCheckedChange={onChange} ref={ref}>\r\n <PrimitiveSwitch.Thumb className=\"'will-change-transform transition-transform translate-x-1 group-aria-checked:translate-x-5 h-4 w-4 mt-1 bg-white rounded-full\" />\r\n </PrimitiveSwitch.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":["Switch","React","props","ref","label","onChange","otherProps","className","cn","disabled","element","PrimitiveSwitch","onCheckedChange","labelClassName"],"mappings":";;;;;;IA4BaA,MAAM,gBAAGC,UAAA,CAAiB,SAASD,MAAT,CAAgBE,KAAhB,EAAoCC,GAApC;AACnC,MAAQC,KAAR,GAA2CF,KAA3C,CAAQE,KAAR;AAAA,MAAeC,QAAf,GAA2CH,KAA3C,CAAeG,QAAf;AAAA,MAA4BC,UAA5B,iCAA2CJ,KAA3C;;AAEA,MAAMK,SAAS,GAAGC,EAAE,CAChB,8CADgB,EAEhB;AACI,YAAQ,CAAC,CAACJ,KADd;AAEI,0DAAsD,CAACF,KAAK,CAACO,QAFjE;AAGI,mEAA+DP,KAAK,CAACO;AAHzE,GAFgB,EAOhBP,KAAK,CAACK,SAPU,CAApB;AAUA,MAAMG,OAAO,GACTT,aAAA,CAACU,IAAD,oBAA0BL;AAAYC,IAAAA,SAAS,EAAEA;AAAWK,IAAAA,eAAe,EAAEP;AAAUF,IAAAA,GAAG,EAAEA;IAA5F,EACIF,aAAA,CAACU,KAAD;AAAuBJ,IAAAA,SAAS,EAAC;GAAjC,CADJ,CADJ;;AAMA,MAAIH,KAAJ,EAAW;AACP,QAAMS,cAAc,GAAGL,EAAE,CAAC,kCAAD,EAAqC;AAC1D,2CAAqCN,KAAK,CAACO;AADe,KAArC,CAAzB;AAIA,WACIR,aAAA,QAAA;AAAOM,MAAAA,SAAS,EAAEM;KAAlB,EACKH,OADL,EAEKN,KAFL,CADJ;AAMH;;AAED,SAAOM,OAAP;AACH,CAjCqB;;;;"}
1
+ {"version":3,"file":"Switch.js","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport * as PrimitiveSwitch from '@radix-ui/react-switch';\r\n\r\ntype SwitchBaseProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onChange'> & {\r\n /** Label for the switch */\r\n label?: React.ReactNode;\r\n /* Whether user input is required */\r\n required?: boolean;\r\n};\r\n\r\ninterface UncontrolledSwitchProps extends SwitchBaseProps {\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 ControlledSwitchProps extends SwitchBaseProps {\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 SwitchProps = UncontrolledSwitchProps | ControlledSwitchProps;\r\n\r\nexport const Switch = React.forwardRef(function Switch(props: SwitchProps, ref: React.Ref<HTMLButtonElement>) {\r\n const { label, onChange, ...otherProps } = props;\r\n\r\n const className = cn(\r\n 'group h-6 w-10 flex rounded-full inline-flex',\r\n {\r\n 'mr-2': !!label,\r\n 'bg-grey-darker aria-checked:bg-blue focus:yt-focus': !props.disabled,\r\n 'bg-grey-light cursor-not-allowed aria-checked:bg-blue-light': props.disabled,\r\n },\r\n props.className\r\n );\r\n\r\n const element = (\r\n <PrimitiveSwitch.Root {...otherProps} className={className} onCheckedChange={onChange} ref={ref}>\r\n <PrimitiveSwitch.Thumb className=\"'will-change-transform transition-transform translate-x-1 group-aria-checked:translate-x-5 h-4 w-4 mt-1 bg-white rounded-full\" />\r\n </PrimitiveSwitch.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":["Switch","React","props","ref","label","onChange","otherProps","className","cn","disabled","element","PrimitiveSwitch","onCheckedChange","labelClassName"],"mappings":";;;;MA4BaA,MAAM,gBAAGC,UAAA,CAAiB,SAASD,MAAT,CAAgBE,KAAhB,EAAoCC,GAApC;AACnC,QAAM;AAAEC,IAAAA,KAAF;AAASC,IAAAA,QAAT;AAAmB,OAAGC;AAAtB,MAAqCJ,KAA3C;AAEA,QAAMK,SAAS,GAAGC,EAAE,CAChB,8CADgB,EAEhB;AACI,YAAQ,CAAC,CAACJ,KADd;AAEI,0DAAsD,CAACF,KAAK,CAACO,QAFjE;AAGI,mEAA+DP,KAAK,CAACO;AAHzE,GAFgB,EAOhBP,KAAK,CAACK,SAPU,CAApB;AAUA,QAAMG,OAAO,GACTT,aAAA,CAACU,IAAD,oBAA0BL;AAAYC,IAAAA,SAAS,EAAEA;AAAWK,IAAAA,eAAe,EAAEP;AAAUF,IAAAA,GAAG,EAAEA;IAA5F,EACIF,aAAA,CAACU,KAAD;AAAuBJ,IAAAA,SAAS,EAAC;GAAjC,CADJ,CADJ;;AAMA,MAAIH,KAAJ,EAAW;AACP,UAAMS,cAAc,GAAGL,EAAE,CAAC,kCAAD,EAAqC;AAC1D,2CAAqCN,KAAK,CAACO;AADe,KAArC,CAAzB;AAIA,WACIR,aAAA,QAAA;AAAOM,MAAAA,SAAS,EAAEM;KAAlB,EACKH,OADL,EAEKN,KAFL,CADJ;AAMH;;AAED,SAAOM,OAAP;AACH,CAjCqB;;;;"}
@@ -1,21 +1,17 @@
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 { Root, List, Trigger, Content } from '@radix-ui/react-tabs';
5
4
 
6
- var _excluded = ["id", "defaultId", "children", "onChange", "orientation"],
7
- _excluded2 = ["id", "disabled"],
8
- _excluded3 = ["id"];
9
- var Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
10
- var id = props.id,
11
- defaultId = props.defaultId,
12
- children = props.children,
13
- onChange = props.onChange,
14
- _props$orientation = props.orientation,
15
- orientation = _props$orientation === void 0 ? 'horizontal' : _props$orientation,
16
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
17
-
18
- var className = cn('yt-tabs', "yt-tabs--" + orientation, {
5
+ const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
6
+ const {
7
+ id,
8
+ defaultId,
9
+ children,
10
+ onChange,
11
+ orientation = 'horizontal',
12
+ ...otherProps
13
+ } = props;
14
+ const className = cn('yt-tabs', `yt-tabs--${orientation}`, {
19
15
  'flex w-full': orientation === 'vertical'
20
16
  }, props.className);
21
17
  return createElement(Root, Object.assign({}, otherProps, {
@@ -29,19 +25,20 @@ var Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
29
25
  value: id
30
26
  }), children);
31
27
  });
32
- var TabList = /*#__PURE__*/forwardRef(function Tab(props, ref) {
33
- var className = cn('yt-tab__list border-b border-grey-light flex flex-row m-0 mb-4', props.className);
28
+ const TabList = /*#__PURE__*/forwardRef(function Tab(props, ref) {
29
+ const className = cn('yt-tab__list border-b border-grey-light flex flex-row m-0 mb-4', props.className);
34
30
  return createElement(List, Object.assign({}, props, {
35
31
  className: className,
36
32
  ref: ref
37
33
  }));
38
34
  });
39
- var TabTrigger = /*#__PURE__*/forwardRef(function Tab(props, ref) {
40
- var id = props.id,
41
- disabled = props.disabled,
42
- otherProps = _objectWithoutPropertiesLoose(props, _excluded2);
43
-
44
- var className = cn('yt-tab bg-transparent border-b-2 border-transparent text-grey-darkest m-0 py-2 px-4', disabled ? 'cursor-not-allowed !text-grey' : 'cursor-pointer rounded-t hover:border-grey-light hover:text-black active:yt-focus active:border-blue focus:yt-focus focus:border-blue', props.className);
35
+ const TabTrigger = /*#__PURE__*/forwardRef(function Tab(props, ref) {
36
+ const {
37
+ id,
38
+ disabled,
39
+ ...otherProps
40
+ } = props;
41
+ const className = cn('yt-tab bg-transparent border-b-2 border-transparent text-grey-darkest m-0 py-2 px-4', disabled ? 'cursor-not-allowed !text-grey' : 'cursor-pointer rounded-t hover:border-grey-light hover:text-black active:yt-focus active:border-blue focus:yt-focus focus:border-blue', props.className);
45
42
  return createElement(Trigger, Object.assign({}, otherProps, {
46
43
  className: className,
47
44
  disabled: disabled,
@@ -52,11 +49,12 @@ var TabTrigger = /*#__PURE__*/forwardRef(function Tab(props, ref) {
52
49
  value: id
53
50
  }));
54
51
  });
55
- var TabContent = /*#__PURE__*/forwardRef(function Tab(props, ref) {
56
- var id = props.id,
57
- otherProps = _objectWithoutPropertiesLoose(props, _excluded3);
58
-
59
- var className = cn('yt-tab__panel outline-none', props.className);
52
+ const TabContent = /*#__PURE__*/forwardRef(function Tab(props, ref) {
53
+ const {
54
+ id,
55
+ ...otherProps
56
+ } = props;
57
+ const className = cn('yt-tab__panel outline-none', props.className);
60
58
  return createElement(Content, Object.assign({}, otherProps, {
61
59
  className: className,
62
60
  ref: ref,
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.js","sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport * as TabsPrimitive from '@radix-ui/react-tabs';\r\n\r\nimport { Orientation } from '../../types';\r\nimport './Tabs.css';\r\n\r\nexport type TabsProps = React.HTMLAttributes<HTMLDivElement> & {\r\n /**\r\n * The controlled value of the tab to activate. Should be used in conjunction with `onChange`.\r\n */\r\n id?: string;\r\n /**\r\n * Set which tab is selected on mount.\r\n * This has to be one of the existing ids provided for tabs\r\n */\r\n defaultId?: string;\r\n /**\r\n * Content should be one or an array of `Tabs.Trigger` components inside `Tabs.List` and then\r\n * followed by one or an array of `Tabs.Content`.\r\n * *Note* that there can also be tabs that are rendered conditionally.\r\n */\r\n children: React.ReactNode;\r\n /**\r\n * Define orientation of tabs.\r\n * @defaultValue horizontal\r\n */\r\n orientation?: Orientation;\r\n /**\r\n * Callback that is called when tab is changed.\r\n */\r\n onChange?: (id: string) => void;\r\n};\r\n\r\nexport type TabListProps = React.HTMLAttributes<HTMLDivElement>;\r\n\r\nexport type TabTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\r\n /**\r\n * A unique value that associates the trigger with a content.\r\n */\r\n id: string;\r\n /**\r\n * When true, prevents the user from interacting with the tab.\r\n */\r\n disabled?: boolean;\r\n};\r\n\r\nexport type TabContentProps = React.HTMLAttributes<HTMLDivElement> & {\r\n /**\r\n * A unique value that associates the content with a trigger.\r\n */\r\n id: string;\r\n};\r\n\r\nexport type ForwardedTabsWithStatics = React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>> & {\r\n /** Tab list component containing all tab triggers, rendered in a `Tabs` group component */\r\n List: React.ForwardRefExoticComponent<TabListProps & React.RefAttributes<HTMLDivElement>>;\r\n /** Tab trigger component rendered in a `Tabs.List` component */\r\n Trigger: React.ForwardRefExoticComponent<TabTriggerProps & React.RefAttributes<HTMLButtonElement>>;\r\n /** Tab content component rendered in a `Tabs` group component */\r\n Content: React.ForwardRefExoticComponent<TabContentProps & React.RefAttributes<HTMLDivElement>>;\r\n};\r\n\r\nexport const Tabs = React.forwardRef(function Tabs(props: TabsProps, ref: React.Ref<HTMLDivElement>) {\r\n const { id, defaultId, children, onChange, orientation = 'horizontal', ...otherProps } = props;\r\n const className = cn(\r\n 'yt-tabs',\r\n `yt-tabs--${orientation}`,\r\n {\r\n 'flex w-full': orientation === 'vertical',\r\n },\r\n props.className\r\n );\r\n\r\n return (\r\n <TabsPrimitive.Root\r\n {...otherProps}\r\n className={className}\r\n data-taco=\"tabs\"\r\n defaultValue={defaultId}\r\n dir=\"ltr\"\r\n onValueChange={onChange}\r\n orientation={orientation}\r\n ref={ref}\r\n value={id}\r\n >\r\n {children}\r\n </TabsPrimitive.Root>\r\n );\r\n}) as ForwardedTabsWithStatics;\r\n\r\nconst TabList = React.forwardRef(function Tab(props: TabListProps, ref: React.Ref<HTMLDivElement>) {\r\n const className = cn('yt-tab__list border-b border-grey-light flex flex-row m-0 mb-4', props.className);\r\n\r\n return <TabsPrimitive.List {...props} className={className} ref={ref} />;\r\n});\r\n\r\nconst TabTrigger = React.forwardRef(function Tab(props: TabTriggerProps, ref: React.Ref<HTMLButtonElement>) {\r\n const { id, disabled, ...otherProps } = props;\r\n const className = cn(\r\n 'yt-tab bg-transparent border-b-2 border-transparent text-grey-darkest m-0 py-2 px-4',\r\n disabled\r\n ? 'cursor-not-allowed !text-grey'\r\n : 'cursor-pointer rounded-t hover:border-grey-light hover:text-black active:yt-focus active:border-blue focus:yt-focus focus:border-blue',\r\n props.className\r\n );\r\n\r\n return (\r\n <TabsPrimitive.Trigger\r\n {...otherProps}\r\n className={className}\r\n disabled={disabled}\r\n ref={ref}\r\n style={{\r\n transition: 'border 0.2s ease-in',\r\n }}\r\n value={id}\r\n />\r\n );\r\n});\r\n\r\nconst TabContent = React.forwardRef(function Tab(props: TabContentProps, ref: React.Ref<HTMLDivElement>) {\r\n const { id, ...otherProps } = props;\r\n const className = cn('yt-tab__panel outline-none', props.className);\r\n\r\n return <TabsPrimitive.Content {...otherProps} className={className} ref={ref} value={id} />;\r\n});\r\n\r\nTabs.List = TabList;\r\nTabs.Trigger = TabTrigger;\r\nTabs.Content = TabContent;\r\n"],"names":["Tabs","React","props","ref","id","defaultId","children","onChange","orientation","otherProps","className","cn","TabsPrimitive","defaultValue","dir","onValueChange","value","TabList","Tab","TabTrigger","disabled","style","transition","TabContent","List","Trigger","Content"],"mappings":";;;;;;;;IA+DaA,IAAI,gBAAGC,UAAA,CAAiB,SAASD,IAAT,CAAcE,KAAd,EAAgCC,GAAhC;AACjC,MAAQC,EAAR,GAAyFF,KAAzF,CAAQE,EAAR;AAAA,MAAYC,SAAZ,GAAyFH,KAAzF,CAAYG,SAAZ;AAAA,MAAuBC,QAAvB,GAAyFJ,KAAzF,CAAuBI,QAAvB;AAAA,MAAiCC,QAAjC,GAAyFL,KAAzF,CAAiCK,QAAjC;AAAA,2BAAyFL,KAAzF,CAA2CM,WAA3C;AAAA,MAA2CA,WAA3C,mCAAyD,YAAzD;AAAA,MAA0EC,UAA1E,iCAAyFP,KAAzF;;AACA,MAAMQ,SAAS,GAAGC,EAAE,CAChB,SADgB,gBAEJH,WAFI,EAGhB;AACI,mBAAeA,WAAW,KAAK;AADnC,GAHgB,EAMhBN,KAAK,CAACQ,SANU,CAApB;AASA,SACIT,aAAA,CAACW,IAAD,oBACQH;AACJC,IAAAA,SAAS,EAAEA;iBACD;AACVG,IAAAA,YAAY,EAAER;AACdS,IAAAA,GAAG,EAAC;AACJC,IAAAA,aAAa,EAAER;AACfC,IAAAA,WAAW,EAAEA;AACbL,IAAAA,GAAG,EAAEA;AACLa,IAAAA,KAAK,EAAEZ;IATX,EAWKE,QAXL,CADJ;AAeH,CA1BmB;AA4BpB,IAAMW,OAAO,gBAAGhB,UAAA,CAAiB,SAASiB,GAAT,CAAahB,KAAb,EAAkCC,GAAlC;AAC7B,MAAMO,SAAS,GAAGC,EAAE,CAAC,gEAAD,EAAmET,KAAK,CAACQ,SAAzE,CAApB;AAEA,SAAOT,aAAA,CAACW,IAAD,oBAAwBV;AAAOQ,IAAAA,SAAS,EAAEA;AAAWP,IAAAA,GAAG,EAAEA;IAA1D,CAAP;AACH,CAJe,CAAhB;AAMA,IAAMgB,UAAU,gBAAGlB,UAAA,CAAiB,SAASiB,GAAT,CAAahB,KAAb,EAAqCC,GAArC;AAChC,MAAQC,EAAR,GAAwCF,KAAxC,CAAQE,EAAR;AAAA,MAAYgB,QAAZ,GAAwClB,KAAxC,CAAYkB,QAAZ;AAAA,MAAyBX,UAAzB,iCAAwCP,KAAxC;;AACA,MAAMQ,SAAS,GAAGC,EAAE,CAChB,qFADgB,EAEhBS,QAAQ,GACF,+BADE,GAEF,uIAJU,EAKhBlB,KAAK,CAACQ,SALU,CAApB;AAQA,SACIT,aAAA,CAACW,OAAD,oBACQH;AACJC,IAAAA,SAAS,EAAEA;AACXU,IAAAA,QAAQ,EAAEA;AACVjB,IAAAA,GAAG,EAAEA;AACLkB,IAAAA,KAAK,EAAE;AACHC,MAAAA,UAAU,EAAE;AADT;AAGPN,IAAAA,KAAK,EAAEZ;IARX,CADJ;AAYH,CAtBkB,CAAnB;AAwBA,IAAMmB,UAAU,gBAAGtB,UAAA,CAAiB,SAASiB,GAAT,CAAahB,KAAb,EAAqCC,GAArC;AAChC,MAAQC,EAAR,GAA8BF,KAA9B,CAAQE,EAAR;AAAA,MAAeK,UAAf,iCAA8BP,KAA9B;;AACA,MAAMQ,SAAS,GAAGC,EAAE,CAAC,4BAAD,EAA+BT,KAAK,CAACQ,SAArC,CAApB;AAEA,SAAOT,aAAA,CAACW,OAAD,oBAA2BH;AAAYC,IAAAA,SAAS,EAAEA;AAAWP,IAAAA,GAAG,EAAEA;AAAKa,IAAAA,KAAK,EAAEZ;IAA9E,CAAP;AACH,CALkB,CAAnB;AAOAJ,IAAI,CAACwB,IAAL,GAAYP,OAAZ;AACAjB,IAAI,CAACyB,OAAL,GAAeN,UAAf;AACAnB,IAAI,CAAC0B,OAAL,GAAeH,UAAf;;;;"}
1
+ {"version":3,"file":"Tabs.js","sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport * as TabsPrimitive from '@radix-ui/react-tabs';\r\n\r\nimport { Orientation } from '../../types';\r\nimport './Tabs.css';\r\n\r\nexport type TabsProps = React.HTMLAttributes<HTMLDivElement> & {\r\n /**\r\n * The controlled value of the tab to activate. Should be used in conjunction with `onChange`.\r\n */\r\n id?: string;\r\n /**\r\n * Set which tab is selected on mount.\r\n * This has to be one of the existing ids provided for tabs\r\n */\r\n defaultId?: string;\r\n /**\r\n * Content should be one or an array of `Tabs.Trigger` components inside `Tabs.List` and then\r\n * followed by one or an array of `Tabs.Content`.\r\n * *Note* that there can also be tabs that are rendered conditionally.\r\n */\r\n children: React.ReactNode;\r\n /**\r\n * Define orientation of tabs.\r\n * @defaultValue horizontal\r\n */\r\n orientation?: Orientation;\r\n /**\r\n * Callback that is called when tab is changed.\r\n */\r\n onChange?: (id: string) => void;\r\n};\r\n\r\nexport type TabListProps = React.HTMLAttributes<HTMLDivElement>;\r\n\r\nexport type TabTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\r\n /**\r\n * A unique value that associates the trigger with a content.\r\n */\r\n id: string;\r\n /**\r\n * When true, prevents the user from interacting with the tab.\r\n */\r\n disabled?: boolean;\r\n};\r\n\r\nexport type TabContentProps = React.HTMLAttributes<HTMLDivElement> & {\r\n /**\r\n * A unique value that associates the content with a trigger.\r\n */\r\n id: string;\r\n};\r\n\r\nexport type ForwardedTabsWithStatics = React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>> & {\r\n /** Tab list component containing all tab triggers, rendered in a `Tabs` group component */\r\n List: React.ForwardRefExoticComponent<TabListProps & React.RefAttributes<HTMLDivElement>>;\r\n /** Tab trigger component rendered in a `Tabs.List` component */\r\n Trigger: React.ForwardRefExoticComponent<TabTriggerProps & React.RefAttributes<HTMLButtonElement>>;\r\n /** Tab content component rendered in a `Tabs` group component */\r\n Content: React.ForwardRefExoticComponent<TabContentProps & React.RefAttributes<HTMLDivElement>>;\r\n};\r\n\r\nexport const Tabs = React.forwardRef(function Tabs(props: TabsProps, ref: React.Ref<HTMLDivElement>) {\r\n const { id, defaultId, children, onChange, orientation = 'horizontal', ...otherProps } = props;\r\n const className = cn(\r\n 'yt-tabs',\r\n `yt-tabs--${orientation}`,\r\n {\r\n 'flex w-full': orientation === 'vertical',\r\n },\r\n props.className\r\n );\r\n\r\n return (\r\n <TabsPrimitive.Root\r\n {...otherProps}\r\n className={className}\r\n data-taco=\"tabs\"\r\n defaultValue={defaultId}\r\n dir=\"ltr\"\r\n onValueChange={onChange}\r\n orientation={orientation}\r\n ref={ref}\r\n value={id}\r\n >\r\n {children}\r\n </TabsPrimitive.Root>\r\n );\r\n}) as ForwardedTabsWithStatics;\r\n\r\nconst TabList = React.forwardRef(function Tab(props: TabListProps, ref: React.Ref<HTMLDivElement>) {\r\n const className = cn('yt-tab__list border-b border-grey-light flex flex-row m-0 mb-4', props.className);\r\n\r\n return <TabsPrimitive.List {...props} className={className} ref={ref} />;\r\n});\r\n\r\nconst TabTrigger = React.forwardRef(function Tab(props: TabTriggerProps, ref: React.Ref<HTMLButtonElement>) {\r\n const { id, disabled, ...otherProps } = props;\r\n const className = cn(\r\n 'yt-tab bg-transparent border-b-2 border-transparent text-grey-darkest m-0 py-2 px-4',\r\n disabled\r\n ? 'cursor-not-allowed !text-grey'\r\n : 'cursor-pointer rounded-t hover:border-grey-light hover:text-black active:yt-focus active:border-blue focus:yt-focus focus:border-blue',\r\n props.className\r\n );\r\n\r\n return (\r\n <TabsPrimitive.Trigger\r\n {...otherProps}\r\n className={className}\r\n disabled={disabled}\r\n ref={ref}\r\n style={{\r\n transition: 'border 0.2s ease-in',\r\n }}\r\n value={id}\r\n />\r\n );\r\n});\r\n\r\nconst TabContent = React.forwardRef(function Tab(props: TabContentProps, ref: React.Ref<HTMLDivElement>) {\r\n const { id, ...otherProps } = props;\r\n const className = cn('yt-tab__panel outline-none', props.className);\r\n\r\n return <TabsPrimitive.Content {...otherProps} className={className} ref={ref} value={id} />;\r\n});\r\n\r\nTabs.List = TabList;\r\nTabs.Trigger = TabTrigger;\r\nTabs.Content = TabContent;\r\n"],"names":["Tabs","React","props","ref","id","defaultId","children","onChange","orientation","otherProps","className","cn","TabsPrimitive","defaultValue","dir","onValueChange","value","TabList","Tab","TabTrigger","disabled","style","transition","TabContent","List","Trigger","Content"],"mappings":";;;;MA+DaA,IAAI,gBAAGC,UAAA,CAAiB,SAASD,IAAT,CAAcE,KAAd,EAAgCC,GAAhC;AACjC,QAAM;AAAEC,IAAAA,EAAF;AAAMC,IAAAA,SAAN;AAAiBC,IAAAA,QAAjB;AAA2BC,IAAAA,QAA3B;AAAqCC,IAAAA,WAAW,GAAG,YAAnD;AAAiE,OAAGC;AAApE,MAAmFP,KAAzF;AACA,QAAMQ,SAAS,GAAGC,EAAE,CAChB,SADgB,cAEJH,aAFI,EAGhB;AACI,mBAAeA,WAAW,KAAK;AADnC,GAHgB,EAMhBN,KAAK,CAACQ,SANU,CAApB;AASA,SACIT,aAAA,CAACW,IAAD,oBACQH;AACJC,IAAAA,SAAS,EAAEA;iBACD;AACVG,IAAAA,YAAY,EAAER;AACdS,IAAAA,GAAG,EAAC;AACJC,IAAAA,aAAa,EAAER;AACfC,IAAAA,WAAW,EAAEA;AACbL,IAAAA,GAAG,EAAEA;AACLa,IAAAA,KAAK,EAAEZ;IATX,EAWKE,QAXL,CADJ;AAeH,CA1BmB;AA4BpB,MAAMW,OAAO,gBAAGhB,UAAA,CAAiB,SAASiB,GAAT,CAAahB,KAAb,EAAkCC,GAAlC;AAC7B,QAAMO,SAAS,GAAGC,EAAE,CAAC,gEAAD,EAAmET,KAAK,CAACQ,SAAzE,CAApB;AAEA,SAAOT,aAAA,CAACW,IAAD,oBAAwBV;AAAOQ,IAAAA,SAAS,EAAEA;AAAWP,IAAAA,GAAG,EAAEA;IAA1D,CAAP;AACH,CAJe,CAAhB;AAMA,MAAMgB,UAAU,gBAAGlB,UAAA,CAAiB,SAASiB,GAAT,CAAahB,KAAb,EAAqCC,GAArC;AAChC,QAAM;AAAEC,IAAAA,EAAF;AAAMgB,IAAAA,QAAN;AAAgB,OAAGX;AAAnB,MAAkCP,KAAxC;AACA,QAAMQ,SAAS,GAAGC,EAAE,CAChB,qFADgB,EAEhBS,QAAQ,GACF,+BADE,GAEF,uIAJU,EAKhBlB,KAAK,CAACQ,SALU,CAApB;AAQA,SACIT,aAAA,CAACW,OAAD,oBACQH;AACJC,IAAAA,SAAS,EAAEA;AACXU,IAAAA,QAAQ,EAAEA;AACVjB,IAAAA,GAAG,EAAEA;AACLkB,IAAAA,KAAK,EAAE;AACHC,MAAAA,UAAU,EAAE;AADT;AAGPN,IAAAA,KAAK,EAAEZ;IARX,CADJ;AAYH,CAtBkB,CAAnB;AAwBA,MAAMmB,UAAU,gBAAGtB,UAAA,CAAiB,SAASiB,GAAT,CAAahB,KAAb,EAAqCC,GAArC;AAChC,QAAM;AAAEC,IAAAA,EAAF;AAAM,OAAGK;AAAT,MAAwBP,KAA9B;AACA,QAAMQ,SAAS,GAAGC,EAAE,CAAC,4BAAD,EAA+BT,KAAK,CAACQ,SAArC,CAApB;AAEA,SAAOT,aAAA,CAACW,OAAD,oBAA2BH;AAAYC,IAAAA,SAAS,EAAEA;AAAWP,IAAAA,GAAG,EAAEA;AAAKa,IAAAA,KAAK,EAAEZ;IAA9E,CAAP;AACH,CALkB,CAAnB;AAOAJ,IAAI,CAACwB,IAAL,GAAYP,OAAZ;AACAjB,IAAI,CAACyB,OAAL,GAAeN,UAAf;AACAnB,IAAI,CAAC0B,OAAL,GAAeH,UAAf;;;;"}
@@ -1,21 +1,23 @@
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 { getInputClasses } from '../Input/util.js';
5
4
 
6
- var _excluded = ["defaultValue", "highlighted", "invalid", "onKeyDown"];
7
- var Textarea = /*#__PURE__*/forwardRef(function Textarea(props, ref) {
8
- var onKeyDown = props.onKeyDown,
9
- otherProps = _objectWithoutPropertiesLoose(props, _excluded);
10
-
11
- var classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className); // home and end keys only navigate to the start/end of textarea value if the textarea container does not scroll
5
+ const Textarea = /*#__PURE__*/forwardRef(function Textarea(props, ref) {
6
+ const {
7
+ defaultValue: _,
8
+ highlighted,
9
+ invalid,
10
+ onKeyDown,
11
+ ...otherProps
12
+ } = props;
13
+ const classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className); // home and end keys only navigate to the start/end of textarea value if the textarea container does not scroll
12
14
  // if it has scroll height then the browser reverts to native scrolling behaviour only
13
15
  // so we manually override it to ensure _our_ desired behaviour remains intact
14
16
 
15
- var handleKeyDown = function handleKeyDown(event) {
17
+ const handleKeyDown = event => {
16
18
  if (event.key === 'Home' || event.key === 'End') {
17
19
  event.preventDefault();
18
- var position = event.key === 'End' ? event.currentTarget.value.length : 0;
20
+ const position = event.key === 'End' ? event.currentTarget.value.length : 0;
19
21
  event.currentTarget.setSelectionRange(position, position);
20
22
  event.currentTarget.scrollTop = event.key === 'End' ? event.currentTarget.scrollHeight : 0;
21
23
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Textarea.js","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport { getInputClasses } from '../Input/util';\r\n\r\nexport type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\r\n /** Draws attention to the textarea by changing its style and making it visually prominent */\r\n highlighted?: boolean;\r\n /* Whether the input is in an invalid state */\r\n invalid?: boolean;\r\n /** Value of the textarea */\r\n value?: string;\r\n};\r\n\r\nexport const Textarea = React.forwardRef(function Textarea(props: TextareaProps, ref: React.Ref<HTMLTextAreaElement>) {\r\n const { defaultValue: _, highlighted, invalid, onKeyDown, ...otherProps } = props;\r\n const classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className);\r\n\r\n // home and end keys only navigate to the start/end of textarea value if the textarea container does not scroll\r\n // if it has scroll height then the browser reverts to native scrolling behaviour only\r\n // so we manually override it to ensure _our_ desired behaviour remains intact\r\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\r\n if (event.key === 'Home' || event.key === 'End') {\r\n event.preventDefault();\r\n const position = event.key === 'End' ? event.currentTarget.value.length : 0;\r\n event.currentTarget.setSelectionRange(position, position);\r\n event.currentTarget.scrollTop = event.key === 'End' ? event.currentTarget.scrollHeight : 0;\r\n }\r\n\r\n if (onKeyDown) {\r\n onKeyDown(event);\r\n }\r\n };\r\n\r\n return <textarea {...otherProps} className={classNames} data-taco=\"textarea\" onKeyDown={handleKeyDown} ref={ref} />;\r\n});\r\n"],"names":["Textarea","React","props","ref","onKeyDown","otherProps","classNames","cn","getInputClasses","className","handleKeyDown","event","key","preventDefault","position","currentTarget","value","length","setSelectionRange","scrollTop","scrollHeight"],"mappings":";;;;;;IAaaA,QAAQ,gBAAGC,UAAA,CAAiB,SAASD,QAAT,CAAkBE,KAAlB,EAAwCC,GAAxC;AACrC,MAA+CC,SAA/C,GAA4EF,KAA5E,CAA+CE,SAA/C;AAAA,MAA6DC,UAA7D,iCAA4EH,KAA5E;;AACA,MAAMI,UAAU,GAAGC,EAAE,CAACC,eAAe,CAACN,KAAD,CAAhB,EAAyB,wCAAzB,EAAmEA,KAAK,CAACO,SAAzE,CAArB;AAGA;AACA;;AACA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD;AAClB,QAAIA,KAAK,CAACC,GAAN,KAAc,MAAd,IAAwBD,KAAK,CAACC,GAAN,KAAc,KAA1C,EAAiD;AAC7CD,MAAAA,KAAK,CAACE,cAAN;AACA,UAAMC,QAAQ,GAAGH,KAAK,CAACC,GAAN,KAAc,KAAd,GAAsBD,KAAK,CAACI,aAAN,CAAoBC,KAApB,CAA0BC,MAAhD,GAAyD,CAA1E;AACAN,MAAAA,KAAK,CAACI,aAAN,CAAoBG,iBAApB,CAAsCJ,QAAtC,EAAgDA,QAAhD;AACAH,MAAAA,KAAK,CAACI,aAAN,CAAoBI,SAApB,GAAgCR,KAAK,CAACC,GAAN,KAAc,KAAd,GAAsBD,KAAK,CAACI,aAAN,CAAoBK,YAA1C,GAAyD,CAAzF;AACH;;AAED,QAAIhB,SAAJ,EAAe;AACXA,MAAAA,SAAS,CAACO,KAAD,CAAT;AACH;AACJ,GAXD;;AAaA,SAAOV,aAAA,WAAA,oBAAcI;AAAYI,IAAAA,SAAS,EAAEH;iBAAsB;AAAWF,IAAAA,SAAS,EAAEM;AAAeP,IAAAA,GAAG,EAAEA;IAArG,CAAP;AACH,CArBuB;;;;"}
1
+ {"version":3,"file":"Textarea.js","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport { getInputClasses } from '../Input/util';\r\n\r\nexport type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\r\n /** Draws attention to the textarea by changing its style and making it visually prominent */\r\n highlighted?: boolean;\r\n /* Whether the input is in an invalid state */\r\n invalid?: boolean;\r\n /** Value of the textarea */\r\n value?: string;\r\n};\r\n\r\nexport const Textarea = React.forwardRef(function Textarea(props: TextareaProps, ref: React.Ref<HTMLTextAreaElement>) {\r\n const { defaultValue: _, highlighted, invalid, onKeyDown, ...otherProps } = props;\r\n const classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className);\r\n\r\n // home and end keys only navigate to the start/end of textarea value if the textarea container does not scroll\r\n // if it has scroll height then the browser reverts to native scrolling behaviour only\r\n // so we manually override it to ensure _our_ desired behaviour remains intact\r\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\r\n if (event.key === 'Home' || event.key === 'End') {\r\n event.preventDefault();\r\n const position = event.key === 'End' ? event.currentTarget.value.length : 0;\r\n event.currentTarget.setSelectionRange(position, position);\r\n event.currentTarget.scrollTop = event.key === 'End' ? event.currentTarget.scrollHeight : 0;\r\n }\r\n\r\n if (onKeyDown) {\r\n onKeyDown(event);\r\n }\r\n };\r\n\r\n return <textarea {...otherProps} className={classNames} data-taco=\"textarea\" onKeyDown={handleKeyDown} ref={ref} />;\r\n});\r\n"],"names":["Textarea","React","props","ref","defaultValue","_","highlighted","invalid","onKeyDown","otherProps","classNames","cn","getInputClasses","className","handleKeyDown","event","key","preventDefault","position","currentTarget","value","length","setSelectionRange","scrollTop","scrollHeight"],"mappings":";;;;MAaaA,QAAQ,gBAAGC,UAAA,CAAiB,SAASD,QAAT,CAAkBE,KAAlB,EAAwCC,GAAxC;AACrC,QAAM;AAAEC,IAAAA,YAAY,EAAEC,CAAhB;AAAmBC,IAAAA,WAAnB;AAAgCC,IAAAA,OAAhC;AAAyCC,IAAAA,SAAzC;AAAoD,OAAGC;AAAvD,MAAsEP,KAA5E;AACA,QAAMQ,UAAU,GAAGC,EAAE,CAACC,eAAe,CAACV,KAAD,CAAhB,EAAyB,wCAAzB,EAAmEA,KAAK,CAACW,SAAzE,CAArB;AAGA;AACA;;AACA,QAAMC,aAAa,GAAIC,KAAD;AAClB,QAAIA,KAAK,CAACC,GAAN,KAAc,MAAd,IAAwBD,KAAK,CAACC,GAAN,KAAc,KAA1C,EAAiD;AAC7CD,MAAAA,KAAK,CAACE,cAAN;AACA,YAAMC,QAAQ,GAAGH,KAAK,CAACC,GAAN,KAAc,KAAd,GAAsBD,KAAK,CAACI,aAAN,CAAoBC,KAApB,CAA0BC,MAAhD,GAAyD,CAA1E;AACAN,MAAAA,KAAK,CAACI,aAAN,CAAoBG,iBAApB,CAAsCJ,QAAtC,EAAgDA,QAAhD;AACAH,MAAAA,KAAK,CAACI,aAAN,CAAoBI,SAApB,GAAgCR,KAAK,CAACC,GAAN,KAAc,KAAd,GAAsBD,KAAK,CAACI,aAAN,CAAoBK,YAA1C,GAAyD,CAAzF;AACH;;AAED,QAAIhB,SAAJ,EAAe;AACXA,MAAAA,SAAS,CAACO,KAAD,CAAT;AACH;AACJ,GAXD;;AAaA,SAAOd,aAAA,WAAA,oBAAcQ;AAAYI,IAAAA,SAAS,EAAEH;iBAAsB;AAAWF,IAAAA,SAAS,EAAEM;AAAeX,IAAAA,GAAG,EAAEA;IAArG,CAAP;AACH,CArBuB;;;;"}