@ioca/react 1.4.73 → 1.4.75

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 (84) hide show
  1. package/lib/cjs/components/button/toggle.js +11 -18
  2. package/lib/cjs/components/button/toggle.js.map +1 -1
  3. package/lib/cjs/components/checkbox/checkbox.js +5 -8
  4. package/lib/cjs/components/checkbox/checkbox.js.map +1 -1
  5. package/lib/cjs/components/checkbox/item.js +15 -16
  6. package/lib/cjs/components/checkbox/item.js.map +1 -1
  7. package/lib/cjs/components/collapse/collapse.js +11 -13
  8. package/lib/cjs/components/collapse/collapse.js.map +1 -1
  9. package/lib/cjs/components/form/field.js +16 -20
  10. package/lib/cjs/components/form/field.js.map +1 -1
  11. package/lib/cjs/components/input/input.js +21 -18
  12. package/lib/cjs/components/input/input.js.map +1 -1
  13. package/lib/cjs/components/input/number.js +65 -19
  14. package/lib/cjs/components/input/number.js.map +1 -1
  15. package/lib/cjs/components/input/range.js +10 -13
  16. package/lib/cjs/components/input/range.js.map +1 -1
  17. package/lib/cjs/components/input/textarea.js +4 -7
  18. package/lib/cjs/components/input/textarea.js.map +1 -1
  19. package/lib/cjs/components/picker/colors/footer.js +7 -10
  20. package/lib/cjs/components/picker/colors/footer.js.map +1 -1
  21. package/lib/cjs/components/picker/colors/index.js +23 -21
  22. package/lib/cjs/components/picker/colors/index.js.map +1 -1
  23. package/lib/cjs/components/picker/dates/index.js +9 -12
  24. package/lib/cjs/components/picker/dates/index.js.map +1 -1
  25. package/lib/cjs/components/picker/dates/panel.js +29 -35
  26. package/lib/cjs/components/picker/dates/panel.js.map +1 -1
  27. package/lib/cjs/components/picker/time/index.js +8 -12
  28. package/lib/cjs/components/picker/time/index.js.map +1 -1
  29. package/lib/cjs/components/picker/time/panel.js +38 -21
  30. package/lib/cjs/components/picker/time/panel.js.map +1 -1
  31. package/lib/cjs/components/radio/radio.js +4 -7
  32. package/lib/cjs/components/radio/radio.js.map +1 -1
  33. package/lib/cjs/components/select/select.js +19 -24
  34. package/lib/cjs/components/select/select.js.map +1 -1
  35. package/lib/cjs/components/tabs/tabs.js +80 -79
  36. package/lib/cjs/components/tabs/tabs.js.map +1 -1
  37. package/lib/cjs/components/tree/tree.js +24 -26
  38. package/lib/cjs/components/tree/tree.js.map +1 -1
  39. package/lib/cjs/components/upload/upload.js +26 -33
  40. package/lib/cjs/components/upload/upload.js.map +1 -1
  41. package/lib/css/index.css +1 -1
  42. package/lib/css/index.css.map +1 -1
  43. package/lib/es/components/button/toggle.js +12 -19
  44. package/lib/es/components/button/toggle.js.map +1 -1
  45. package/lib/es/components/checkbox/checkbox.js +6 -9
  46. package/lib/es/components/checkbox/checkbox.js.map +1 -1
  47. package/lib/es/components/checkbox/item.js +16 -17
  48. package/lib/es/components/checkbox/item.js.map +1 -1
  49. package/lib/es/components/collapse/collapse.js +12 -14
  50. package/lib/es/components/collapse/collapse.js.map +1 -1
  51. package/lib/es/components/form/field.js +17 -21
  52. package/lib/es/components/form/field.js.map +1 -1
  53. package/lib/es/components/input/input.js +22 -19
  54. package/lib/es/components/input/input.js.map +1 -1
  55. package/lib/es/components/input/number.js +67 -21
  56. package/lib/es/components/input/number.js.map +1 -1
  57. package/lib/es/components/input/range.js +11 -14
  58. package/lib/es/components/input/range.js.map +1 -1
  59. package/lib/es/components/input/textarea.js +5 -8
  60. package/lib/es/components/input/textarea.js.map +1 -1
  61. package/lib/es/components/picker/colors/footer.js +8 -11
  62. package/lib/es/components/picker/colors/footer.js.map +1 -1
  63. package/lib/es/components/picker/colors/index.js +24 -22
  64. package/lib/es/components/picker/colors/index.js.map +1 -1
  65. package/lib/es/components/picker/dates/index.js +9 -12
  66. package/lib/es/components/picker/dates/index.js.map +1 -1
  67. package/lib/es/components/picker/dates/panel.js +30 -36
  68. package/lib/es/components/picker/dates/panel.js.map +1 -1
  69. package/lib/es/components/picker/time/index.js +8 -12
  70. package/lib/es/components/picker/time/index.js.map +1 -1
  71. package/lib/es/components/picker/time/panel.js +39 -22
  72. package/lib/es/components/picker/time/panel.js.map +1 -1
  73. package/lib/es/components/radio/radio.js +5 -8
  74. package/lib/es/components/radio/radio.js.map +1 -1
  75. package/lib/es/components/select/select.js +19 -24
  76. package/lib/es/components/select/select.js.map +1 -1
  77. package/lib/es/components/tabs/tabs.js +82 -81
  78. package/lib/es/components/tabs/tabs.js.map +1 -1
  79. package/lib/es/components/tree/tree.js +25 -27
  80. package/lib/es/components/tree/tree.js.map +1 -1
  81. package/lib/es/components/upload/upload.js +27 -34
  82. package/lib/es/components/upload/upload.js.map +1 -1
  83. package/lib/index.js +426 -393
  84. package/package.json +1 -1
@@ -1,22 +1,19 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import classNames from 'classnames';
3
- import { useMemo, useEffect } from 'react';
4
- import { useReactive } from '../../js/hooks.js';
3
+ import { useState, useMemo, useEffect } from 'react';
5
4
  import { formatOption } from '../../js/utils.js';
6
5
  import RadioItem from './item.js';
7
6
 
8
7
  function Radio(props) {
9
8
  const { label, name, options, value, type = "default", status = "normal", message, optionInline = true, labelInline, disabled, required, className, renderItem, onChange, } = props;
10
- const state = useReactive({
11
- value,
12
- });
9
+ const [selectedValue, setSelectedValue] = useState(value);
13
10
  const formattedOptions = useMemo(() => formatOption(options), [options]);
14
11
  const handleChange = (value, e) => {
15
- state.value = value;
12
+ setSelectedValue(value);
16
13
  onChange?.(value, e);
17
14
  };
18
15
  useEffect(() => {
19
- state.value = value;
16
+ setSelectedValue(value);
20
17
  }, [value]);
21
18
  return (jsxs("div", { className: classNames("i-radio i-input-label", {
22
19
  [`i-radio-${status}`]: status !== "normal",
@@ -25,7 +22,7 @@ function Radio(props) {
25
22
  "i-options-block": !optionInline,
26
23
  "i-radio-options-button": type === "button",
27
24
  }), children: formattedOptions.map((option) => {
28
- const checked = state.value === option.value;
25
+ const checked = selectedValue === option.value;
29
26
  return (jsx(RadioItem, { name: name, value: option.value, checked: checked, type: type, disabled: disabled || option.disabled, onChange: handleChange, children: renderItem ?? option.label }, option.value));
30
27
  }) })] }));
31
28
  }
@@ -1 +1 @@
1
- {"version":3,"file":"radio.js","sources":["../../../../packages/components/radio/radio.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useEffect, useMemo } from \"react\";\nimport { useReactive } from \"../../js/hooks\";\nimport \"../../css/input.css\";\nimport { formatOption } from \"../../js/utils\";\nimport \"./index.css\";\nimport RadioItem from \"./item\";\nimport { IRadio } from \"./type\";\n\nfunction Radio(props: IRadio) {\n\tconst {\n\t\tlabel,\n\t\tname,\n\t\toptions,\n\t\tvalue,\n\t\ttype = \"default\",\n\t\tstatus = \"normal\",\n\t\tmessage,\n\t\toptionInline = true,\n\t\tlabelInline,\n\t\tdisabled,\n\t\trequired,\n\t\tclassName,\n\t\trenderItem,\n\t\tonChange,\n\t} = props;\n\n\tconst state = useReactive({\n\t\tvalue,\n\t});\n\n\tconst formattedOptions = useMemo(() => formatOption(options), [options]);\n\n\tconst handleChange = (value, e) => {\n\t\tstate.value = value;\n\t\tonChange?.(value, e);\n\t};\n\n\tuseEffect(() => {\n\t\tstate.value = value;\n\t}, [value]);\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-radio i-input-label\",\n\t\t\t\t{\n\t\t\t\t\t[`i-radio-${status}`]: status !== \"normal\",\n\t\t\t\t\t\"i-input-inline\": labelInline,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t>\n\t\t\t{label && (\n\t\t\t\t<span className='i-input-label-text'>\n\t\t\t\t\t{required && <span className='error'>*</span>}\n\t\t\t\t\t{label}\n\n\t\t\t\t\t{message && <p className='i-radio-message'>{message}</p>}\n\t\t\t\t</span>\n\t\t\t)}\n\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-radio-options\", {\n\t\t\t\t\t\"i-options-block\": !optionInline,\n\t\t\t\t\t\"i-radio-options-button\": type === \"button\",\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{formattedOptions.map((option) => {\n\t\t\t\t\tconst checked = state.value === option.value;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<RadioItem\n\t\t\t\t\t\t\tkey={option.value as string}\n\t\t\t\t\t\t\tname={name}\n\t\t\t\t\t\t\tvalue={option.value}\n\t\t\t\t\t\t\tchecked={checked}\n\t\t\t\t\t\t\ttype={type}\n\t\t\t\t\t\t\tdisabled={disabled || option.disabled}\n\t\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{renderItem ?? option.label}\n\t\t\t\t\t\t</RadioItem>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nRadio.Item = RadioItem;\n\nexport default Radio;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;AASA,SAAS,KAAK,CAAC,KAAa,EAAA;AAC3B,IAAA,MAAM,EACL,KAAK,EACL,IAAI,EACJ,OAAO,EACP,KAAK,EACL,IAAI,GAAG,SAAS,EAChB,MAAM,GAAG,QAAQ,EACjB,OAAO,EACP,YAAY,GAAG,IAAI,EACnB,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,UAAU,EACV,QAAQ,GACR,GAAG,KAAK;IAET,MAAM,KAAK,GAAG,WAAW,CAAC;QACzB,KAAK;AACL,KAAA,CAAC;AAEF,IAAA,MAAM,gBAAgB,GAAG,OAAO,CAAC,MAAM,YAAY,CAAC,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;AAExE,IAAA,MAAM,YAAY,GAAG,CAAC,KAAK,EAAE,CAAC,KAAI;AACjC,QAAA,KAAK,CAAC,KAAK,GAAG,KAAK;AACnB,QAAA,QAAQ,GAAG,KAAK,EAAE,CAAC,CAAC;AACrB,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;AACd,QAAA,KAAK,CAAC,KAAK,GAAG,KAAK;AACpB,IAAA,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;AAEX,IAAA,QACCA,IAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CACpB,uBAAuB,EACvB;AACC,YAAA,CAAC,WAAW,MAAM,CAAA,CAAE,GAAG,MAAM,KAAK,QAAQ;AAC1C,YAAA,gBAAgB,EAAE,WAAW;AAC7B,SAAA,EACD,SAAS,CACT,EAAA,QAAA,EAAA,CAEA,KAAK,KACLA,IAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,oBAAoB,aAClC,QAAQ,IAAIC,cAAM,SAAS,EAAC,OAAO,EAAA,QAAA,EAAA,GAAA,EAAA,CAAS,EAC5C,KAAK,EAEL,OAAO,IAAIA,GAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAC,iBAAiB,YAAE,OAAO,EAAA,CAAK,CAAA,EAAA,CAClD,CACP,EAEDA,GAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CAAC,iBAAiB,EAAE;oBACxC,iBAAiB,EAAE,CAAC,YAAY;oBAChC,wBAAwB,EAAE,IAAI,KAAK,QAAQ;iBAC3C,CAAC,EAAA,QAAA,EAED,gBAAgB,CAAC,GAAG,CAAC,CAAC,MAAM,KAAI;oBAChC,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,KAAK,MAAM,CAAC,KAAK;oBAE5C,QACCA,IAAC,SAAS,EAAA,EAET,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,IAAI,MAAM,CAAC,QAAQ,EACrC,QAAQ,EAAE,YAAY,EAAA,QAAA,EAErB,UAAU,IAAI,MAAM,CAAC,KAAK,EAAA,EARtB,MAAM,CAAC,KAAe,CAShB;AAEd,gBAAA,CAAC,CAAC,EAAA,CACG,CAAA,EAAA,CACD;AAER;AAEA,KAAK,CAAC,IAAI,GAAG,SAAS;;;;"}
1
+ {"version":3,"file":"radio.js","sources":["../../../../packages/components/radio/radio.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport \"../../css/input.css\";\nimport { formatOption } from \"../../js/utils\";\nimport \"./index.css\";\nimport RadioItem from \"./item\";\nimport { IRadio } from \"./type\";\n\nfunction Radio(props: IRadio) {\n\tconst {\n\t\tlabel,\n\t\tname,\n\t\toptions,\n\t\tvalue,\n\t\ttype = \"default\",\n\t\tstatus = \"normal\",\n\t\tmessage,\n\t\toptionInline = true,\n\t\tlabelInline,\n\t\tdisabled,\n\t\trequired,\n\t\tclassName,\n\t\trenderItem,\n\t\tonChange,\n\t} = props;\n\n\tconst [selectedValue, setSelectedValue] = useState(value);\n\n\tconst formattedOptions = useMemo(() => formatOption(options), [options]);\n\n\tconst handleChange = (value, e) => {\n\t\tsetSelectedValue(value);\n\t\tonChange?.(value, e);\n\t};\n\n\tuseEffect(() => {\n\t\tsetSelectedValue(value);\n\t}, [value]);\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-radio i-input-label\",\n\t\t\t\t{\n\t\t\t\t\t[`i-radio-${status}`]: status !== \"normal\",\n\t\t\t\t\t\"i-input-inline\": labelInline,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t>\n\t\t\t{label && (\n\t\t\t\t<span className='i-input-label-text'>\n\t\t\t\t\t{required && <span className='error'>*</span>}\n\t\t\t\t\t{label}\n\n\t\t\t\t\t{message && <p className='i-radio-message'>{message}</p>}\n\t\t\t\t</span>\n\t\t\t)}\n\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-radio-options\", {\n\t\t\t\t\t\"i-options-block\": !optionInline,\n\t\t\t\t\t\"i-radio-options-button\": type === \"button\",\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{formattedOptions.map((option) => {\n\t\t\t\t\tconst checked = selectedValue === option.value;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<RadioItem\n\t\t\t\t\t\t\tkey={option.value as string}\n\t\t\t\t\t\t\tname={name}\n\t\t\t\t\t\t\tvalue={option.value}\n\t\t\t\t\t\t\tchecked={checked}\n\t\t\t\t\t\t\ttype={type}\n\t\t\t\t\t\t\tdisabled={disabled || option.disabled}\n\t\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{renderItem ?? option.label}\n\t\t\t\t\t\t</RadioItem>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nRadio.Item = RadioItem;\n\nexport default Radio;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;AAQA,SAAS,KAAK,CAAC,KAAa,EAAA;AAC3B,IAAA,MAAM,EACL,KAAK,EACL,IAAI,EACJ,OAAO,EACP,KAAK,EACL,IAAI,GAAG,SAAS,EAChB,MAAM,GAAG,QAAQ,EACjB,OAAO,EACP,YAAY,GAAG,IAAI,EACnB,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,UAAU,EACV,QAAQ,GACR,GAAG,KAAK;IAET,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;AAEzD,IAAA,MAAM,gBAAgB,GAAG,OAAO,CAAC,MAAM,YAAY,CAAC,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;AAExE,IAAA,MAAM,YAAY,GAAG,CAAC,KAAK,EAAE,CAAC,KAAI;QACjC,gBAAgB,CAAC,KAAK,CAAC;AACvB,QAAA,QAAQ,GAAG,KAAK,EAAE,CAAC,CAAC;AACrB,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;QACd,gBAAgB,CAAC,KAAK,CAAC;AACxB,IAAA,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;AAEX,IAAA,QACCA,IAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CACpB,uBAAuB,EACvB;AACC,YAAA,CAAC,WAAW,MAAM,CAAA,CAAE,GAAG,MAAM,KAAK,QAAQ;AAC1C,YAAA,gBAAgB,EAAE,WAAW;AAC7B,SAAA,EACD,SAAS,CACT,EAAA,QAAA,EAAA,CAEA,KAAK,KACLA,IAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,oBAAoB,aAClC,QAAQ,IAAIC,cAAM,SAAS,EAAC,OAAO,EAAA,QAAA,EAAA,GAAA,EAAA,CAAS,EAC5C,KAAK,EAEL,OAAO,IAAIA,GAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAC,iBAAiB,YAAE,OAAO,EAAA,CAAK,CAAA,EAAA,CAClD,CACP,EAEDA,GAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CAAC,iBAAiB,EAAE;oBACxC,iBAAiB,EAAE,CAAC,YAAY;oBAChC,wBAAwB,EAAE,IAAI,KAAK,QAAQ;iBAC3C,CAAC,EAAA,QAAA,EAED,gBAAgB,CAAC,GAAG,CAAC,CAAC,MAAM,KAAI;AAChC,oBAAA,MAAM,OAAO,GAAG,aAAa,KAAK,MAAM,CAAC,KAAK;oBAE9C,QACCA,IAAC,SAAS,EAAA,EAET,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,IAAI,MAAM,CAAC,QAAQ,EACrC,QAAQ,EAAE,YAAY,EAAA,QAAA,EAErB,UAAU,IAAI,MAAM,CAAC,KAAK,EAAA,EARtB,MAAM,CAAC,KAAe,CAShB;AAEd,gBAAA,CAAC,CAAC,EAAA,CACG,CAAA,EAAA,CACD;AAER;AAEA,KAAK,CAAC,IAAI,GAAG,SAAS;;;;"}
@@ -3,7 +3,6 @@ import { UnfoldMoreRound } from '@ricons/material';
3
3
  import classNames from 'classnames';
4
4
  import { debounce } from 'radash';
5
5
  import { useState, useMemo, useEffect } from 'react';
6
- import { useReactive } from '../../js/hooks.js';
7
6
  import { formatOption } from '../../js/utils.js';
8
7
  import Popup from '../popup/popup.js';
9
8
  import Helpericon from '../utils/helpericon/helpericon.js';
@@ -11,38 +10,34 @@ import { displayValue, Options } from './options.js';
11
10
 
12
11
  const Select = (props) => {
13
12
  const { ref, type = "text", name, label, value = "", placeholder, options = [], multiple, prepend, append, labelInline, style, className, message, status = "normal", hideClear, hideArrow, maxDisplay, border, filter, tip, filterPlaceholder = "...", popupProps, onSelect, onChange, ...restProps } = props;
14
- const state = useReactive({
15
- inputValue: "",
16
- filterValue: "",
17
- value,
18
- loading: false,
19
- });
13
+ const [filterValue, setFilterValue] = useState("");
14
+ const [selectedValue, setSelectedValue] = useState(value);
20
15
  const [active, setActive] = useState(false);
21
16
  const formattedOptions = useMemo(() => formatOption(options), [options]);
22
17
  const filterOptions = useMemo(() => {
23
- const { filterValue: fv } = state;
18
+ const fv = filterValue;
24
19
  if (!fv || !filter)
25
20
  return formattedOptions;
26
21
  const filterFn = typeof filter === "function"
27
22
  ? filter
28
23
  : (opt) => opt.value.includes(fv) || opt.label.includes(fv);
29
24
  return formattedOptions.filter(filterFn);
30
- }, [formattedOptions, filter, state.filterValue]);
25
+ }, [formattedOptions, filter, filterValue]);
31
26
  const changeValue = (v) => {
32
- state.value = v;
27
+ setSelectedValue(v);
33
28
  onChange?.(v);
34
29
  };
35
30
  const displayLabel = useMemo(() => {
36
31
  if (multiple) {
37
32
  return "";
38
33
  }
39
- const option = formattedOptions.find((opt) => opt.value === state.value);
40
- return option ? option.label : state.value;
41
- }, [state.value, formattedOptions]);
34
+ const option = formattedOptions.find((opt) => opt.value === selectedValue);
35
+ return option ? option.label : selectedValue;
36
+ }, [selectedValue, formattedOptions]);
42
37
  const handleSelect = (value, option) => {
43
38
  onSelect?.(value, option);
44
39
  if (multiple) {
45
- const values = [...state.value];
40
+ const values = [...selectedValue];
46
41
  const i = values.findIndex((v) => v === value);
47
42
  i > -1 ? values.splice(i, 1) : values.push(value);
48
43
  changeValue(values);
@@ -55,7 +50,7 @@ const Select = (props) => {
55
50
  setActive(visible);
56
51
  if (!filter)
57
52
  return;
58
- state.filterValue = "";
53
+ setFilterValue("");
59
54
  };
60
55
  const handleHelperClick = (e) => {
61
56
  e.stopPropagation();
@@ -66,34 +61,34 @@ const Select = (props) => {
66
61
  };
67
62
  const handleFilterChange = debounce({ delay: 400 }, (e) => {
68
63
  const v = e.target.value;
69
- state.filterValue = v;
64
+ setFilterValue(v);
70
65
  });
71
66
  const handleInputChange = (e) => {
72
- state.filterValue = e.target.value;
67
+ setFilterValue(e.target.value);
73
68
  };
74
69
  useEffect(() => {
75
- state.value = value;
70
+ setSelectedValue(value);
76
71
  }, [value]);
77
72
  const hasValue = multiple
78
- ? state.value.length > 0
79
- : !!state.value;
73
+ ? selectedValue.length > 0
74
+ : !!selectedValue;
80
75
  const clearable = !hideClear && active && hasValue;
81
76
  const text = message ?? tip;
82
77
  return (jsxs("label", { className: classNames("i-input-label", className, {
83
78
  "i-input-inline": labelInline,
84
- }), style: style, children: [label && jsx("span", { className: 'i-input-label-text', children: label }), jsx(Popup, { position: 'bottom', arrow: false, fitSize: true, offset: 0, ...popupProps, visible: active, trigger: 'none', onVisibleChange: handleVisibleChange, content: jsx(Options, { options: filterOptions, value: state.value, multiple: multiple, filter: !!filter, filterPlaceholder: filterPlaceholder, onSelect: handleSelect, onFilter: handleFilterChange }), children: jsxs("div", { className: classNames("i-input-item", {
79
+ }), style: style, children: [label && jsx("span", { className: 'i-input-label-text', children: label }), jsx(Popup, { position: 'bottom', arrow: false, fitSize: true, offset: 0, ...popupProps, visible: active, trigger: 'none', onVisibleChange: handleVisibleChange, content: jsx(Options, { options: filterOptions, value: selectedValue, multiple: multiple, filter: !!filter, filterPlaceholder: filterPlaceholder, onSelect: handleSelect, onFilter: handleFilterChange }), children: jsxs("div", { className: classNames("i-input-item", {
85
80
  [`i-input-${status}`]: status !== "normal",
86
81
  "i-input-borderless": !border,
87
82
  "i-input-focus": active,
88
- }), onClick: () => setActive(true), children: [prepend, jsx("input", { ref: ref, type: 'hidden', value: state.value, ...restProps }), multiple ? (hasValue ? (jsx("div", { className: classNames("i-input i-select", {
83
+ }), onClick: () => setActive(true), children: [prepend, jsx("input", { ref: ref, type: 'hidden', value: selectedValue, ...restProps }), multiple ? (hasValue ? (jsx("div", { className: classNames("i-input i-select", {
89
84
  "i-select-multiple": multiple,
90
85
  }), children: displayValue({
91
86
  options: formattedOptions,
92
- value: state.value,
87
+ value: selectedValue,
93
88
  multiple,
94
89
  maxDisplay,
95
90
  onSelect: handleSelect,
96
- }) })) : (jsx("input", { className: 'i-input i-select', placeholder: placeholder, readOnly: true }))) : null, !multiple && (jsx("input", { value: active ? state.filterValue : displayLabel, className: 'i-input i-select', placeholder: displayLabel || placeholder, onChange: handleInputChange, readOnly: !filter })), jsx(Helpericon, { active: !hideArrow, icon: clearable ? undefined : jsx(UnfoldMoreRound, {}), onClick: handleHelperClick }), append] }) }), text && jsx("span", { className: 'i-input-message', children: text })] }));
91
+ }) })) : (jsx("input", { className: 'i-input i-select', placeholder: placeholder, readOnly: true }))) : null, !multiple && (jsx("input", { value: active ? filterValue : displayLabel, className: 'i-input i-select', placeholder: displayLabel || placeholder, onChange: handleInputChange, readOnly: !filter })), jsx(Helpericon, { active: !hideArrow, icon: clearable ? undefined : jsx(UnfoldMoreRound, {}), onClick: handleHelperClick }), append] }) }), text && jsx("span", { className: 'i-input-message', children: text })] }));
97
92
  };
98
93
 
99
94
  export { Select as default };
@@ -1 +1 @@
1
- {"version":3,"file":"select.js","sources":["../../../../packages/components/select/select.tsx"],"sourcesContent":["import { UnfoldMoreRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { debounce } from \"radash\";\nimport { ChangeEvent, useEffect, useMemo, useState } from \"react\";\nimport { useReactive } from \"../../js/hooks\";\nimport \"../../css/input.css\";\nimport { formatOption } from \"../../js/utils\";\nimport { TOption } from \"../../type\";\nimport Popup from \"../popup\";\nimport Helpericon from \"../utils/helpericon\";\nimport \"./index.css\";\nimport { Options, displayValue } from \"./options\";\nimport { ISelect } from \"./type\";\n\nconst Select = (props: ISelect) => {\n\tconst {\n\t\tref,\n\t\ttype = \"text\",\n\t\tname,\n\t\tlabel,\n\t\tvalue = \"\",\n\t\tplaceholder,\n\t\toptions = [],\n\t\tmultiple,\n\t\tprepend,\n\t\tappend,\n\t\tlabelInline,\n\t\tstyle,\n\t\tclassName,\n\t\tmessage,\n\t\tstatus = \"normal\",\n\t\thideClear,\n\t\thideArrow,\n\t\tmaxDisplay,\n\t\tborder,\n\t\tfilter,\n\t\ttip,\n\t\tfilterPlaceholder = \"...\",\n\t\tpopupProps,\n\t\tonSelect,\n\t\tonChange,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive({\n\t\tinputValue: \"\",\n\t\tfilterValue: \"\",\n\t\tvalue,\n\t\tloading: false,\n\t});\n\n\tconst [active, setActive] = useState<boolean>(false);\n\n\tconst formattedOptions = useMemo(() => formatOption(options), [options]);\n\n\tconst filterOptions = useMemo(() => {\n\t\tconst { filterValue: fv } = state;\n\t\tif (!fv || !filter) return formattedOptions;\n\n\t\tconst filterFn =\n\t\t\ttypeof filter === \"function\"\n\t\t\t\t? filter\n\t\t\t\t: (opt) => opt.value.includes(fv) || opt.label.includes(fv);\n\n\t\treturn formattedOptions.filter(filterFn);\n\t}, [formattedOptions, filter, state.filterValue]);\n\n\tconst changeValue = (v: any) => {\n\t\tstate.value = v;\n\t\tonChange?.(v);\n\t};\n\n\tconst displayLabel = useMemo(() => {\n\t\tif (multiple) {\n\t\t\treturn \"\";\n\t\t}\n\n\t\tconst option = formattedOptions.find(\n\t\t\t(opt) => opt.value === state.value\n\t\t);\n\t\treturn option ? option.label : state.value;\n\t}, [state.value, formattedOptions]);\n\n\tconst handleSelect = (value: any, option?: TOption) => {\n\t\tonSelect?.(value, option);\n\n\t\tif (multiple) {\n\t\t\tconst values = [...(state.value as any[])];\n\t\t\tconst i = values.findIndex((v) => v === value);\n\n\t\t\ti > -1 ? values.splice(i, 1) : values.push(value);\n\t\t\tchangeValue(values as any);\n\n\t\t\treturn;\n\t\t}\n\n\t\tsetActive(false);\n\t\tchangeValue(value);\n\t};\n\n\tconst handleVisibleChange = (visible: boolean) => {\n\t\tsetActive(visible);\n\n\t\tif (!filter) return;\n\n\t\tstate.filterValue = \"\";\n\t};\n\n\tconst handleHelperClick = (e) => {\n\t\te.stopPropagation();\n\t\tsetActive(true);\n\t\tif (!active) return;\n\n\t\tchangeValue(multiple ? [] : \"\");\n\t};\n\n\tconst handleFilterChange = debounce(\n\t\t{ delay: 400 },\n\t\t(e: ChangeEvent<HTMLInputElement>) => {\n\t\t\tconst v = e.target.value;\n\t\t\tstate.filterValue = v;\n\t\t}\n\t);\n\n\tconst handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tstate.filterValue = e.target.value;\n\t};\n\n\tuseEffect(() => {\n\t\tstate.value = value;\n\t}, [value]);\n\n\tconst hasValue = multiple\n\t\t? (state.value as any[]).length > 0\n\t\t: !!state.value;\n\tconst clearable = !hideClear && active && hasValue;\n\tconst text = message ?? tip;\n\n\treturn (\n\t\t<label\n\t\t\tclassName={classNames(\"i-input-label\", className, {\n\t\t\t\t\"i-input-inline\": labelInline,\n\t\t\t})}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t{label && <span className='i-input-label-text'>{label}</span>}\n\n\t\t\t<Popup\n\t\t\t\tposition='bottom'\n\t\t\t\tarrow={false}\n\t\t\t\tfitSize\n\t\t\t\toffset={0}\n\t\t\t\t{...popupProps}\n\t\t\t\tvisible={active}\n\t\t\t\ttrigger='none'\n\t\t\t\tonVisibleChange={handleVisibleChange}\n\t\t\t\tcontent={\n\t\t\t\t\t<Options\n\t\t\t\t\t\toptions={filterOptions}\n\t\t\t\t\t\tvalue={state.value}\n\t\t\t\t\t\tmultiple={multiple}\n\t\t\t\t\t\tfilter={!!filter}\n\t\t\t\t\t\tfilterPlaceholder={filterPlaceholder}\n\t\t\t\t\t\tonSelect={handleSelect}\n\t\t\t\t\t\tonFilter={handleFilterChange}\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName={classNames(\"i-input-item\", {\n\t\t\t\t\t\t[`i-input-${status}`]: status !== \"normal\",\n\t\t\t\t\t\t\"i-input-borderless\": !border,\n\t\t\t\t\t\t\"i-input-focus\": active,\n\t\t\t\t\t})}\n\t\t\t\t\tonClick={() => setActive(true)}\n\t\t\t\t>\n\t\t\t\t\t{prepend}\n\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\ttype='hidden'\n\t\t\t\t\t\tvalue={state.value}\n\t\t\t\t\t\t{...restProps}\n\t\t\t\t\t/>\n\n\t\t\t\t\t{multiple ? (\n\t\t\t\t\t\thasValue ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName={classNames(\"i-input i-select\", {\n\t\t\t\t\t\t\t\t\t\"i-select-multiple\": multiple,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{displayValue({\n\t\t\t\t\t\t\t\t\toptions: formattedOptions,\n\t\t\t\t\t\t\t\t\tvalue: state.value,\n\t\t\t\t\t\t\t\t\tmultiple,\n\t\t\t\t\t\t\t\t\tmaxDisplay,\n\t\t\t\t\t\t\t\t\tonSelect: handleSelect,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclassName='i-input i-select'\n\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\treadOnly\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)\n\t\t\t\t\t) : null}\n\n\t\t\t\t\t{!multiple && (\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tvalue={active ? state.filterValue : displayLabel}\n\t\t\t\t\t\t\tclassName='i-input i-select'\n\t\t\t\t\t\t\tplaceholder={displayLabel || placeholder}\n\t\t\t\t\t\t\tonChange={handleInputChange}\n\t\t\t\t\t\t\treadOnly={!filter}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive={!hideArrow}\n\t\t\t\t\t\ticon={clearable ? undefined : <UnfoldMoreRound />}\n\t\t\t\t\t\tonClick={handleHelperClick}\n\t\t\t\t\t/>\n\n\t\t\t\t\t{append}\n\t\t\t\t</div>\n\t\t\t</Popup>\n\n\t\t\t{text && <span className='i-input-message'>{text}</span>}\n\t\t</label>\n\t);\n};\n\nexport default Select;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
1
+ {"version":3,"file":"select.js","sources":["../../../../packages/components/select/select.tsx"],"sourcesContent":["import { UnfoldMoreRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { debounce } from \"radash\";\nimport { ChangeEvent, useEffect, useMemo, useState } from \"react\";\nimport \"../../css/input.css\";\nimport { formatOption } from \"../../js/utils\";\nimport { TOption } from \"../../type\";\nimport Popup from \"../popup\";\nimport Helpericon from \"../utils/helpericon\";\nimport \"./index.css\";\nimport { Options, displayValue } from \"./options\";\nimport { ISelect } from \"./type\";\n\nconst Select = (props: ISelect) => {\n\tconst {\n\t\tref,\n\t\ttype = \"text\",\n\t\tname,\n\t\tlabel,\n\t\tvalue = \"\",\n\t\tplaceholder,\n\t\toptions = [],\n\t\tmultiple,\n\t\tprepend,\n\t\tappend,\n\t\tlabelInline,\n\t\tstyle,\n\t\tclassName,\n\t\tmessage,\n\t\tstatus = \"normal\",\n\t\thideClear,\n\t\thideArrow,\n\t\tmaxDisplay,\n\t\tborder,\n\t\tfilter,\n\t\ttip,\n\t\tfilterPlaceholder = \"...\",\n\t\tpopupProps,\n\t\tonSelect,\n\t\tonChange,\n\t\t...restProps\n\t} = props;\n\n\tconst [filterValue, setFilterValue] = useState(\"\");\n\tconst [selectedValue, setSelectedValue] = useState(value);\n\n\tconst [active, setActive] = useState<boolean>(false);\n\n\tconst formattedOptions = useMemo(() => formatOption(options), [options]);\n\n\tconst filterOptions = useMemo(() => {\n\t\tconst fv = filterValue;\n\t\tif (!fv || !filter) return formattedOptions;\n\n\t\tconst filterFn =\n\t\t\ttypeof filter === \"function\"\n\t\t\t\t? filter\n\t\t\t\t: (opt) => opt.value.includes(fv) || opt.label.includes(fv);\n\n\t\treturn formattedOptions.filter(filterFn);\n\t}, [formattedOptions, filter, filterValue]);\n\n\tconst changeValue = (v: any) => {\n\t\tsetSelectedValue(v);\n\t\tonChange?.(v);\n\t};\n\n\tconst displayLabel = useMemo(() => {\n\t\tif (multiple) {\n\t\t\treturn \"\";\n\t\t}\n\n\t\tconst option = formattedOptions.find(\n\t\t\t(opt) => opt.value === selectedValue\n\t\t);\n\t\treturn option ? option.label : selectedValue;\n\t}, [selectedValue, formattedOptions]);\n\n\tconst handleSelect = (value: any, option?: TOption) => {\n\t\tonSelect?.(value, option);\n\n\t\tif (multiple) {\n\t\t\tconst values = [...(selectedValue as any[])];\n\t\t\tconst i = values.findIndex((v) => v === value);\n\n\t\t\ti > -1 ? values.splice(i, 1) : values.push(value);\n\t\t\tchangeValue(values as any);\n\n\t\t\treturn;\n\t\t}\n\n\t\tsetActive(false);\n\t\tchangeValue(value);\n\t};\n\n\tconst handleVisibleChange = (visible: boolean) => {\n\t\tsetActive(visible);\n\n\t\tif (!filter) return;\n\n\t\tsetFilterValue(\"\");\n\t};\n\n\tconst handleHelperClick = (e) => {\n\t\te.stopPropagation();\n\t\tsetActive(true);\n\t\tif (!active) return;\n\n\t\tchangeValue(multiple ? [] : \"\");\n\t};\n\n\tconst handleFilterChange = debounce(\n\t\t{ delay: 400 },\n\t\t(e: ChangeEvent<HTMLInputElement>) => {\n\t\t\tconst v = e.target.value;\n\t\t\tsetFilterValue(v);\n\t\t}\n\t);\n\n\tconst handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tsetFilterValue(e.target.value);\n\t};\n\n\tuseEffect(() => {\n\t\tsetSelectedValue(value);\n\t}, [value]);\n\n\tconst hasValue = multiple\n\t\t? (selectedValue as any[]).length > 0\n\t\t: !!selectedValue;\n\tconst clearable = !hideClear && active && hasValue;\n\tconst text = message ?? tip;\n\n\treturn (\n\t\t<label\n\t\t\tclassName={classNames(\"i-input-label\", className, {\n\t\t\t\t\"i-input-inline\": labelInline,\n\t\t\t})}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t{label && <span className='i-input-label-text'>{label}</span>}\n\n\t\t\t<Popup\n\t\t\t\tposition='bottom'\n\t\t\t\tarrow={false}\n\t\t\t\tfitSize\n\t\t\t\toffset={0}\n\t\t\t\t{...popupProps}\n\t\t\t\tvisible={active}\n\t\t\t\ttrigger='none'\n\t\t\t\tonVisibleChange={handleVisibleChange}\n\t\t\t\tcontent={\n\t\t\t\t\t<Options\n\t\t\t\t\t\toptions={filterOptions}\n\t\t\t\t\t\tvalue={selectedValue}\n\t\t\t\t\t\tmultiple={multiple}\n\t\t\t\t\t\tfilter={!!filter}\n\t\t\t\t\t\tfilterPlaceholder={filterPlaceholder}\n\t\t\t\t\t\tonSelect={handleSelect}\n\t\t\t\t\t\tonFilter={handleFilterChange}\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName={classNames(\"i-input-item\", {\n\t\t\t\t\t\t[`i-input-${status}`]: status !== \"normal\",\n\t\t\t\t\t\t\"i-input-borderless\": !border,\n\t\t\t\t\t\t\"i-input-focus\": active,\n\t\t\t\t\t})}\n\t\t\t\t\tonClick={() => setActive(true)}\n\t\t\t\t>\n\t\t\t\t\t{prepend}\n\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\ttype='hidden'\n\t\t\t\t\t\tvalue={selectedValue}\n\t\t\t\t\t\t{...restProps}\n\t\t\t\t\t/>\n\n\t\t\t\t\t{multiple ? (\n\t\t\t\t\t\thasValue ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName={classNames(\"i-input i-select\", {\n\t\t\t\t\t\t\t\t\t\"i-select-multiple\": multiple,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{displayValue({\n\t\t\t\t\t\t\t\t\toptions: formattedOptions,\n\t\t\t\t\t\t\t\t\tvalue: selectedValue,\n\t\t\t\t\t\t\t\t\tmultiple,\n\t\t\t\t\t\t\t\t\tmaxDisplay,\n\t\t\t\t\t\t\t\t\tonSelect: handleSelect,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclassName='i-input i-select'\n\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\treadOnly\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)\n\t\t\t\t\t) : null}\n\n\t\t\t\t\t{!multiple && (\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tvalue={active ? filterValue : displayLabel}\n\t\t\t\t\t\t\tclassName='i-input i-select'\n\t\t\t\t\t\t\tplaceholder={displayLabel || placeholder}\n\t\t\t\t\t\t\tonChange={handleInputChange}\n\t\t\t\t\t\t\treadOnly={!filter}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive={!hideArrow}\n\t\t\t\t\t\ticon={clearable ? undefined : <UnfoldMoreRound />}\n\t\t\t\t\t\tonClick={handleHelperClick}\n\t\t\t\t\t/>\n\n\t\t\t\t\t{append}\n\t\t\t\t</div>\n\t\t\t</Popup>\n\n\t\t\t{text && <span className='i-input-message'>{text}</span>}\n\t\t</label>\n\t);\n};\n\nexport default Select;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
@@ -1,9 +1,8 @@
1
1
  import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import { MoreHorizRound } from '@ricons/material';
3
3
  import classNames from 'classnames';
4
- import { pick } from 'radash';
5
- import { useRef, useEffect, Children, useImperativeHandle } from 'react';
6
- import { useReactive, useIntersectionObserver, useSize } from '../../js/hooks.js';
4
+ import { useRef, useState, useEffect, Children, useImperativeHandle } from 'react';
5
+ import { useIntersectionObserver, useSize } from '../../js/hooks.js';
7
6
  import Button from '../button/button.js';
8
7
  import Icon from '../icon/icon.js';
9
8
  import Popup from '../popup/popup.js';
@@ -15,141 +14,142 @@ const Tabs = ((props) => {
15
14
  const navRefs = useRef([]);
16
15
  const barRef = useRef(null);
17
16
  const navsRef = useRef(null);
18
- const state = useReactive({
19
- active,
20
- prevActive: undefined,
21
- barStyle: {},
22
- cachedTabs: [],
23
- overflow: false,
24
- more: [],
25
- tabs: [],
26
- });
17
+ const contentsRef = useRef(new Map());
18
+ const [activeKey, setActiveKey] = useState(active);
19
+ const [prevActiveKey, setPrevActiveKey] = useState(undefined);
20
+ const [barStyle, setBarStyle] = useState({});
21
+ const [cachedTabs, setCachedTabs] = useState([]);
22
+ const [overflow, setOverflow] = useState(false);
23
+ const [moreTabs, setMoreTabs] = useState([]);
24
+ const [tabs, setTabs] = useState([]);
27
25
  const { observe, unobserve } = useIntersectionObserver();
28
26
  const size = useSize(navsRef);
29
27
  useEffect(() => {
30
- const sanitizeContent = (node) => {
31
- if (!node || typeof node !== "object")
32
- return node;
33
- if (!("$$typeof" in node))
34
- return node;
35
- return pick(node, ["props", "type", "$$typeof", "ref"]);
36
- };
28
+ contentsRef.current.clear();
37
29
  if (!items) {
38
30
  if (!children) {
39
- state.tabs = [];
31
+ setTabs([]);
40
32
  return;
41
33
  }
42
- state.tabs = Children.map(children, (node, i) => {
34
+ setTabs(Children.map(children, (node, i) => {
43
35
  const { key, props: nodeProps } = node;
44
- const { title, children, content, keepDOM } = nodeProps;
45
- const cloned = children
46
- ? typeof children === "string"
47
- ? children
48
- : pick(children, ["props", "type", "$$typeof", "ref"])
49
- : content;
36
+ const { title, children: tabChildren, content, keepDOM, closable, } = nodeProps;
37
+ const tabKey = String(key ?? i);
38
+ contentsRef.current.set(tabKey, tabChildren ?? content);
50
39
  return {
51
- key: key || String(i),
40
+ key: tabKey,
52
41
  title,
53
- content: cloned,
54
42
  keepDOM,
43
+ closable,
55
44
  };
56
- });
45
+ }) ?? []);
57
46
  return;
58
47
  }
59
- state.tabs = items.map((item, i) => {
48
+ setTabs(items.map((item, i) => {
60
49
  if (["string", "number"].includes(typeof item)) {
61
- return { key: item, title: item };
62
- }
63
- if (item.key === undefined) {
64
- item.key = i;
50
+ const key = String(item);
51
+ return { key, title: item };
65
52
  }
53
+ const key = String(item.key ?? i);
54
+ contentsRef.current.set(key, item.content);
55
+ const { content, ...rest } = item;
66
56
  return {
67
- ...item,
68
- content: sanitizeContent(item.content),
57
+ ...rest,
58
+ key,
69
59
  };
70
- });
60
+ }));
71
61
  }, [children, items]);
72
62
  const add = (tab) => {
73
- const { key } = tab;
74
- const i = state.tabs.findIndex((t) => t.key === key);
63
+ const tkey = String(tab.key ?? tabs.length);
64
+ const i = tabs.findIndex((t) => t.key === tkey);
75
65
  if (i > -1) {
76
- open(state.tabs[i].key ?? `${i}`);
66
+ open(tabs[i].key ?? `${i}`);
77
67
  return;
78
68
  }
79
- const l = state.tabs.length;
80
- const tkey = tab.key ?? `${l}`;
81
- state.tabs.push({ ...tab, key: tkey });
69
+ contentsRef.current.set(tkey, tab.content);
70
+ const { content, ...rest } = tab;
71
+ setTabs((ts) => [...ts, { ...rest, key: tkey }]);
82
72
  open(tkey);
83
73
  };
84
74
  const close = (key) => {
85
- const i = state.tabs.findIndex((t) => t.key === key);
75
+ const i = tabs.findIndex((t) => t.key === key);
86
76
  if (i < 0)
87
77
  return;
88
- state.tabs.splice(i, 1);
89
- if (state.active !== key)
78
+ contentsRef.current.delete(key);
79
+ const nextTabs = [...tabs];
80
+ nextTabs.splice(i, 1);
81
+ setTabs(nextTabs);
82
+ if (activeKey !== key)
90
83
  return;
91
- const next = state.tabs[i] || state.tabs[i - 1];
92
- open(state.prevActive ?? next?.key ?? "");
84
+ const next = nextTabs[i] || nextTabs[i - 1];
85
+ open(prevActiveKey ?? next?.key ?? "");
93
86
  };
94
87
  const open = (key) => {
95
- if (key === state.active) {
88
+ if (key === activeKey) {
96
89
  if (!toggable)
97
90
  return;
98
91
  onTabChange?.(undefined, key);
99
- state.active = undefined;
100
- state.barStyle = {
92
+ setActiveKey(undefined);
93
+ setBarStyle({
101
94
  height: 0,
102
95
  width: 0,
103
- };
96
+ });
104
97
  return;
105
98
  }
106
- state.prevActive = state.active;
107
- onTabChange?.(key, state.active);
108
- state.active = key;
99
+ setPrevActiveKey(activeKey);
100
+ onTabChange?.(key, activeKey);
101
+ setActiveKey(key);
109
102
  };
110
103
  useEffect(() => {
111
104
  if (!size || hideMore || !observe)
112
105
  return;
113
106
  const { scrollHeight, scrollWidth } = navsRef.current;
114
107
  const { width, height } = size;
115
- state.overflow = scrollHeight > height || scrollWidth > width;
116
- if (!state.overflow)
108
+ const nextOverflow = scrollHeight > height || scrollWidth > width;
109
+ setOverflow(nextOverflow);
110
+ if (!nextOverflow)
117
111
  return;
118
112
  navRefs.current.map((nav, i) => {
119
113
  if (!nav)
120
114
  return;
121
115
  observe(nav, (tar, visible) => {
122
- if (!state.tabs[i])
123
- return;
124
- state.tabs[i].intersecting = visible;
125
- state.more = state.tabs.filter((tab) => !tab.intersecting);
116
+ setTabs((ts) => {
117
+ if (!ts[i])
118
+ return ts;
119
+ const nextTabs = ts.map((t, idx) => idx === i ? { ...t, intersecting: visible } : t);
120
+ setMoreTabs(nextTabs.filter((tab) => !tab.intersecting));
121
+ return nextTabs;
122
+ });
126
123
  });
127
124
  });
128
- }, [size, hideMore, state.tabs.length]);
125
+ }, [size, hideMore, tabs.length, observe]);
129
126
  useEffect(() => {
130
- if (!bar || type === "pane" || state.active === undefined) {
127
+ if (!bar || type === "pane" || activeKey === undefined) {
131
128
  return;
132
129
  }
133
- const index = state.tabs.findIndex((tab) => tab.key === state.active);
130
+ const index = tabs.findIndex((tab) => tab.key === activeKey);
134
131
  setTimeout(() => {
135
132
  const nav = navRefs.current[index];
136
133
  if (!nav)
137
134
  return;
138
- if (state.tabs[index].keepDOM && state.active) {
139
- const i = state.cachedTabs.findIndex((k) => k === state.active);
140
- i < 0 && state.cachedTabs.unshift(state.active);
135
+ if (tabs[index]?.keepDOM && activeKey) {
136
+ setCachedTabs((keys) => {
137
+ if (keys.includes(activeKey))
138
+ return keys;
139
+ return [activeKey, ...keys];
140
+ });
141
141
  }
142
142
  const { offsetHeight, offsetLeft, offsetTop, offsetWidth } = nav;
143
143
  const isLine = type === "line";
144
- state.barStyle = {
144
+ setBarStyle({
145
145
  height: !vertical && isLine ? ".25em" : offsetHeight,
146
146
  width: vertical && isLine ? ".25em" : offsetWidth,
147
147
  transform: `translate(${offsetLeft}px, ${offsetTop}px)`,
148
- };
148
+ });
149
149
  }, 16);
150
- }, [state.active, bar, size]);
150
+ }, [activeKey, bar, size, tabs, type, vertical]);
151
151
  useEffect(() => {
152
- if (active === undefined || state.active === active)
152
+ if (active === undefined || activeKey === active)
153
153
  return;
154
154
  open(active);
155
155
  }, [active]);
@@ -159,7 +159,7 @@ const Tabs = ((props) => {
159
159
  return () => {
160
160
  navRefs.current?.map(unobserve);
161
161
  };
162
- }, [state.tabs.length]);
162
+ }, [tabs.length, hideMore, unobserve]);
163
163
  useEffect(() => {
164
164
  if (!navsRef.current || vertical)
165
165
  return;
@@ -189,25 +189,26 @@ const Tabs = ((props) => {
189
189
  }));
190
190
  return (jsxs("div", { className: classNames("i-tabs", { flex: vertical, [`i-tabs-${type}`]: type !== "default" }, className), ...rest, children: [jsxs("div", { className: classNames("i-tab-navs-container", {
191
191
  "i-tab-navs-vertical": vertical,
192
- }), children: [prepend, jsxs("div", { ref: navsRef, className: classNames("i-tab-navs", `justify-${navsJustify}`), children: [state.tabs.map((tab, i) => {
192
+ }), children: [prepend, jsxs("div", { ref: navsRef, className: classNames("i-tab-navs", `justify-${navsJustify}`), children: [tabs.map((tab, i) => {
193
193
  const { title, key = `${i}`, closable } = tab;
194
194
  return (jsxs("a", { ref: (ref) => (navRefs.current[i] = ref), className: classNames("i-tab-nav", {
195
- "i-tab-active": state.active === key,
195
+ "i-tab-active": activeKey === key,
196
196
  }), onClick: () => open(key), children: [title, closable && (jsx(Helpericon, { as: 'i', active: true, className: 'i-tab-nav-close', onClick: (e) => {
197
197
  e.stopPropagation();
198
198
  close(key);
199
199
  } }))] }, key));
200
- }), bar && (jsx("span", { ref: barRef, className: classNames("i-tab-navs-bar", barClass), style: state.barStyle }))] }), !hideMore && state.overflow && state.more.length > 0 && (jsx(Popup, { arrow: false, position: vertical ? "right" : "bottom", align: 'end', touchable: true, hideDelay: 500, content: jsx("div", { className: 'i-tabs-morelist pd-4', children: state.more.map((tab, i) => {
200
+ }), bar && (jsx("span", { ref: barRef, className: classNames("i-tab-navs-bar", barClass), style: barStyle }))] }), !hideMore && overflow && moreTabs.length > 0 && (jsx(Popup, { arrow: false, position: vertical ? "right" : "bottom", align: 'end', touchable: true, hideDelay: 500, content: jsx("div", { className: 'i-tabs-morelist pd-4', children: moreTabs.map((tab, i) => {
201
201
  const { key = `${i}`, title } = tab;
202
- const isActive = state.active === key;
202
+ const isActive = activeKey === key;
203
203
  return (jsx("a", { className: classNames("i-tab-nav", {
204
204
  "i-tab-active": isActive,
205
205
  }), onClick: () => open(key), children: title }, key));
206
- }) }), children: renderMore(state.more) })), append] }), jsx("div", { className: 'i-tab-contents', children: state.tabs.map((tab, i) => {
207
- const { key = `${i}`, content } = tab;
208
- const isActive = state.active === key;
206
+ }) }), children: renderMore(moreTabs) })), append] }), jsx("div", { className: 'i-tab-contents', children: tabs.map((tab, i) => {
207
+ const key = tab.key ?? `${i}`;
208
+ const content = contentsRef.current.get(key);
209
+ const isActive = activeKey === key;
209
210
  const show = isActive ||
210
- (key !== undefined && state.cachedTabs.includes(key));
211
+ (key !== undefined && cachedTabs.includes(key));
211
212
  return (show && (jsx("div", { className: classNames("i-tab-content", {
212
213
  "i-tab-active": isActive,
213
214
  }), children: content }, key)));
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.js","sources":["../../../../packages/components/tabs/tabs.tsx"],"sourcesContent":["import { MoreHorizRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { pick } from \"radash\";\nimport {\n\tCSSProperties,\n\tChildren,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseRef,\n} from \"react\";\nimport { useIntersectionObserver, useReactive, useSize } from \"../../js/hooks\";\nimport Button from \"../button\";\nimport Icon from \"../icon\";\nimport Popup from \"../popup\";\nimport Helpericon from \"../utils/helpericon\";\nimport \"./index.css\";\nimport TabItem from \"./item\";\nimport { CompositionTabs, ITabItem, ITabs } from \"./type\";\n\ntype TState = {\n\tactive?: string;\n\tprevActive?: string;\n\tbarStyle: CSSProperties;\n\tcachedTabs: string[];\n\toverflow: boolean;\n\tmore: ITabItem[];\n\ttabs: ITabItem[];\n};\n\nconst Tabs = ((props: ITabs) => {\n\tconst {\n\t\tref,\n\t\tactive,\n\t\ttabs: items,\n\t\ttype = \"default\",\n\t\tprepend,\n\t\tappend,\n\t\tchildren,\n\t\tclassName,\n\t\tvertical,\n\t\ttoggable,\n\t\tnavsJustify = \"start\",\n\t\tbar = true,\n\t\thideMore,\n\t\tbarClass,\n\t\trenderMore = () => (\n\t\t\t<Button flat square size='small'>\n\t\t\t\t<Icon icon={<MoreHorizRound />} />\n\t\t\t</Button>\n\t\t),\n\t\tonTabChange,\n\t\t...rest\n\t} = props;\n\n\tconst navRefs = useRef<HTMLElement[]>([]);\n\tconst barRef = useRef<HTMLSpanElement>(null);\n\tconst navsRef = useRef<HTMLDivElement>(null);\n\tconst state = useReactive<TState>({\n\t\tactive,\n\t\tprevActive: undefined,\n\t\tbarStyle: {},\n\t\tcachedTabs: [],\n\t\toverflow: false,\n\t\tmore: [],\n\t\ttabs: [],\n\t});\n\tconst { observe, unobserve } = useIntersectionObserver();\n\tconst size = useSize(navsRef);\n\n\tuseEffect(() => {\n\t\tconst sanitizeContent = (node: unknown) => {\n\t\t\tif (!node || typeof node !== \"object\") return node;\n\t\t\tif (!(\"$$typeof\" in node)) return node;\n\t\t\treturn pick(node as any, [\"props\", \"type\", \"$$typeof\", \"ref\"]);\n\t\t};\n\n\t\tif (!items) {\n\t\t\tif (!children) {\n\t\t\t\tstate.tabs = [];\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tstate.tabs = Children.map(children, (node, i) => {\n\t\t\t\tconst { key, props: nodeProps } = node as {\n\t\t\t\t\tkey?: string;\n\t\t\t\t\tprops?: any;\n\t\t\t\t};\n\t\t\t\tconst { title, children, content, keepDOM } = nodeProps;\n\n\t\t\t\tconst cloned = children\n\t\t\t\t\t? typeof children === \"string\"\n\t\t\t\t\t\t? children\n\t\t\t\t\t\t: pick(children, [\"props\", \"type\", \"$$typeof\", \"ref\"])\n\t\t\t\t\t: content;\n\n\t\t\t\treturn {\n\t\t\t\t\tkey: key || String(i),\n\t\t\t\t\ttitle,\n\t\t\t\t\tcontent: cloned,\n\t\t\t\t\tkeepDOM,\n\t\t\t\t};\n\t\t\t}) as ITabItem[];\n\n\t\t\treturn;\n\t\t}\n\n\t\tstate.tabs = items.map((item, i) => {\n\t\t\tif ([\"string\", \"number\"].includes(typeof item)) {\n\t\t\t\treturn { key: item, title: item };\n\t\t\t}\n\t\t\tif (item.key === undefined) {\n\t\t\t\titem.key = i;\n\t\t\t}\n\t\t\treturn {\n\t\t\t\t...item,\n\t\t\t\tcontent: sanitizeContent(item.content),\n\t\t\t};\n\t\t});\n\t}, [children, items]);\n\n\tconst add = (tab: ITabItem) => {\n\t\tconst { key } = tab;\n\t\tconst i = state.tabs.findIndex((t) => t.key === key);\n\n\t\tif (i > -1) {\n\t\t\topen(state.tabs[i].key ?? `${i}`);\n\t\t\treturn;\n\t\t}\n\n\t\tconst l = state.tabs.length;\n\t\tconst tkey = tab.key ?? `${l}`;\n\t\tstate.tabs.push({ ...tab, key: tkey });\n\t\topen(tkey);\n\t};\n\n\tconst close = (key: string) => {\n\t\tconst i = state.tabs.findIndex((t) => t.key === key);\n\n\t\tif (i < 0) return;\n\n\t\tstate.tabs.splice(i, 1);\n\n\t\tif (state.active !== key) return;\n\n\t\tconst next = state.tabs[i] || state.tabs[i - 1];\n\t\topen(state.prevActive ?? next?.key ?? \"\");\n\t};\n\n\tconst open = (key: string) => {\n\t\tif (key === state.active) {\n\t\t\tif (!toggable) return;\n\n\t\t\tonTabChange?.(undefined, key);\n\t\t\tstate.active = undefined;\n\n\t\t\tstate.barStyle = {\n\t\t\t\theight: 0,\n\t\t\t\twidth: 0,\n\t\t\t};\n\t\t\treturn;\n\t\t}\n\n\t\tstate.prevActive = state.active;\n\t\tonTabChange?.(key, state.active);\n\t\tstate.active = key;\n\t};\n\n\tuseEffect(() => {\n\t\tif (!size || hideMore || !observe) return;\n\t\tconst { scrollHeight, scrollWidth } = navsRef.current as HTMLElement;\n\t\tconst { width, height } = size;\n\n\t\tstate.overflow = scrollHeight > height || scrollWidth > width;\n\n\t\tif (!state.overflow) return;\n\n\t\tnavRefs.current.map((nav, i) => {\n\t\t\tif (!nav) return;\n\t\t\tobserve(nav, (tar: HTMLElement, visible: boolean) => {\n\t\t\t\tif (!state.tabs[i]) return;\n\t\t\t\tstate.tabs[i].intersecting = visible;\n\t\t\t\tstate.more = state.tabs.filter((tab) => !tab.intersecting);\n\t\t\t});\n\t\t});\n\t}, [size, hideMore, state.tabs.length]);\n\n\tuseEffect(() => {\n\t\tif (!bar || type === \"pane\" || state.active === undefined) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst index = state.tabs.findIndex((tab) => tab.key === state.active);\n\n\t\tsetTimeout(() => {\n\t\t\tconst nav = navRefs.current[index];\n\n\t\t\tif (!nav) return;\n\n\t\t\tif (state.tabs[index].keepDOM && state.active) {\n\t\t\t\tconst i = state.cachedTabs.findIndex((k) => k === state.active);\n\t\t\t\ti < 0 && state.cachedTabs.unshift(state.active);\n\t\t\t}\n\n\t\t\tconst { offsetHeight, offsetLeft, offsetTop, offsetWidth } = nav;\n\t\t\tconst isLine = type === \"line\";\n\n\t\t\tstate.barStyle = {\n\t\t\t\theight: !vertical && isLine ? \".25em\" : offsetHeight,\n\t\t\t\twidth: vertical && isLine ? \".25em\" : offsetWidth,\n\t\t\t\ttransform: `translate(${offsetLeft}px, ${offsetTop}px)`,\n\t\t\t};\n\t\t}, 16);\n\t}, [state.active, bar, size]);\n\n\tuseEffect(() => {\n\t\tif (active === undefined || state.active === active) return;\n\n\t\topen(active);\n\t}, [active]);\n\n\tuseEffect(() => {\n\t\tif (hideMore || !unobserve) return;\n\n\t\treturn () => {\n\t\t\tnavRefs.current?.map(unobserve);\n\t\t};\n\t}, [state.tabs.length]);\n\n\tuseEffect(() => {\n\t\tif (!navsRef.current || vertical) return;\n\n\t\tconst handleMouseWheel = (e) => {\n\t\t\te.stopPropagation();\n\t\t\te.preventDefault();\n\n\t\t\tif (vertical) return;\n\n\t\t\tnavsRef.current?.scrollBy({\n\t\t\t\tleft: e.deltaY + e.deltaX,\n\t\t\t});\n\t\t};\n\n\t\tnavsRef.current.addEventListener(\"wheel\", handleMouseWheel, {\n\t\t\tpassive: false,\n\t\t});\n\n\t\treturn () => {\n\t\t\tif (!navsRef.current) return;\n\t\t\tnavsRef.current.removeEventListener(\"wheel\", handleMouseWheel);\n\t\t};\n\t}, [navsRef.current]);\n\n\tuseImperativeHandle(ref, () => ({\n\t\topen,\n\t\tclose,\n\t\tadd,\n\t\tnavs: navsRef,\n\t}));\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-tabs\",\n\t\t\t\t{ flex: vertical, [`i-tabs-${type}`]: type !== \"default\" },\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...rest}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-tab-navs-container\", {\n\t\t\t\t\t\"i-tab-navs-vertical\": vertical,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{prepend}\n\n\t\t\t\t<div\n\t\t\t\t\tref={navsRef}\n\t\t\t\t\tclassName={classNames(\n\t\t\t\t\t\t\"i-tab-navs\",\n\t\t\t\t\t\t`justify-${navsJustify}`,\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{state.tabs.map((tab, i) => {\n\t\t\t\t\t\tconst { title, key = `${i}`, closable } = tab;\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\tref={(ref) => (navRefs.current[i] = ref as any)}\n\t\t\t\t\t\t\t\tclassName={classNames(\"i-tab-nav\", {\n\t\t\t\t\t\t\t\t\t\"i-tab-active\": state.active === key,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\tonClick={() => open(key)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{title}\n\n\t\t\t\t\t\t\t\t{closable && (\n\t\t\t\t\t\t\t\t\t<Helpericon\n\t\t\t\t\t\t\t\t\t\tas='i'\n\t\t\t\t\t\t\t\t\t\tactive\n\t\t\t\t\t\t\t\t\t\tclassName='i-tab-nav-close'\n\t\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tclose(key);\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t);\n\t\t\t\t\t})}\n\n\t\t\t\t\t{bar && (\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tref={barRef}\n\t\t\t\t\t\t\tclassName={classNames(\"i-tab-navs-bar\", barClass)}\n\t\t\t\t\t\t\tstyle={state.barStyle}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t{!hideMore && state.overflow && state.more.length > 0 && (\n\t\t\t\t\t<Popup\n\t\t\t\t\t\tarrow={false}\n\t\t\t\t\t\tposition={vertical ? \"right\" : \"bottom\"}\n\t\t\t\t\t\talign='end'\n\t\t\t\t\t\ttouchable\n\t\t\t\t\t\thideDelay={500}\n\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t<div className='i-tabs-morelist pd-4'>\n\t\t\t\t\t\t\t\t{state.more.map((tab, i) => {\n\t\t\t\t\t\t\t\t\tconst { key = `${i}`, title } = tab;\n\t\t\t\t\t\t\t\t\tconst isActive = state.active === key;\n\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\t\t\t\tclassName={classNames(\"i-tab-nav\", {\n\t\t\t\t\t\t\t\t\t\t\t\t\"i-tab-active\": isActive,\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t\tonClick={() => open(key)}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{title}\n\t\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderMore(state.more)}\n\t\t\t\t\t</Popup>\n\t\t\t\t)}\n\n\t\t\t\t{append}\n\t\t\t</div>\n\n\t\t\t<div className='i-tab-contents'>\n\t\t\t\t{state.tabs.map((tab, i) => {\n\t\t\t\t\tconst { key = `${i}`, content } = tab;\n\t\t\t\t\tconst isActive = state.active === key;\n\t\t\t\t\tconst show =\n\t\t\t\t\t\tisActive ||\n\t\t\t\t\t\t(key !== undefined && state.cachedTabs.includes(key));\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\tshow && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\tclassName={classNames(\"i-tab-content\", {\n\t\t\t\t\t\t\t\t\t\"i-tab-active\": isActive,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{content}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n}) as CompositionTabs;\n\nTabs.Item = TabItem;\n\nexport default Tabs;\n"],"names":["_jsx","_jsxs","TabItem"],"mappings":";;;;;;;;;;;;AA6BA,MAAM,IAAI,IAAI,CAAC,KAAY,KAAI;AAC9B,IAAA,MAAM,EACL,GAAG,EACH,MAAM,EACN,IAAI,EAAE,KAAK,EACX,IAAI,GAAG,SAAS,EAChB,OAAO,EACP,MAAM,EACN,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,WAAW,GAAG,OAAO,EACrB,GAAG,GAAG,IAAI,EACV,QAAQ,EACR,QAAQ,EACR,UAAU,GAAG,OACZA,GAAA,CAAC,MAAM,EAAA,EAAC,IAAI,QAAC,MAAM,EAAA,IAAA,EAAC,IAAI,EAAC,OAAO,EAAA,QAAA,EAC/BA,GAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAEA,GAAA,CAAC,cAAc,EAAA,EAAA,CAAG,GAAI,EAAA,CAC1B,CACT,EACD,WAAW,EACX,GAAG,IAAI,EACP,GAAG,KAAK;AAET,IAAA,MAAM,OAAO,GAAG,MAAM,CAAgB,EAAE,CAAC;AACzC,IAAA,MAAM,MAAM,GAAG,MAAM,CAAkB,IAAI,CAAC;AAC5C,IAAA,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC;IAC5C,MAAM,KAAK,GAAG,WAAW,CAAS;QACjC,MAAM;AACN,QAAA,UAAU,EAAE,SAAS;AACrB,QAAA,QAAQ,EAAE,EAAE;AACZ,QAAA,UAAU,EAAE,EAAE;AACd,QAAA,QAAQ,EAAE,KAAK;AACf,QAAA,IAAI,EAAE,EAAE;AACR,QAAA,IAAI,EAAE,EAAE;AACR,KAAA,CAAC;IACF,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,uBAAuB,EAAE;AACxD,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC;IAE7B,SAAS,CAAC,MAAK;AACd,QAAA,MAAM,eAAe,GAAG,CAAC,IAAa,KAAI;AACzC,YAAA,IAAI,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ;AAAE,gBAAA,OAAO,IAAI;AAClD,YAAA,IAAI,EAAE,UAAU,IAAI,IAAI,CAAC;AAAE,gBAAA,OAAO,IAAI;AACtC,YAAA,OAAO,IAAI,CAAC,IAAW,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC;AAC/D,QAAA,CAAC;QAED,IAAI,CAAC,KAAK,EAAE;YACX,IAAI,CAAC,QAAQ,EAAE;AACd,gBAAA,KAAK,CAAC,IAAI,GAAG,EAAE;gBACf;YACD;AAEA,YAAA,KAAK,CAAC,IAAI,GAAG,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,KAAI;gBAC/C,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAGjC;gBACD,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,SAAS;gBAEvD,MAAM,MAAM,GAAG;AACd,sBAAE,OAAO,QAAQ,KAAK;AACrB,0BAAE;AACF,0BAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC;sBACpD,OAAO;gBAEV,OAAO;AACN,oBAAA,GAAG,EAAE,GAAG,IAAI,MAAM,CAAC,CAAC,CAAC;oBACrB,KAAK;AACL,oBAAA,OAAO,EAAE,MAAM;oBACf,OAAO;iBACP;AACF,YAAA,CAAC,CAAe;YAEhB;QACD;AAEA,QAAA,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAI;AAClC,YAAA,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,OAAO,IAAI,CAAC,EAAE;gBAC/C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE;YAClC;AACA,YAAA,IAAI,IAAI,CAAC,GAAG,KAAK,SAAS,EAAE;AAC3B,gBAAA,IAAI,CAAC,GAAG,GAAG,CAAC;YACb;YACA,OAAO;AACN,gBAAA,GAAG,IAAI;AACP,gBAAA,OAAO,EAAE,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC;aACtC;AACF,QAAA,CAAC,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;AAErB,IAAA,MAAM,GAAG,GAAG,CAAC,GAAa,KAAI;AAC7B,QAAA,MAAM,EAAE,GAAG,EAAE,GAAG,GAAG;AACnB,QAAA,MAAM,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC;AAEpD,QAAA,IAAI,CAAC,GAAG,EAAE,EAAE;AACX,YAAA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAA,EAAG,CAAC,CAAA,CAAE,CAAC;YACjC;QACD;AAEA,QAAA,MAAM,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,MAAM;QAC3B,MAAM,IAAI,GAAG,GAAG,CAAC,GAAG,IAAI,CAAA,EAAG,CAAC,CAAA,CAAE;AAC9B,QAAA,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC;QACtC,IAAI,CAAC,IAAI,CAAC;AACX,IAAA,CAAC;AAED,IAAA,MAAM,KAAK,GAAG,CAAC,GAAW,KAAI;AAC7B,QAAA,MAAM,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC;QAEpD,IAAI,CAAC,GAAG,CAAC;YAAE;QAEX,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC;AAEvB,QAAA,IAAI,KAAK,CAAC,MAAM,KAAK,GAAG;YAAE;AAE1B,QAAA,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;QAC/C,IAAI,CAAC,KAAK,CAAC,UAAU,IAAI,IAAI,EAAE,GAAG,IAAI,EAAE,CAAC;AAC1C,IAAA,CAAC;AAED,IAAA,MAAM,IAAI,GAAG,CAAC,GAAW,KAAI;AAC5B,QAAA,IAAI,GAAG,KAAK,KAAK,CAAC,MAAM,EAAE;AACzB,YAAA,IAAI,CAAC,QAAQ;gBAAE;AAEf,YAAA,WAAW,GAAG,SAAS,EAAE,GAAG,CAAC;AAC7B,YAAA,KAAK,CAAC,MAAM,GAAG,SAAS;YAExB,KAAK,CAAC,QAAQ,GAAG;AAChB,gBAAA,MAAM,EAAE,CAAC;AACT,gBAAA,KAAK,EAAE,CAAC;aACR;YACD;QACD;AAEA,QAAA,KAAK,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM;QAC/B,WAAW,GAAG,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC;AAChC,QAAA,KAAK,CAAC,MAAM,GAAG,GAAG;AACnB,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;AACd,QAAA,IAAI,CAAC,IAAI,IAAI,QAAQ,IAAI,CAAC,OAAO;YAAE;QACnC,MAAM,EAAE,YAAY,EAAE,WAAW,EAAE,GAAG,OAAO,CAAC,OAAsB;AACpE,QAAA,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI;QAE9B,KAAK,CAAC,QAAQ,GAAG,YAAY,GAAG,MAAM,IAAI,WAAW,GAAG,KAAK;QAE7D,IAAI,CAAC,KAAK,CAAC,QAAQ;YAAE;QAErB,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;AAC9B,YAAA,IAAI,CAAC,GAAG;gBAAE;YACV,OAAO,CAAC,GAAG,EAAE,CAAC,GAAgB,EAAE,OAAgB,KAAI;AACnD,gBAAA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;oBAAE;gBACpB,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,OAAO;AACpC,gBAAA,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,YAAY,CAAC;AAC3D,YAAA,CAAC,CAAC;AACH,QAAA,CAAC,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAEvC,SAAS,CAAC,MAAK;AACd,QAAA,IAAI,CAAC,GAAG,IAAI,IAAI,KAAK,MAAM,IAAI,KAAK,CAAC,MAAM,KAAK,SAAS,EAAE;YAC1D;QACD;QAEA,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,KAAK,CAAC,MAAM,CAAC;QAErE,UAAU,CAAC,MAAK;YACf,MAAM,GAAG,GAAG,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC;AAElC,YAAA,IAAI,CAAC,GAAG;gBAAE;AAEV,YAAA,IAAI,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,IAAI,KAAK,CAAC,MAAM,EAAE;AAC9C,gBAAA,MAAM,CAAC,GAAG,KAAK,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,KAAK,CAAC,MAAM,CAAC;AAC/D,gBAAA,CAAC,GAAG,CAAC,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC;YAChD;YAEA,MAAM,EAAE,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,GAAG;AAChE,YAAA,MAAM,MAAM,GAAG,IAAI,KAAK,MAAM;YAE9B,KAAK,CAAC,QAAQ,GAAG;AAChB,gBAAA,MAAM,EAAE,CAAC,QAAQ,IAAI,MAAM,GAAG,OAAO,GAAG,YAAY;gBACpD,KAAK,EAAE,QAAQ,IAAI,MAAM,GAAG,OAAO,GAAG,WAAW;AACjD,gBAAA,SAAS,EAAE,CAAA,UAAA,EAAa,UAAU,CAAA,IAAA,EAAO,SAAS,CAAA,GAAA,CAAK;aACvD;QACF,CAAC,EAAE,EAAE,CAAC;IACP,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;IAE7B,SAAS,CAAC,MAAK;QACd,IAAI,MAAM,KAAK,SAAS,IAAI,KAAK,CAAC,MAAM,KAAK,MAAM;YAAE;QAErD,IAAI,CAAC,MAAM,CAAC;AACb,IAAA,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;IAEZ,SAAS,CAAC,MAAK;QACd,IAAI,QAAQ,IAAI,CAAC,SAAS;YAAE;AAE5B,QAAA,OAAO,MAAK;AACX,YAAA,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,SAAS,CAAC;AAChC,QAAA,CAAC;IACF,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAEvB,SAAS,CAAC,MAAK;AACd,QAAA,IAAI,CAAC,OAAO,CAAC,OAAO,IAAI,QAAQ;YAAE;AAElC,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAC,KAAI;YAC9B,CAAC,CAAC,eAAe,EAAE;YACnB,CAAC,CAAC,cAAc,EAAE;AAElB,YAAA,IAAI,QAAQ;gBAAE;AAEd,YAAA,OAAO,CAAC,OAAO,EAAE,QAAQ,CAAC;AACzB,gBAAA,IAAI,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,MAAM;AACzB,aAAA,CAAC;AACH,QAAA,CAAC;QAED,OAAO,CAAC,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,gBAAgB,EAAE;AAC3D,YAAA,OAAO,EAAE,KAAK;AACd,SAAA,CAAC;AAEF,QAAA,OAAO,MAAK;YACX,IAAI,CAAC,OAAO,CAAC,OAAO;gBAAE;YACtB,OAAO,CAAC,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,gBAAgB,CAAC;AAC/D,QAAA,CAAC;AACF,IAAA,CAAC,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;AAErB,IAAA,mBAAmB,CAAC,GAAG,EAAE,OAAO;QAC/B,IAAI;QACJ,KAAK;QACL,GAAG;AACH,QAAA,IAAI,EAAE,OAAO;AACb,KAAA,CAAC,CAAC;AAEH,IAAA,QACCC,IAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CACpB,QAAQ,EACR,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,UAAU,IAAI,CAAA,CAAE,GAAG,IAAI,KAAK,SAAS,EAAE,EAC1D,SAAS,CACT,EAAA,GACG,IAAI,EAAA,QAAA,EAAA,CAERA,cACC,SAAS,EAAE,UAAU,CAAC,sBAAsB,EAAE;AAC7C,oBAAA,qBAAqB,EAAE,QAAQ;AAC/B,iBAAA,CAAC,EAAA,QAAA,EAAA,CAED,OAAO,EAERA,IAAA,CAAA,KAAA,EAAA,EACC,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,UAAU,CACpB,YAAY,EACZ,CAAA,QAAA,EAAW,WAAW,CAAA,CAAE,CACxB,EAAA,QAAA,EAAA,CAEA,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;AAC1B,gCAAA,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,CAAA,EAAG,CAAC,CAAA,CAAE,EAAE,QAAQ,EAAE,GAAG,GAAG;gCAE7C,QACCA,IAAA,CAAA,GAAA,EAAA,EAEC,GAAG,EAAE,CAAC,GAAG,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,GAAU,CAAC,EAC/C,SAAS,EAAE,UAAU,CAAC,WAAW,EAAE;AAClC,wCAAA,cAAc,EAAE,KAAK,CAAC,MAAM,KAAK,GAAG;AACpC,qCAAA,CAAC,EACF,OAAO,EAAE,MAAM,IAAI,CAAC,GAAG,CAAC,EAAA,QAAA,EAAA,CAEvB,KAAK,EAEL,QAAQ,KACRD,GAAA,CAAC,UAAU,EAAA,EACV,EAAE,EAAC,GAAG,EACN,MAAM,EAAA,IAAA,EACN,SAAS,EAAC,iBAAiB,EAC3B,OAAO,EAAE,CAAC,CAAC,KAAI;gDACd,CAAC,CAAC,eAAe,EAAE;gDACnB,KAAK,CAAC,GAAG,CAAC;AACX,4CAAA,CAAC,GACA,CACF,CAAA,EAAA,EAnBI,GAAG,CAoBL;AAEN,4BAAA,CAAC,CAAC,EAED,GAAG,KACHA,GAAA,CAAA,MAAA,EAAA,EACC,GAAG,EAAE,MAAM,EACX,SAAS,EAAE,UAAU,CAAC,gBAAgB,EAAE,QAAQ,CAAC,EACjD,KAAK,EAAE,KAAK,CAAC,QAAQ,GACpB,CACF,CAAA,EAAA,CACI,EAEL,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,KACpDA,GAAA,CAAC,KAAK,EAAA,EACL,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,EACvC,KAAK,EAAC,KAAK,EACX,SAAS,EAAA,IAAA,EACT,SAAS,EAAE,GAAG,EACd,OAAO,EACNA,aAAK,SAAS,EAAC,sBAAsB,EAAA,QAAA,EACnC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;gCAC1B,MAAM,EAAE,GAAG,GAAG,CAAA,EAAG,CAAC,CAAA,CAAE,EAAE,KAAK,EAAE,GAAG,GAAG;AACnC,gCAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,KAAK,GAAG;AAErC,gCAAA,QACCA,GAAA,CAAA,GAAA,EAAA,EAEC,SAAS,EAAE,UAAU,CAAC,WAAW,EAAE;AAClC,wCAAA,cAAc,EAAE,QAAQ;AACxB,qCAAA,CAAC,EACF,OAAO,EAAE,MAAM,IAAI,CAAC,GAAG,CAAC,YAEvB,KAAK,EAAA,EAND,GAAG,CAOL;AAEN,4BAAA,CAAC,CAAC,EAAA,CACG,EAAA,QAAA,EAGN,UAAU,CAAC,KAAK,CAAC,IAAI,CAAC,EAAA,CAChB,CACR,EAEA,MAAM,CAAA,EAAA,CACF,EAENA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,gBAAgB,EAAA,QAAA,EAC7B,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;oBAC1B,MAAM,EAAE,GAAG,GAAG,CAAA,EAAG,CAAC,CAAA,CAAE,EAAE,OAAO,EAAE,GAAG,GAAG;AACrC,oBAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,KAAK,GAAG;oBACrC,MAAM,IAAI,GACT,QAAQ;AACR,yBAAC,GAAG,KAAK,SAAS,IAAI,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;oBAEtD,QACC,IAAI,KACHA,GAAA,CAAA,KAAA,EAAA,EAEC,SAAS,EAAE,UAAU,CAAC,eAAe,EAAE;AACtC,4BAAA,cAAc,EAAE,QAAQ;AACxB,yBAAA,CAAC,YAED,OAAO,EAAA,EALH,GAAG,CAMH,CACN;AAEH,gBAAA,CAAC,CAAC,EAAA,CACG,CAAA,EAAA,CACD;AAER,CAAC;AAED,IAAI,CAAC,IAAI,GAAGE,IAAO;;;;"}
1
+ {"version":3,"file":"tabs.js","sources":["../../../../packages/components/tabs/tabs.tsx"],"sourcesContent":["import { MoreHorizRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport {\n\tCSSProperties,\n\tChildren,\n\tReactNode,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseRef,\n\tuseState,\n} from \"react\";\nimport { useIntersectionObserver, useSize } from \"../../js/hooks\";\nimport Button from \"../button\";\nimport Icon from \"../icon\";\nimport Popup from \"../popup\";\nimport Helpericon from \"../utils/helpericon\";\nimport \"./index.css\";\nimport TabItem from \"./item\";\nimport { CompositionTabs, ITabItem, ITabs } from \"./type\";\n\nconst Tabs = ((props: ITabs) => {\n\tconst {\n\t\tref,\n\t\tactive,\n\t\ttabs: items,\n\t\ttype = \"default\",\n\t\tprepend,\n\t\tappend,\n\t\tchildren,\n\t\tclassName,\n\t\tvertical,\n\t\ttoggable,\n\t\tnavsJustify = \"start\",\n\t\tbar = true,\n\t\thideMore,\n\t\tbarClass,\n\t\trenderMore = () => (\n\t\t\t<Button flat square size='small'>\n\t\t\t\t<Icon icon={<MoreHorizRound />} />\n\t\t\t</Button>\n\t\t),\n\t\tonTabChange,\n\t\t...rest\n\t} = props;\n\n\tconst navRefs = useRef<HTMLElement[]>([]);\n\tconst barRef = useRef<HTMLSpanElement>(null);\n\tconst navsRef = useRef<HTMLDivElement>(null);\n\tconst contentsRef = useRef<Map<string, ReactNode>>(new Map());\n\tconst [activeKey, setActiveKey] = useState<string | undefined>(active);\n\tconst [prevActiveKey, setPrevActiveKey] = useState<string | undefined>(\n\t\tundefined,\n\t);\n\tconst [barStyle, setBarStyle] = useState<CSSProperties>({});\n\tconst [cachedTabs, setCachedTabs] = useState<string[]>([]);\n\tconst [overflow, setOverflow] = useState(false);\n\tconst [moreTabs, setMoreTabs] = useState<ITabItem[]>([]);\n\tconst [tabs, setTabs] = useState<ITabItem[]>([]);\n\tconst { observe, unobserve } = useIntersectionObserver();\n\tconst size = useSize(navsRef);\n\n\tuseEffect(() => {\n\t\tcontentsRef.current.clear();\n\n\t\tif (!items) {\n\t\t\tif (!children) {\n\t\t\t\tsetTabs([]);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetTabs(\n\t\t\t\t(Children.map(children, (node, i) => {\n\t\t\t\t\tconst { key, props: nodeProps } = node as {\n\t\t\t\t\t\tkey?: string;\n\t\t\t\t\t\tprops?: any;\n\t\t\t\t\t};\n\t\t\t\t\tconst {\n\t\t\t\t\t\ttitle,\n\t\t\t\t\t\tchildren: tabChildren,\n\t\t\t\t\t\tcontent,\n\t\t\t\t\t\tkeepDOM,\n\t\t\t\t\t\tclosable,\n\t\t\t\t\t} = nodeProps;\n\t\t\t\t\tconst tabKey = String(key ?? i);\n\t\t\t\t\tcontentsRef.current.set(tabKey, tabChildren ?? content);\n\n\t\t\t\t\treturn {\n\t\t\t\t\t\tkey: tabKey,\n\t\t\t\t\t\ttitle,\n\t\t\t\t\t\tkeepDOM,\n\t\t\t\t\t\tclosable,\n\t\t\t\t\t};\n\t\t\t\t}) as ITabItem[]) ?? [],\n\t\t\t);\n\n\t\t\treturn;\n\t\t}\n\n\t\tsetTabs(\n\t\t\titems.map((item, i) => {\n\t\t\t\tif ([\"string\", \"number\"].includes(typeof item)) {\n\t\t\t\t\tconst key = String(item);\n\t\t\t\t\treturn { key, title: item };\n\t\t\t\t}\n\t\t\t\tconst key = String(item.key ?? i);\n\t\t\t\tcontentsRef.current.set(key, item.content);\n\t\t\t\tconst { content, ...rest } = item;\n\t\t\t\treturn {\n\t\t\t\t\t...rest,\n\t\t\t\t\tkey,\n\t\t\t\t};\n\t\t\t}),\n\t\t);\n\t}, [children, items]);\n\n\tconst add = (tab: ITabItem) => {\n\t\tconst tkey = String(tab.key ?? tabs.length);\n\t\tconst i = tabs.findIndex((t) => t.key === tkey);\n\n\t\tif (i > -1) {\n\t\t\topen(tabs[i].key ?? `${i}`);\n\t\t\treturn;\n\t\t}\n\n\t\tcontentsRef.current.set(tkey, tab.content);\n\t\tconst { content, ...rest } = tab;\n\t\tsetTabs((ts) => [...ts, { ...rest, key: tkey }]);\n\t\topen(tkey);\n\t};\n\n\tconst close = (key: string) => {\n\t\tconst i = tabs.findIndex((t) => t.key === key);\n\n\t\tif (i < 0) return;\n\n\t\tcontentsRef.current.delete(key);\n\t\tconst nextTabs = [...tabs];\n\t\tnextTabs.splice(i, 1);\n\t\tsetTabs(nextTabs);\n\n\t\tif (activeKey !== key) return;\n\n\t\tconst next = nextTabs[i] || nextTabs[i - 1];\n\t\topen(prevActiveKey ?? next?.key ?? \"\");\n\t};\n\n\tconst open = (key: string) => {\n\t\tif (key === activeKey) {\n\t\t\tif (!toggable) return;\n\n\t\t\tonTabChange?.(undefined, key);\n\t\t\tsetActiveKey(undefined);\n\n\t\t\tsetBarStyle({\n\t\t\t\theight: 0,\n\t\t\t\twidth: 0,\n\t\t\t});\n\t\t\treturn;\n\t\t}\n\n\t\tsetPrevActiveKey(activeKey);\n\t\tonTabChange?.(key, activeKey);\n\t\tsetActiveKey(key);\n\t};\n\n\tuseEffect(() => {\n\t\tif (!size || hideMore || !observe) return;\n\t\tconst { scrollHeight, scrollWidth } = navsRef.current as HTMLElement;\n\t\tconst { width, height } = size;\n\n\t\tconst nextOverflow = scrollHeight > height || scrollWidth > width;\n\t\tsetOverflow(nextOverflow);\n\n\t\tif (!nextOverflow) return;\n\n\t\tnavRefs.current.map((nav, i) => {\n\t\t\tif (!nav) return;\n\t\t\tobserve(nav, (tar: HTMLElement, visible: boolean) => {\n\t\t\t\tsetTabs((ts) => {\n\t\t\t\t\tif (!ts[i]) return ts;\n\t\t\t\t\tconst nextTabs = ts.map((t, idx) =>\n\t\t\t\t\t\tidx === i ? { ...t, intersecting: visible } : t,\n\t\t\t\t\t);\n\t\t\t\t\tsetMoreTabs(nextTabs.filter((tab) => !tab.intersecting));\n\t\t\t\t\treturn nextTabs;\n\t\t\t\t});\n\t\t\t});\n\t\t});\n\t}, [size, hideMore, tabs.length, observe]);\n\n\tuseEffect(() => {\n\t\tif (!bar || type === \"pane\" || activeKey === undefined) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst index = tabs.findIndex((tab) => tab.key === activeKey);\n\n\t\tsetTimeout(() => {\n\t\t\tconst nav = navRefs.current[index];\n\n\t\t\tif (!nav) return;\n\n\t\t\tif (tabs[index]?.keepDOM && activeKey) {\n\t\t\t\tsetCachedTabs((keys) => {\n\t\t\t\t\tif (keys.includes(activeKey)) return keys;\n\t\t\t\t\treturn [activeKey, ...keys];\n\t\t\t\t});\n\t\t\t}\n\n\t\t\tconst { offsetHeight, offsetLeft, offsetTop, offsetWidth } = nav;\n\t\t\tconst isLine = type === \"line\";\n\n\t\t\tsetBarStyle({\n\t\t\t\theight: !vertical && isLine ? \".25em\" : offsetHeight,\n\t\t\t\twidth: vertical && isLine ? \".25em\" : offsetWidth,\n\t\t\t\ttransform: `translate(${offsetLeft}px, ${offsetTop}px)`,\n\t\t\t});\n\t\t}, 16);\n\t}, [activeKey, bar, size, tabs, type, vertical]);\n\n\tuseEffect(() => {\n\t\tif (active === undefined || activeKey === active) return;\n\n\t\topen(active);\n\t}, [active]);\n\n\tuseEffect(() => {\n\t\tif (hideMore || !unobserve) return;\n\n\t\treturn () => {\n\t\t\tnavRefs.current?.map(unobserve);\n\t\t};\n\t}, [tabs.length, hideMore, unobserve]);\n\n\tuseEffect(() => {\n\t\tif (!navsRef.current || vertical) return;\n\n\t\tconst handleMouseWheel = (e) => {\n\t\t\te.stopPropagation();\n\t\t\te.preventDefault();\n\n\t\t\tif (vertical) return;\n\n\t\t\tnavsRef.current?.scrollBy({\n\t\t\t\tleft: e.deltaY + e.deltaX,\n\t\t\t});\n\t\t};\n\n\t\tnavsRef.current.addEventListener(\"wheel\", handleMouseWheel, {\n\t\t\tpassive: false,\n\t\t});\n\n\t\treturn () => {\n\t\t\tif (!navsRef.current) return;\n\t\t\tnavsRef.current.removeEventListener(\"wheel\", handleMouseWheel);\n\t\t};\n\t}, [navsRef.current]);\n\n\tuseImperativeHandle(ref, () => ({\n\t\topen,\n\t\tclose,\n\t\tadd,\n\t\tnavs: navsRef,\n\t}));\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-tabs\",\n\t\t\t\t{ flex: vertical, [`i-tabs-${type}`]: type !== \"default\" },\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...rest}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-tab-navs-container\", {\n\t\t\t\t\t\"i-tab-navs-vertical\": vertical,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{prepend}\n\n\t\t\t\t<div\n\t\t\t\t\tref={navsRef}\n\t\t\t\t\tclassName={classNames(\n\t\t\t\t\t\t\"i-tab-navs\",\n\t\t\t\t\t\t`justify-${navsJustify}`,\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{tabs.map((tab, i) => {\n\t\t\t\t\t\tconst { title, key = `${i}`, closable } = tab;\n\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\tref={(ref) => (navRefs.current[i] = ref as any)}\n\t\t\t\t\t\t\t\tclassName={classNames(\"i-tab-nav\", {\n\t\t\t\t\t\t\t\t\t\"i-tab-active\": activeKey === key,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\tonClick={() => open(key)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{title}\n\n\t\t\t\t\t\t\t\t{closable && (\n\t\t\t\t\t\t\t\t\t<Helpericon\n\t\t\t\t\t\t\t\t\t\tas='i'\n\t\t\t\t\t\t\t\t\t\tactive\n\t\t\t\t\t\t\t\t\t\tclassName='i-tab-nav-close'\n\t\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tclose(key);\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t);\n\t\t\t\t\t})}\n\n\t\t\t\t\t{bar && (\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tref={barRef}\n\t\t\t\t\t\t\tclassName={classNames(\"i-tab-navs-bar\", barClass)}\n\t\t\t\t\t\t\tstyle={barStyle}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t{!hideMore && overflow && moreTabs.length > 0 && (\n\t\t\t\t\t<Popup\n\t\t\t\t\t\tarrow={false}\n\t\t\t\t\t\tposition={vertical ? \"right\" : \"bottom\"}\n\t\t\t\t\t\talign='end'\n\t\t\t\t\t\ttouchable\n\t\t\t\t\t\thideDelay={500}\n\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t<div className='i-tabs-morelist pd-4'>\n\t\t\t\t\t\t\t\t{moreTabs.map((tab, i) => {\n\t\t\t\t\t\t\t\t\tconst { key = `${i}`, title } = tab;\n\t\t\t\t\t\t\t\t\tconst isActive = activeKey === key;\n\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\t\t\t\tclassName={classNames(\"i-tab-nav\", {\n\t\t\t\t\t\t\t\t\t\t\t\t\"i-tab-active\": isActive,\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t\tonClick={() => open(key)}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{title}\n\t\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderMore(moreTabs)}\n\t\t\t\t\t</Popup>\n\t\t\t\t)}\n\n\t\t\t\t{append}\n\t\t\t</div>\n\n\t\t\t<div className='i-tab-contents'>\n\t\t\t\t{tabs.map((tab, i) => {\n\t\t\t\t\tconst key = tab.key ?? `${i}`;\n\t\t\t\t\tconst content = contentsRef.current.get(key);\n\t\t\t\t\tconst isActive = activeKey === key;\n\t\t\t\t\tconst show =\n\t\t\t\t\t\tisActive ||\n\t\t\t\t\t\t(key !== undefined && cachedTabs.includes(key));\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\tshow && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\t\tclassName={classNames(\"i-tab-content\", {\n\t\t\t\t\t\t\t\t\t\"i-tab-active\": isActive,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{content}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n}) as CompositionTabs;\n\nTabs.Item = TabItem;\n\nexport default Tabs;\n"],"names":["_jsx","_jsxs","TabItem"],"mappings":";;;;;;;;;;;AAoBA,MAAM,IAAI,IAAI,CAAC,KAAY,KAAI;AAC9B,IAAA,MAAM,EACL,GAAG,EACH,MAAM,EACN,IAAI,EAAE,KAAK,EACX,IAAI,GAAG,SAAS,EAChB,OAAO,EACP,MAAM,EACN,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,WAAW,GAAG,OAAO,EACrB,GAAG,GAAG,IAAI,EACV,QAAQ,EACR,QAAQ,EACR,UAAU,GAAG,OACZA,GAAA,CAAC,MAAM,EAAA,EAAC,IAAI,QAAC,MAAM,EAAA,IAAA,EAAC,IAAI,EAAC,OAAO,EAAA,QAAA,EAC/BA,GAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAEA,GAAA,CAAC,cAAc,EAAA,EAAA,CAAG,GAAI,EAAA,CAC1B,CACT,EACD,WAAW,EACX,GAAG,IAAI,EACP,GAAG,KAAK;AAET,IAAA,MAAM,OAAO,GAAG,MAAM,CAAgB,EAAE,CAAC;AACzC,IAAA,MAAM,MAAM,GAAG,MAAM,CAAkB,IAAI,CAAC;AAC5C,IAAA,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC;IAC5C,MAAM,WAAW,GAAG,MAAM,CAAyB,IAAI,GAAG,EAAE,CAAC;IAC7D,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAqB,MAAM,CAAC;IACtE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CACjD,SAAS,CACT;IACD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAgB,EAAE,CAAC;IAC3D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAW,EAAE,CAAC;IAC1D,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IAC/C,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAa,EAAE,CAAC;IACxD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAa,EAAE,CAAC;IAChD,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,uBAAuB,EAAE;AACxD,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC;IAE7B,SAAS,CAAC,MAAK;AACd,QAAA,WAAW,CAAC,OAAO,CAAC,KAAK,EAAE;QAE3B,IAAI,CAAC,KAAK,EAAE;YACX,IAAI,CAAC,QAAQ,EAAE;gBACd,OAAO,CAAC,EAAE,CAAC;gBACX;YACD;AAEA,YAAA,OAAO,CACL,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,KAAI;gBACnC,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAGjC;AACD,gBAAA,MAAM,EACL,KAAK,EACL,QAAQ,EAAE,WAAW,EACrB,OAAO,EACP,OAAO,EACP,QAAQ,GACR,GAAG,SAAS;gBACb,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,IAAI,CAAC,CAAC;gBAC/B,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,EAAE,WAAW,IAAI,OAAO,CAAC;gBAEvD,OAAO;AACN,oBAAA,GAAG,EAAE,MAAM;oBACX,KAAK;oBACL,OAAO;oBACP,QAAQ;iBACR;AACF,YAAA,CAAC,CAAgB,IAAI,EAAE,CACvB;YAED;QACD;QAEA,OAAO,CACN,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAI;AACrB,YAAA,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,OAAO,IAAI,CAAC,EAAE;AAC/C,gBAAA,MAAM,GAAG,GAAG,MAAM,CAAC,IAAI,CAAC;AACxB,gBAAA,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE;YAC5B;YACA,MAAM,GAAG,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC;YACjC,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,OAAO,CAAC;YAC1C,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,GAAG,IAAI;YACjC,OAAO;AACN,gBAAA,GAAG,IAAI;gBACP,GAAG;aACH;QACF,CAAC,CAAC,CACF;AACF,IAAA,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;AAErB,IAAA,MAAM,GAAG,GAAG,CAAC,GAAa,KAAI;AAC7B,QAAA,MAAM,IAAI,GAAG,MAAM,CAAC,GAAG,CAAC,GAAG,IAAI,IAAI,CAAC,MAAM,CAAC;AAC3C,QAAA,MAAM,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC;AAE/C,QAAA,IAAI,CAAC,GAAG,EAAE,EAAE;AACX,YAAA,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAA,EAAG,CAAC,CAAA,CAAE,CAAC;YAC3B;QACD;QAEA,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,OAAO,CAAC;QAC1C,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,GAAG,GAAG;QAChC,OAAO,CAAC,CAAC,EAAE,KAAK,CAAC,GAAG,EAAE,EAAE,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC;QAChD,IAAI,CAAC,IAAI,CAAC;AACX,IAAA,CAAC;AAED,IAAA,MAAM,KAAK,GAAG,CAAC,GAAW,KAAI;AAC7B,QAAA,MAAM,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC;QAE9C,IAAI,CAAC,GAAG,CAAC;YAAE;AAEX,QAAA,WAAW,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC;AAC/B,QAAA,MAAM,QAAQ,GAAG,CAAC,GAAG,IAAI,CAAC;AAC1B,QAAA,QAAQ,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC;QACrB,OAAO,CAAC,QAAQ,CAAC;QAEjB,IAAI,SAAS,KAAK,GAAG;YAAE;AAEvB,QAAA,MAAM,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC;QAC3C,IAAI,CAAC,aAAa,IAAI,IAAI,EAAE,GAAG,IAAI,EAAE,CAAC;AACvC,IAAA,CAAC;AAED,IAAA,MAAM,IAAI,GAAG,CAAC,GAAW,KAAI;AAC5B,QAAA,IAAI,GAAG,KAAK,SAAS,EAAE;AACtB,YAAA,IAAI,CAAC,QAAQ;gBAAE;AAEf,YAAA,WAAW,GAAG,SAAS,EAAE,GAAG,CAAC;YAC7B,YAAY,CAAC,SAAS,CAAC;AAEvB,YAAA,WAAW,CAAC;AACX,gBAAA,MAAM,EAAE,CAAC;AACT,gBAAA,KAAK,EAAE,CAAC;AACR,aAAA,CAAC;YACF;QACD;QAEA,gBAAgB,CAAC,SAAS,CAAC;AAC3B,QAAA,WAAW,GAAG,GAAG,EAAE,SAAS,CAAC;QAC7B,YAAY,CAAC,GAAG,CAAC;AAClB,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;AACd,QAAA,IAAI,CAAC,IAAI,IAAI,QAAQ,IAAI,CAAC,OAAO;YAAE;QACnC,MAAM,EAAE,YAAY,EAAE,WAAW,EAAE,GAAG,OAAO,CAAC,OAAsB;AACpE,QAAA,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI;QAE9B,MAAM,YAAY,GAAG,YAAY,GAAG,MAAM,IAAI,WAAW,GAAG,KAAK;QACjE,WAAW,CAAC,YAAY,CAAC;AAEzB,QAAA,IAAI,CAAC,YAAY;YAAE;QAEnB,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;AAC9B,YAAA,IAAI,CAAC,GAAG;gBAAE;YACV,OAAO,CAAC,GAAG,EAAE,CAAC,GAAgB,EAAE,OAAgB,KAAI;AACnD,gBAAA,OAAO,CAAC,CAAC,EAAE,KAAI;AACd,oBAAA,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;AAAE,wBAAA,OAAO,EAAE;AACrB,oBAAA,MAAM,QAAQ,GAAG,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,KAC9B,GAAG,KAAK,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,CAAC,CAC/C;AACD,oBAAA,WAAW,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;AACxD,oBAAA,OAAO,QAAQ;AAChB,gBAAA,CAAC,CAAC;AACH,YAAA,CAAC,CAAC;AACH,QAAA,CAAC,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAE1C,SAAS,CAAC,MAAK;QACd,IAAI,CAAC,GAAG,IAAI,IAAI,KAAK,MAAM,IAAI,SAAS,KAAK,SAAS,EAAE;YACvD;QACD;AAEA,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,SAAS,CAAC;QAE5D,UAAU,CAAC,MAAK;YACf,MAAM,GAAG,GAAG,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC;AAElC,YAAA,IAAI,CAAC,GAAG;gBAAE;YAEV,IAAI,IAAI,CAAC,KAAK,CAAC,EAAE,OAAO,IAAI,SAAS,EAAE;AACtC,gBAAA,aAAa,CAAC,CAAC,IAAI,KAAI;AACtB,oBAAA,IAAI,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC;AAAE,wBAAA,OAAO,IAAI;AACzC,oBAAA,OAAO,CAAC,SAAS,EAAE,GAAG,IAAI,CAAC;AAC5B,gBAAA,CAAC,CAAC;YACH;YAEA,MAAM,EAAE,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,GAAG;AAChE,YAAA,MAAM,MAAM,GAAG,IAAI,KAAK,MAAM;AAE9B,YAAA,WAAW,CAAC;AACX,gBAAA,MAAM,EAAE,CAAC,QAAQ,IAAI,MAAM,GAAG,OAAO,GAAG,YAAY;gBACpD,KAAK,EAAE,QAAQ,IAAI,MAAM,GAAG,OAAO,GAAG,WAAW;AACjD,gBAAA,SAAS,EAAE,CAAA,UAAA,EAAa,UAAU,CAAA,IAAA,EAAO,SAAS,CAAA,GAAA,CAAK;AACvD,aAAA,CAAC;QACH,CAAC,EAAE,EAAE,CAAC;AACP,IAAA,CAAC,EAAE,CAAC,SAAS,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,CAAC,CAAC;IAEhD,SAAS,CAAC,MAAK;AACd,QAAA,IAAI,MAAM,KAAK,SAAS,IAAI,SAAS,KAAK,MAAM;YAAE;QAElD,IAAI,CAAC,MAAM,CAAC;AACb,IAAA,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;IAEZ,SAAS,CAAC,MAAK;QACd,IAAI,QAAQ,IAAI,CAAC,SAAS;YAAE;AAE5B,QAAA,OAAO,MAAK;AACX,YAAA,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,SAAS,CAAC;AAChC,QAAA,CAAC;IACF,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;IAEtC,SAAS,CAAC,MAAK;AACd,QAAA,IAAI,CAAC,OAAO,CAAC,OAAO,IAAI,QAAQ;YAAE;AAElC,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAC,KAAI;YAC9B,CAAC,CAAC,eAAe,EAAE;YACnB,CAAC,CAAC,cAAc,EAAE;AAElB,YAAA,IAAI,QAAQ;gBAAE;AAEd,YAAA,OAAO,CAAC,OAAO,EAAE,QAAQ,CAAC;AACzB,gBAAA,IAAI,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,MAAM;AACzB,aAAA,CAAC;AACH,QAAA,CAAC;QAED,OAAO,CAAC,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,gBAAgB,EAAE;AAC3D,YAAA,OAAO,EAAE,KAAK;AACd,SAAA,CAAC;AAEF,QAAA,OAAO,MAAK;YACX,IAAI,CAAC,OAAO,CAAC,OAAO;gBAAE;YACtB,OAAO,CAAC,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,gBAAgB,CAAC;AAC/D,QAAA,CAAC;AACF,IAAA,CAAC,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;AAErB,IAAA,mBAAmB,CAAC,GAAG,EAAE,OAAO;QAC/B,IAAI;QACJ,KAAK;QACL,GAAG;AACH,QAAA,IAAI,EAAE,OAAO;AACb,KAAA,CAAC,CAAC;AAEH,IAAA,QACCC,IAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CACpB,QAAQ,EACR,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,UAAU,IAAI,CAAA,CAAE,GAAG,IAAI,KAAK,SAAS,EAAE,EAC1D,SAAS,CACT,EAAA,GACG,IAAI,EAAA,QAAA,EAAA,CAERA,cACC,SAAS,EAAE,UAAU,CAAC,sBAAsB,EAAE;AAC7C,oBAAA,qBAAqB,EAAE,QAAQ;AAC/B,iBAAA,CAAC,EAAA,QAAA,EAAA,CAED,OAAO,EAERA,IAAA,CAAA,KAAA,EAAA,EACC,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,UAAU,CACpB,YAAY,EACZ,CAAA,QAAA,EAAW,WAAW,CAAA,CAAE,CACxB,EAAA,QAAA,EAAA,CAEA,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;AACpB,gCAAA,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,CAAA,EAAG,CAAC,CAAA,CAAE,EAAE,QAAQ,EAAE,GAAG,GAAG;gCAE7C,QACCA,IAAA,CAAA,GAAA,EAAA,EAEC,GAAG,EAAE,CAAC,GAAG,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,GAAU,CAAC,EAC/C,SAAS,EAAE,UAAU,CAAC,WAAW,EAAE;wCAClC,cAAc,EAAE,SAAS,KAAK,GAAG;AACjC,qCAAA,CAAC,EACF,OAAO,EAAE,MAAM,IAAI,CAAC,GAAG,CAAC,EAAA,QAAA,EAAA,CAEvB,KAAK,EAEL,QAAQ,KACRD,GAAA,CAAC,UAAU,EAAA,EACV,EAAE,EAAC,GAAG,EACN,MAAM,EAAA,IAAA,EACN,SAAS,EAAC,iBAAiB,EAC3B,OAAO,EAAE,CAAC,CAAC,KAAI;gDACd,CAAC,CAAC,eAAe,EAAE;gDACnB,KAAK,CAAC,GAAG,CAAC;AACX,4CAAA,CAAC,GACA,CACF,CAAA,EAAA,EAnBI,GAAG,CAoBL;AAEN,4BAAA,CAAC,CAAC,EAED,GAAG,KACHA,cACC,GAAG,EAAE,MAAM,EACX,SAAS,EAAE,UAAU,CAAC,gBAAgB,EAAE,QAAQ,CAAC,EACjD,KAAK,EAAE,QAAQ,EAAA,CACd,CACF,IACI,EAEL,CAAC,QAAQ,IAAI,QAAQ,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,KAC5CA,IAAC,KAAK,EAAA,EACL,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,EACvC,KAAK,EAAC,KAAK,EACX,SAAS,EAAA,IAAA,EACT,SAAS,EAAE,GAAG,EACd,OAAO,EACNA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,sBAAsB,EAAA,QAAA,EACnC,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;gCACxB,MAAM,EAAE,GAAG,GAAG,CAAA,EAAG,CAAC,CAAA,CAAE,EAAE,KAAK,EAAE,GAAG,GAAG;AACnC,gCAAA,MAAM,QAAQ,GAAG,SAAS,KAAK,GAAG;AAElC,gCAAA,QACCA,GAAA,CAAA,GAAA,EAAA,EAEC,SAAS,EAAE,UAAU,CAAC,WAAW,EAAE;AAClC,wCAAA,cAAc,EAAE,QAAQ;AACxB,qCAAA,CAAC,EACF,OAAO,EAAE,MAAM,IAAI,CAAC,GAAG,CAAC,YAEvB,KAAK,EAAA,EAND,GAAG,CAOL;4BAEN,CAAC,CAAC,EAAA,CACG,EAAA,QAAA,EAGN,UAAU,CAAC,QAAQ,CAAC,EAAA,CACd,CACR,EAEA,MAAM,CAAA,EAAA,CACF,EAENA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,gBAAgB,EAAA,QAAA,EAC7B,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;oBACpB,MAAM,GAAG,GAAG,GAAG,CAAC,GAAG,IAAI,CAAA,EAAG,CAAC,CAAA,CAAE;oBAC7B,MAAM,OAAO,GAAG,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC;AAC5C,oBAAA,MAAM,QAAQ,GAAG,SAAS,KAAK,GAAG;oBAClC,MAAM,IAAI,GACT,QAAQ;yBACP,GAAG,KAAK,SAAS,IAAI,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;oBAEhD,QACC,IAAI,KACHA,GAAA,CAAA,KAAA,EAAA,EAEC,SAAS,EAAE,UAAU,CAAC,eAAe,EAAE;AACtC,4BAAA,cAAc,EAAE,QAAQ;AACxB,yBAAA,CAAC,YAED,OAAO,EAAA,EALH,GAAG,CAMH,CACN;AAEH,gBAAA,CAAC,CAAC,EAAA,CACG,CAAA,EAAA,CACD;AAER,CAAC;AAED,IAAI,CAAC,IAAI,GAAGE,IAAO;;;;"}