@activecollab/components 1.0.146 → 1.0.149

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 (67) hide show
  1. package/dist/cjs/components/Autocomplete/Autocomplete.js +9 -9
  2. package/dist/cjs/components/Autocomplete/Autocomplete.js.map +1 -1
  3. package/dist/cjs/components/Chip/Chip.js +31 -5
  4. package/dist/cjs/components/Chip/Chip.js.map +1 -1
  5. package/dist/cjs/components/Chip/Styles.js +15 -7
  6. package/dist/cjs/components/Chip/Styles.js.map +1 -1
  7. package/dist/cjs/components/ComboBox/ComboBox.js +199 -18
  8. package/dist/cjs/components/ComboBox/ComboBox.js.map +1 -1
  9. package/dist/cjs/components/ComboBox/Styles.js +4 -4
  10. package/dist/cjs/components/ComboBox/Styles.js.map +1 -1
  11. package/dist/cjs/components/Input/Styles.js +3 -1
  12. package/dist/cjs/components/Input/Styles.js.map +1 -1
  13. package/dist/cjs/components/Loaders/Spinner/Styles.js +1 -1
  14. package/dist/cjs/components/Loaders/Spinner/Styles.js.map +1 -1
  15. package/dist/cjs/components/Select/OptionGroup/OptionGroup.js +2 -2
  16. package/dist/cjs/components/Select/OptionGroup/OptionGroup.js.map +1 -1
  17. package/dist/cjs/components/Select/OptionGroup/Styles.js +11 -4
  18. package/dist/cjs/components/Select/OptionGroup/Styles.js.map +1 -1
  19. package/dist/cjs/components/Select/Select.js +1 -5
  20. package/dist/cjs/components/Select/Select.js.map +1 -1
  21. package/dist/cjs/hooks/useOnClickOutside.js +35 -0
  22. package/dist/cjs/hooks/useOnClickOutside.js.map +1 -0
  23. package/dist/esm/components/Autocomplete/Autocomplete.d.ts +1 -0
  24. package/dist/esm/components/Autocomplete/Autocomplete.d.ts.map +1 -1
  25. package/dist/esm/components/Autocomplete/Autocomplete.js +7 -9
  26. package/dist/esm/components/Autocomplete/Autocomplete.js.map +1 -1
  27. package/dist/esm/components/Chip/Chip.d.ts +2 -0
  28. package/dist/esm/components/Chip/Chip.d.ts.map +1 -1
  29. package/dist/esm/components/Chip/Chip.js +26 -5
  30. package/dist/esm/components/Chip/Chip.js.map +1 -1
  31. package/dist/esm/components/Chip/Styles.d.ts +4 -1
  32. package/dist/esm/components/Chip/Styles.d.ts.map +1 -1
  33. package/dist/esm/components/Chip/Styles.js +15 -7
  34. package/dist/esm/components/Chip/Styles.js.map +1 -1
  35. package/dist/esm/components/ComboBox/ComboBox.d.ts +8 -4
  36. package/dist/esm/components/ComboBox/ComboBox.d.ts.map +1 -1
  37. package/dist/esm/components/ComboBox/ComboBox.js +191 -19
  38. package/dist/esm/components/ComboBox/ComboBox.js.map +1 -1
  39. package/dist/esm/components/ComboBox/Styles.d.ts.map +1 -1
  40. package/dist/esm/components/ComboBox/Styles.js +3 -4
  41. package/dist/esm/components/ComboBox/Styles.js.map +1 -1
  42. package/dist/esm/components/Input/Styles.d.ts +1 -0
  43. package/dist/esm/components/Input/Styles.d.ts.map +1 -1
  44. package/dist/esm/components/Input/Styles.js +3 -1
  45. package/dist/esm/components/Input/Styles.js.map +1 -1
  46. package/dist/esm/components/Loaders/Spinner/Styles.d.ts.map +1 -1
  47. package/dist/esm/components/Loaders/Spinner/Styles.js +1 -1
  48. package/dist/esm/components/Loaders/Spinner/Styles.js.map +1 -1
  49. package/dist/esm/components/Select/OptionGroup/OptionGroup.d.ts.map +1 -1
  50. package/dist/esm/components/Select/OptionGroup/OptionGroup.js +3 -3
  51. package/dist/esm/components/Select/OptionGroup/OptionGroup.js.map +1 -1
  52. package/dist/esm/components/Select/OptionGroup/Styles.d.ts +1 -0
  53. package/dist/esm/components/Select/OptionGroup/Styles.d.ts.map +1 -1
  54. package/dist/esm/components/Select/OptionGroup/Styles.js +7 -3
  55. package/dist/esm/components/Select/OptionGroup/Styles.js.map +1 -1
  56. package/dist/esm/components/Select/Select.d.ts.map +1 -1
  57. package/dist/esm/components/Select/Select.js +2 -6
  58. package/dist/esm/components/Select/Select.js.map +1 -1
  59. package/dist/esm/hooks/useOnClickOutside.d.ts +3 -0
  60. package/dist/esm/hooks/useOnClickOutside.d.ts.map +1 -0
  61. package/dist/esm/hooks/useOnClickOutside.js +27 -0
  62. package/dist/esm/hooks/useOnClickOutside.js.map +1 -0
  63. package/dist/index.js +428 -212
  64. package/dist/index.js.map +1 -1
  65. package/dist/index.min.js +1 -1
  66. package/dist/index.min.js.map +1 -1
  67. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/Select/OptionGroup/OptionGroup.tsx"],"names":["React","useCallback","useEffect","useMemo","classNames","Checkbox","StyledOptionGroup","StyledOptionGroupHeader","StyledOptionGroupOption","List","OptionGroup","id","name","options","type","hover","filter","checked","onChange","setHover","renderOptions","optionGroupClassName","list","v","toLowerCase","includes","trim","document","getElementById","focus","isAllOptionsChecked","every","option","handleHover","undefined","allOptionValues","map","handleClick","e","stopPropagation","i","values","unique","item","pos","indexOf","index","displayName"],"mappings":"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","sourcesContent":["import React, { useCallback, useEffect, useMemo, FC } from \"react\";\nimport classNames from \"classnames\";\nimport { IOptionItemProps } from \"../Option/Option\";\nimport { Checkbox } from \"../../Checkbox/Checkbox\";\nimport {\n StyledOptionGroup,\n StyledOptionGroupHeader,\n StyledOptionGroupOption,\n} from \"./Styles\";\nimport { List } from \"../../List\";\n\nexport interface IOptionGroupProps extends IOptionItemProps {\n /** Options items list */\n options: IOptionItemProps[];\n}\n\ninterface IAdditionalOptionGroupProps {\n /** Select type: single or multiple */\n type?: \"single\" | \"multiple\";\n /** Value of hovered element */\n hover?: number | string | null;\n /** Filter for labels */\n filter?: string;\n /** Checked values */\n checked: (string | number)[];\n /** onChange callback */\n onChange?: (e: (string | number)[]) => void;\n /** Set value of hovered element */\n setHover?: (e: number | string | undefined) => void;\n /** Render function */\n renderOptions?: (item: IOptionItemProps, index: number) => void;\n /** Value that represent class names */\n optionGroupClassName?: string;\n}\n\nexport const OptionGroup: FC<\n IOptionGroupProps & IAdditionalOptionGroupProps\n> = ({\n id,\n name,\n options,\n type,\n hover,\n filter,\n checked,\n onChange,\n setHover,\n renderOptions,\n optionGroupClassName,\n}) => {\n const list = useMemo(\n () =>\n filter\n ? options.filter((v) =>\n v.name.toLowerCase().includes(filter.trim().toLowerCase())\n )\n : options,\n [filter, options]\n );\n\n useEffect(() => {\n if (hover === id && type !== \"single\") {\n document.getElementById(`${id}`)?.focus();\n }\n }, [hover, type, id]);\n\n const isAllOptionsChecked = useMemo(\n () => options.every((option) => checked.includes(option.id)),\n [options, checked]\n );\n\n const handleHover = useCallback(() => {\n if (setHover) {\n setHover(type === \"single\" ? undefined : id);\n }\n }, [setHover, type, id]);\n\n const allOptionValues = useMemo(\n () => options.map((option) => option.id),\n [options]\n );\n\n const handleClick = useCallback(\n (e) => {\n e.stopPropagation();\n if (onChange) {\n if (isAllOptionsChecked) {\n onChange(\n checked.filter((i) => allOptionValues.includes(i) === false)\n );\n } else {\n const values = [...checked, ...allOptionValues];\n const unique = values.filter((item, pos) => {\n return values.indexOf(item) === pos;\n });\n onChange(unique);\n }\n }\n },\n [allOptionValues, checked, isAllOptionsChecked, onChange]\n );\n\n return (\n <li\n key={id}\n className={classNames(\"c-option-group tw-flex-col\", optionGroupClassName)}\n >\n <StyledOptionGroup key={id}>\n <StyledOptionGroupOption\n onMouseEnter={handleHover}\n hover={hover === id && type === \"multiple\"}\n >\n <StyledOptionGroupHeader>\n {name}\n {type === \"multiple\" && (\n <Checkbox\n id={`${id}`}\n checked={isAllOptionsChecked}\n onChange={handleClick}\n type=\"checkbox\"\n />\n )}\n </StyledOptionGroupHeader>\n </StyledOptionGroupOption>\n <List>\n {list.map((item: IOptionItemProps, index) => {\n return typeof renderOptions === \"function\"\n ? renderOptions(item, index)\n : item.name;\n })}\n </List>\n </StyledOptionGroup>\n </li>\n );\n};\n\nOptionGroup.displayName = \"OptionGroup\";\n"],"file":"OptionGroup.js"}
1
+ {"version":3,"sources":["../../../../../src/components/Select/OptionGroup/OptionGroup.tsx"],"names":["React","useCallback","useEffect","useMemo","classNames","Checkbox","StyledOptionGroup","StyledOptionGroupHeader","StyledOptionGroupOption","StyledOptionGroupLi","List","OptionGroup","id","name","options","type","hover","filter","checked","onChange","setHover","renderOptions","optionGroupClassName","list","v","toLowerCase","includes","trim","document","getElementById","focus","isAllOptionsChecked","every","option","handleHover","undefined","allOptionValues","map","handleClick","e","stopPropagation","i","values","unique","item","pos","indexOf","index","displayName"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,WAAhB,EAA6BC,SAA7B,EAAwCC,OAAxC,QAA2D,OAA3D;AACA,OAAOC,UAAP,MAAuB,YAAvB;AAEA,SAASC,QAAT,QAAyB,yBAAzB;AACA,SACEC,iBADF,EAEEC,uBAFF,EAGEC,uBAHF,EAIEC,mBAJF,QAKO,UALP;AAMA,SAASC,IAAT,QAAqB,YAArB;AA0BA,OAAO,IAAMC,WAEZ,GAAG,SAFSA,WAET,OAYE;AAAA,MAXJC,EAWI,QAXJA,EAWI;AAAA,MAVJC,IAUI,QAVJA,IAUI;AAAA,MATJC,OASI,QATJA,OASI;AAAA,MARJC,IAQI,QARJA,IAQI;AAAA,MAPJC,KAOI,QAPJA,KAOI;AAAA,MANJC,MAMI,QANJA,MAMI;AAAA,MALJC,OAKI,QALJA,OAKI;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,QAGI,QAHJA,QAGI;AAAA,MAFJC,aAEI,QAFJA,aAEI;AAAA,MADJC,oBACI,QADJA,oBACI;AACJ,MAAMC,IAAI,GAAGpB,OAAO,CAClB;AAAA,WACEc,MAAM,GACFH,OAAO,CAACG,MAAR,CAAe,UAACO,CAAD;AAAA,aACbA,CAAC,CAACX,IAAF,CAAOY,WAAP,GAAqBC,QAArB,CAA8BT,MAAM,CAACU,IAAP,GAAcF,WAAd,EAA9B,CADa;AAAA,KAAf,CADE,GAIFX,OALN;AAAA,GADkB,EAOlB,CAACG,MAAD,EAASH,OAAT,CAPkB,CAApB;AAUAZ,EAAAA,SAAS,CAAC,YAAM;AACd,QAAIc,KAAK,KAAKJ,EAAV,IAAgBG,IAAI,KAAK,QAA7B,EAAuC;AAAA;;AACrC,+BAAAa,QAAQ,CAACC,cAAT,MAA2BjB,EAA3B,4CAAkCkB,KAAlC;AACD;AACF,GAJQ,EAIN,CAACd,KAAD,EAAQD,IAAR,EAAcH,EAAd,CAJM,CAAT;AAMA,MAAMmB,mBAAmB,GAAG5B,OAAO,CACjC;AAAA,WAAMW,OAAO,CAACkB,KAAR,CAAc,UAACC,MAAD;AAAA,aAAYf,OAAO,CAACQ,QAAR,CAAiBO,MAAM,CAACrB,EAAxB,CAAZ;AAAA,KAAd,CAAN;AAAA,GADiC,EAEjC,CAACE,OAAD,EAAUI,OAAV,CAFiC,CAAnC;AAKA,MAAMgB,WAAW,GAAGjC,WAAW,CAAC,YAAM;AACpC,QAAImB,QAAJ,EAAc;AACZA,MAAAA,QAAQ,CAACL,IAAI,KAAK,QAAT,GAAoBoB,SAApB,GAAgCvB,EAAjC,CAAR;AACD;AACF,GAJ8B,EAI5B,CAACQ,QAAD,EAAWL,IAAX,EAAiBH,EAAjB,CAJ4B,CAA/B;AAMA,MAAMwB,eAAe,GAAGjC,OAAO,CAC7B;AAAA,WAAMW,OAAO,CAACuB,GAAR,CAAY,UAACJ,MAAD;AAAA,aAAYA,MAAM,CAACrB,EAAnB;AAAA,KAAZ,CAAN;AAAA,GAD6B,EAE7B,CAACE,OAAD,CAF6B,CAA/B;AAKA,MAAMwB,WAAW,GAAGrC,WAAW,CAC7B,UAACsC,CAAD,EAAO;AACLA,IAAAA,CAAC,CAACC,eAAF;;AACA,QAAIrB,QAAJ,EAAc;AACZ,UAAIY,mBAAJ,EAAyB;AACvBZ,QAAAA,QAAQ,CACND,OAAO,CAACD,MAAR,CAAe,UAACwB,CAAD;AAAA,iBAAOL,eAAe,CAACV,QAAhB,CAAyBe,CAAzB,MAAgC,KAAvC;AAAA,SAAf,CADM,CAAR;AAGD,OAJD,MAIO;AACL,YAAMC,MAAM,aAAOxB,OAAP,EAAmBkB,eAAnB,CAAZ;AACA,YAAMO,MAAM,GAAGD,MAAM,CAACzB,MAAP,CAAc,UAAC2B,IAAD,EAAOC,GAAP,EAAe;AAC1C,iBAAOH,MAAM,CAACI,OAAP,CAAeF,IAAf,MAAyBC,GAAhC;AACD,SAFc,CAAf;AAGA1B,QAAAA,QAAQ,CAACwB,MAAD,CAAR;AACD;AACF;AACF,GAhB4B,EAiB7B,CAACP,eAAD,EAAkBlB,OAAlB,EAA2Ba,mBAA3B,EAAgDZ,QAAhD,CAjB6B,CAA/B;AAoBA,sBACE,oBAAC,mBAAD;AACE,IAAA,GAAG,EAAEP,EADP;AAEE,IAAA,SAAS,EAAER,UAAU,CAAC,gBAAD,EAAmBkB,oBAAnB;AAFvB,kBAIE,oBAAC,iBAAD;AAAmB,IAAA,GAAG,EAAEV;AAAxB,kBACE,oBAAC,uBAAD;AACE,IAAA,YAAY,EAAEsB,WADhB;AAEE,IAAA,KAAK,EAAElB,KAAK,KAAKJ,EAAV,IAAgBG,IAAI,KAAK;AAFlC,kBAIE,oBAAC,uBAAD,QACGF,IADH,EAEGE,IAAI,KAAK,UAAT,iBACC,oBAAC,QAAD;AACE,IAAA,EAAE,OAAKH,EADT;AAEE,IAAA,OAAO,EAAEmB,mBAFX;AAGE,IAAA,QAAQ,EAAEO,WAHZ;AAIE,IAAA,IAAI,EAAC;AAJP,IAHJ,CAJF,CADF,eAiBE,oBAAC,IAAD,QACGf,IAAI,CAACc,GAAL,CAAS,UAACO,IAAD,EAAyBG,KAAzB,EAAmC;AAC3C,WAAO,OAAO1B,aAAP,KAAyB,UAAzB,GACHA,aAAa,CAACuB,IAAD,EAAOG,KAAP,CADV,GAEHH,IAAI,CAAC/B,IAFT;AAGD,GAJA,CADH,CAjBF,CAJF,CADF;AAgCD,CAnGM;AAqGPF,WAAW,CAACqC,WAAZ,GAA0B,aAA1B","sourcesContent":["import React, { useCallback, useEffect, useMemo, FC } from \"react\";\nimport classNames from \"classnames\";\nimport { IOptionItemProps } from \"../Option/Option\";\nimport { Checkbox } from \"../../Checkbox/Checkbox\";\nimport {\n StyledOptionGroup,\n StyledOptionGroupHeader,\n StyledOptionGroupOption,\n StyledOptionGroupLi,\n} from \"./Styles\";\nimport { List } from \"../../List\";\n\nexport interface IOptionGroupProps extends IOptionItemProps {\n /** Options items list */\n options: IOptionItemProps[];\n}\n\ninterface IAdditionalOptionGroupProps {\n /** Select type: single or multiple */\n type?: \"single\" | \"multiple\";\n /** Value of hovered element */\n hover?: number | string | null;\n /** Filter for labels */\n filter?: string;\n /** Checked values */\n checked: (string | number)[];\n /** onChange callback */\n onChange?: (e: (string | number)[]) => void;\n /** Set value of hovered element */\n setHover?: (e: number | string | undefined) => void;\n /** Render function */\n renderOptions?: (item: IOptionItemProps, index: number) => void;\n /** Value that represent class names */\n optionGroupClassName?: string;\n}\n\nexport const OptionGroup: FC<\n IOptionGroupProps & IAdditionalOptionGroupProps\n> = ({\n id,\n name,\n options,\n type,\n hover,\n filter,\n checked,\n onChange,\n setHover,\n renderOptions,\n optionGroupClassName,\n}) => {\n const list = useMemo(\n () =>\n filter\n ? options.filter((v) =>\n v.name.toLowerCase().includes(filter.trim().toLowerCase())\n )\n : options,\n [filter, options]\n );\n\n useEffect(() => {\n if (hover === id && type !== \"single\") {\n document.getElementById(`${id}`)?.focus();\n }\n }, [hover, type, id]);\n\n const isAllOptionsChecked = useMemo(\n () => options.every((option) => checked.includes(option.id)),\n [options, checked]\n );\n\n const handleHover = useCallback(() => {\n if (setHover) {\n setHover(type === \"single\" ? undefined : id);\n }\n }, [setHover, type, id]);\n\n const allOptionValues = useMemo(\n () => options.map((option) => option.id),\n [options]\n );\n\n const handleClick = useCallback(\n (e) => {\n e.stopPropagation();\n if (onChange) {\n if (isAllOptionsChecked) {\n onChange(\n checked.filter((i) => allOptionValues.includes(i) === false)\n );\n } else {\n const values = [...checked, ...allOptionValues];\n const unique = values.filter((item, pos) => {\n return values.indexOf(item) === pos;\n });\n onChange(unique);\n }\n }\n },\n [allOptionValues, checked, isAllOptionsChecked, onChange]\n );\n\n return (\n <StyledOptionGroupLi\n key={id}\n className={classNames(\"c-option-group\", optionGroupClassName)}\n >\n <StyledOptionGroup key={id}>\n <StyledOptionGroupOption\n onMouseEnter={handleHover}\n hover={hover === id && type === \"multiple\"}\n >\n <StyledOptionGroupHeader>\n {name}\n {type === \"multiple\" && (\n <Checkbox\n id={`${id}`}\n checked={isAllOptionsChecked}\n onChange={handleClick}\n type=\"checkbox\"\n />\n )}\n </StyledOptionGroupHeader>\n </StyledOptionGroupOption>\n <List>\n {list.map((item: IOptionItemProps, index) => {\n return typeof renderOptions === \"function\"\n ? renderOptions(item, index)\n : item.name;\n })}\n </List>\n </StyledOptionGroup>\n </StyledOptionGroupLi>\n );\n};\n\nOptionGroup.displayName = \"OptionGroup\";\n"],"file":"OptionGroup.js"}
@@ -1,3 +1,4 @@
1
+ export declare const StyledOptionGroupLi: import("styled-components").StyledComponent<"li", any, {}, never>;
1
2
  export declare const StyledOptionGroup: import("styled-components").StyledComponent<"div", any, {}, never>;
2
3
  export declare const StyledOptionGroupHeader: import("styled-components").StyledComponent<"h3", any, {}, never>;
3
4
  export declare const StyledOptionGroupOption: import("styled-components").StyledComponent<"div", any, {
@@ -1 +1 @@
1
- {"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Select/OptionGroup/Styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,iBAAiB,oEAI7B,CAAC;AAIF,eAAO,MAAM,uBAAuB,mEAWnC,CAAC;AAIF,eAAO,MAAM,uBAAuB;;SAMnC,CAAC"}
1
+ {"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Select/OptionGroup/Styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,mBAAmB,mEAE/B,CAAC;AACF,eAAO,MAAM,iBAAiB,oEAI7B,CAAC;AAIF,eAAO,MAAM,uBAAuB,mEAWnC,CAAC;AAIF,eAAO,MAAM,uBAAuB;;SAMnC,CAAC"}
@@ -1,21 +1,25 @@
1
1
  import styled, { css } from "styled-components";
2
2
  import { BoxSizingStyle } from "../../BoxSizingStyle";
3
3
  import { FontStyle } from "../../FontStyle";
4
+ export var StyledOptionGroupLi = styled.li.withConfig({
5
+ displayName: "Styles__StyledOptionGroupLi",
6
+ componentId: "sc-16v5afu-0"
7
+ })(["flex-direction:column;"]);
4
8
  export var StyledOptionGroup = styled.div.withConfig({
5
9
  displayName: "Styles__StyledOptionGroup",
6
- componentId: "sc-16v5afu-0"
10
+ componentId: "sc-16v5afu-1"
7
11
  })(["", " ", " ", ""], {
8
12
  "userSelect": "none"
9
13
  }, FontStyle, BoxSizingStyle);
10
14
  StyledOptionGroup.displayName = "StyledOptionGroup";
11
15
  export var StyledOptionGroupHeader = styled.h3.withConfig({
12
16
  displayName: "Styles__StyledOptionGroupHeader",
13
- componentId: "sc-16v5afu-1"
17
+ componentId: "sc-16v5afu-2"
14
18
  })(["height:28px;display:flex;justify-content:space-between;align-items:center;padding:0 16px;color:var(--color-theme-900);margin:6px 0;*{margin:auto 0;}"]);
15
19
  StyledOptionGroupHeader.displayName = "StyledOptionGroupHeader";
16
20
  export var StyledOptionGroupOption = styled.div.withConfig({
17
21
  displayName: "Styles__StyledOptionGroupOption",
18
- componentId: "sc-16v5afu-2"
22
+ componentId: "sc-16v5afu-3"
19
23
  })(["", ""], function (props) {
20
24
  return props.hover && css(["background-color:var(--color-theme-200);"]);
21
25
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/Select/OptionGroup/Styles.ts"],"names":["styled","css","BoxSizingStyle","FontStyle","StyledOptionGroup","div","displayName","StyledOptionGroupHeader","h3","StyledOptionGroupOption","props","hover"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,cAAT,QAA+B,sBAA/B;AACA,SAASC,SAAT,QAA0B,iBAA1B;AAEA,OAAO,IAAMC,iBAAiB,GAAGJ,MAAM,CAACK,GAAV;AAAA;AAAA;AAAA,uBACxB;AAAA;AAAA,CADwB,EAE1BF,SAF0B,EAG1BD,cAH0B,CAAvB;AAMPE,iBAAiB,CAACE,WAAlB,GAAgC,mBAAhC;AAEA,OAAO,IAAMC,uBAAuB,GAAGP,MAAM,CAACQ,EAAV;AAAA;AAAA;AAAA,4JAA7B;AAaPD,uBAAuB,CAACD,WAAxB,GAAsC,yBAAtC;AAEA,OAAO,IAAMG,uBAAuB,GAAGT,MAAM,CAACK,GAAV;AAAA;AAAA;AAAA,aAChC,UAACK,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,IACAV,GADA,8CADA;AAAA,CADgC,CAA7B;AAQPQ,uBAAuB,CAACH,WAAxB,GAAsC,yBAAtC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { BoxSizingStyle } from \"../../BoxSizingStyle\";\nimport { FontStyle } from \"../../FontStyle\";\n\nexport const StyledOptionGroup = styled.div`\n ${tw`tw-select-none`}\n ${FontStyle}\n ${BoxSizingStyle}\n`;\n\nStyledOptionGroup.displayName = \"StyledOptionGroup\";\n\nexport const StyledOptionGroupHeader = styled.h3`\n height: 28px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0 16px;\n color: var(--color-theme-900);\n margin: 6px 0;\n * {\n margin: auto 0;\n }\n`;\n\nStyledOptionGroupHeader.displayName = \"StyledOptionGroupHeader\";\n\nexport const StyledOptionGroupOption = styled.div<{ hover?: boolean }>`\n ${(props) =>\n props.hover &&\n css`\n background-color: var(--color-theme-200);\n `}\n`;\n\nStyledOptionGroupOption.displayName = \"StyledOptionGroupOption\";\n"],"file":"Styles.js"}
1
+ {"version":3,"sources":["../../../../../src/components/Select/OptionGroup/Styles.ts"],"names":["styled","css","BoxSizingStyle","FontStyle","StyledOptionGroupLi","li","StyledOptionGroup","div","displayName","StyledOptionGroupHeader","h3","StyledOptionGroupOption","props","hover"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,cAAT,QAA+B,sBAA/B;AACA,SAASC,SAAT,QAA0B,iBAA1B;AAEA,OAAO,IAAMC,mBAAmB,GAAGJ,MAAM,CAACK,EAAV;AAAA;AAAA;AAAA,8BAAzB;AAGP,OAAO,IAAMC,iBAAiB,GAAGN,MAAM,CAACO,GAAV;AAAA;AAAA;AAAA,uBACxB;AAAA;AAAA,CADwB,EAE1BJ,SAF0B,EAG1BD,cAH0B,CAAvB;AAMPI,iBAAiB,CAACE,WAAlB,GAAgC,mBAAhC;AAEA,OAAO,IAAMC,uBAAuB,GAAGT,MAAM,CAACU,EAAV;AAAA;AAAA;AAAA,4JAA7B;AAaPD,uBAAuB,CAACD,WAAxB,GAAsC,yBAAtC;AAEA,OAAO,IAAMG,uBAAuB,GAAGX,MAAM,CAACO,GAAV;AAAA;AAAA;AAAA,aAChC,UAACK,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,IACAZ,GADA,8CADA;AAAA,CADgC,CAA7B;AAQPU,uBAAuB,CAACH,WAAxB,GAAsC,yBAAtC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { BoxSizingStyle } from \"../../BoxSizingStyle\";\nimport { FontStyle } from \"../../FontStyle\";\n\nexport const StyledOptionGroupLi = styled.li`\n flex-direction: column;\n`;\nexport const StyledOptionGroup = styled.div`\n ${tw`tw-select-none`}\n ${FontStyle}\n ${BoxSizingStyle}\n`;\n\nStyledOptionGroup.displayName = \"StyledOptionGroup\";\n\nexport const StyledOptionGroupHeader = styled.h3`\n height: 28px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0 16px;\n color: var(--color-theme-900);\n margin: 6px 0;\n * {\n margin: auto 0;\n }\n`;\n\nStyledOptionGroupHeader.displayName = \"StyledOptionGroupHeader\";\n\nexport const StyledOptionGroupOption = styled.div<{ hover?: boolean }>`\n ${(props) =>\n props.hover &&\n css`\n background-color: var(--color-theme-200);\n `}\n`;\n\nStyledOptionGroupOption.displayName = \"StyledOptionGroupOption\";\n"],"file":"Styles.js"}
@@ -1 +1 @@
1
- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,EAAE,EAGF,YAAY,EAIZ,GAAG,EACJ,MAAM,OAAO,CAAC;AAOf,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAUlE,UAAU,cAAc,CAAC,CAAC,CAAE,SAAQ,YAAY;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;CACd;AAED,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,cAAc,GAAG,SAAS,CAAC;IAE5D,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IAEnC,MAAM,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAEjC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,GAAG,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAE9D,UAAU,CAAC,EAAE,YAAY,CAAC;IAE1B,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAE9C,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAE1B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,eAAO,MAAM,MAAM,EAAE,EAAE,CAAC,YAAY,CAuOnC,CAAC"}
1
+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,EAAE,EAGF,YAAY,EAIZ,GAAG,EACJ,MAAM,OAAO,CAAC;AAOf,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAUlE,UAAU,cAAc,CAAC,CAAC,CAAE,SAAQ,YAAY;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;CACd;AAED,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,cAAc,GAAG,SAAS,CAAC;IAE5D,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IAEnC,MAAM,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAEjC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,GAAG,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAE9D,UAAU,CAAC,EAAE,YAAY,CAAC;IAE1B,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAE9C,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAE1B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,eAAO,MAAM,MAAM,EAAE,EAAE,CAAC,YAAY,CAiOnC,CAAC"}
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
3
  var _excluded = ["type", "mode", "target", "options", "selected", "position", "onChange", "actionIcon", "actionLabel", "placeholder", "emptyAction", "disableSearch", "forceCloseMenu", "selectClassName", "keepSameOptionsOrder", "onSelectOpen", "onSelectClose", "renderOption", "handleDefaultOptionChange", "preselectDefaultValue"];
4
4
  import React, { useCallback, useState, useMemo, useEffect, useRef } from "react";
5
- import { Autocomplete } from "../Autocomplete";
5
+ import { Autocomplete, isOptionGroup } from "../Autocomplete";
6
6
  import { Tooltip } from "../Tooltip";
7
7
  import { Menu } from "../Menu/Menu";
8
8
  import classNames from "classnames";
@@ -57,10 +57,6 @@ export var Select = function Select(_ref) {
57
57
  open = _useState2[0],
58
58
  setOpen = _useState2[1];
59
59
 
60
- function isGroup(item) {
61
- return item.options !== undefined;
62
- }
63
-
64
60
  var selectedOptions = useMemo(function () {
65
61
  return selected instanceof Array ? selected : [selected];
66
62
  }, [selected]);
@@ -73,7 +69,7 @@ export var Select = function Select(_ref) {
73
69
  }, [options]);
74
70
  var allOptionValues = useMemo(function () {
75
71
  return selectOptions.reduce(function (acc, option) {
76
- if (!isGroup(option)) {
72
+ if (!isOptionGroup(option)) {
77
73
  return [].concat(acc, [option.id]);
78
74
  }
79
75
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/Select/Select.tsx"],"names":["React","useCallback","useState","useMemo","useEffect","useRef","Autocomplete","Tooltip","Menu","classNames","useForkRef","StyledSelectForm","StyledSelectInput","StyledCheckbox","StyledRadioButton","OptionContent","Select","type","mode","target","options","selected","position","onChange","actionIcon","actionLabel","placeholder","emptyAction","disableSearch","forceCloseMenu","selectClassName","keepSameOptionsOrder","onSelectOpen","onSelectClose","renderOption","handleDefaultOptionChange","preselectDefaultValue","prop","childNode","setChildNode","elementRef","handleRef","Tag","formRef","open","setOpen","isGroup","item","undefined","selectedOptions","Array","selectOptions","allOptionValues","reduce","acc","option","id","allGroupOptions","map","isAllOptionsChecked","every","includes","focus","handleChange","selectedValue","onClose","onOpen","props","menuClassName","className","handleEmptyAction","value","current","reset","handleDefaultOptionChangeCallback","length","handleRenderOption","image","color","textColor","name","additionalInfo","zIndex","displayName"],"mappings":"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","sourcesContent":["import React, {\n FC,\n useCallback,\n useState,\n ReactElement,\n useMemo,\n useEffect,\n useRef,\n Ref,\n} from \"react\";\nimport { Autocomplete } from \"../Autocomplete\";\nimport { Tooltip } from \"../Tooltip\";\nimport { Menu } from \"../Menu/Menu\";\nimport { IOptionItemProps } from \"../Select/Option\";\nimport { IOptionGroupProps } from \"../Select/OptionGroup\";\nimport classNames from \"classnames\";\nimport { Placement } from \"@popperjs/core\";\nimport { IAutocompleteProps } from \"../Autocomplete/Autocomplete\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport {\n StyledSelectForm,\n StyledSelectInput,\n StyledCheckbox,\n StyledRadioButton,\n} from \"./Styles\";\nimport { OptionContent } from \"./OptionContent/OptionContent\";\n\ninterface ElementWithRef<T> extends ReactElement {\n ref?: Ref<T>;\n}\n\nexport interface ISelectProps\n extends Omit<IAutocompleteProps, \"handleChange\" | \"inputEl\"> {\n /** Menu width mode */\n mode?: \"normal\" | \"wider\" | \"tiny\";\n /** Set select target element */\n target?: ElementWithRef<Element>;\n /** Set Select position */\n position?: Placement;\n /** onChange callback */\n onChange?: (e: (string | number)[] | string | number) => void;\n /** Set action icon in select */\n actionIcon?: ReactElement;\n /** Set label for action icon */\n actionLabel?: string;\n /** Placeholder for Select input */\n placeholder?: string;\n /** Function that triggers when empty is clicked */\n emptyAction?: (e: string | undefined) => void;\n /** Removes input from Select */\n disableSearch?: boolean;\n /** Close menu on select */\n forceCloseMenu?: boolean;\n /** Set select classNames */\n selectClassName?: string;\n /** Callback called when the Select menu is opened */\n onSelectOpen?: () => void;\n /** Callback called when the Select menu is closed */\n onSelectClose?: () => void;\n}\n\nexport const Select: FC<ISelectProps> = ({\n type = \"single\",\n mode,\n target,\n options,\n selected = [],\n position = \"bottom-start\",\n onChange = () => null,\n actionIcon,\n actionLabel,\n placeholder,\n emptyAction = (): null => null,\n disableSearch = false,\n forceCloseMenu,\n selectClassName,\n keepSameOptionsOrder = false,\n onSelectOpen,\n onSelectClose,\n renderOption,\n handleDefaultOptionChange,\n preselectDefaultValue = type === \"single\",\n ...prop\n}) => {\n const [childNode, setChildNode] = useState<HTMLInputElement | null>();\n const elementRef = useRef<HTMLInputElement | null>(null);\n\n const handleRef = useForkRef(setChildNode, elementRef);\n\n const Tag = !target ? \"div\" : Menu;\n const formRef = useRef<HTMLFormElement | null>(null);\n\n const [open, setOpen] = useState(false);\n\n function isGroup(\n item: IOptionGroupProps | IOptionItemProps\n ): item is IOptionGroupProps {\n return (item as IOptionGroupProps).options !== undefined;\n }\n\n const selectedOptions = useMemo(\n () => (selected instanceof Array ? selected : [selected]),\n [selected]\n );\n\n const selectOptions = useMemo(() => {\n if (!options) {\n return [];\n }\n return options;\n }, [options]);\n\n const allOptionValues = useMemo(() => {\n return selectOptions.reduce(\n (\n acc: (string | number)[],\n option: IOptionGroupProps | IOptionItemProps\n ) => {\n if (!isGroup(option)) {\n return [...acc, option.id];\n }\n const allGroupOptions = option.options.map((option) => option.id);\n return [...acc, ...allGroupOptions];\n },\n []\n );\n }, [selectOptions]);\n\n const isAllOptionsChecked = useMemo(\n () => allOptionValues.every((option) => selectedOptions.includes(option)),\n [allOptionValues, selectedOptions]\n );\n\n useEffect(() => {\n open && childNode?.focus();\n }, [childNode, open]);\n\n const handleChange = useCallback(\n (selectedValue) => {\n if (forceCloseMenu) {\n setOpen(false);\n }\n onChange(selectedValue);\n },\n [onChange, forceCloseMenu]\n );\n\n const onClose = useCallback(() => {\n setOpen(false);\n if (onSelectClose) {\n onSelectClose();\n }\n }, [onSelectClose]);\n\n const onOpen = useCallback(() => {\n setOpen(true);\n if (onSelectOpen) {\n onSelectOpen();\n }\n }, [onSelectOpen]);\n\n const props = useMemo(() => {\n if (target) {\n return {\n menuClassName: classNames(\"c-select\", selectClassName),\n onClose,\n onOpen,\n target,\n mode,\n open,\n position,\n };\n }\n return { className: classNames(\"c-select\", selectClassName) };\n }, [target, selectClassName, onClose, onOpen, mode, open, position]);\n\n const handleEmptyAction = useCallback(\n (value) => {\n emptyAction(value);\n if (forceCloseMenu) {\n setOpen(false);\n }\n formRef.current?.reset();\n },\n [emptyAction, forceCloseMenu]\n );\n\n const handleDefaultOptionChangeCallback = useCallback(() => {\n if (type === \"multiple\") {\n if (selectedOptions.length === allOptionValues.length) {\n if (typeof handleDefaultOptionChange === \"function\") {\n handleDefaultOptionChange();\n } else {\n onChange([]);\n }\n } else {\n if (typeof handleDefaultOptionChange === \"function\") {\n handleDefaultOptionChange();\n } else {\n onChange(allOptionValues);\n }\n }\n } else {\n if (typeof handleDefaultOptionChange === \"function\") {\n handleDefaultOptionChange();\n } else {\n onChange(\"\");\n }\n }\n if (forceCloseMenu) {\n setOpen(false);\n }\n }, [\n onChange,\n type,\n forceCloseMenu,\n selectedOptions.length,\n allOptionValues,\n handleDefaultOptionChange,\n ]);\n\n const handleRenderOption = useCallback(\n (option, props) => {\n if (typeof renderOption === \"function\") {\n return renderOption(option, props);\n }\n return (\n <>\n <OptionContent\n imageUrl={option.image}\n color={option.color}\n textColor={option.textColor}\n name={option.name}\n additionalInfo={option.additionalInfo}\n />\n {option.id === null ? (\n type === \"multiple\" ? (\n <StyledCheckbox checked={isAllOptionsChecked} {...props} />\n ) : (\n <StyledRadioButton\n checked={selectedOptions.length < 1 || !selectedOptions[0]}\n {...props}\n />\n )\n ) : type === \"multiple\" ? (\n <StyledCheckbox {...props} />\n ) : (\n <StyledRadioButton {...props} />\n )}\n </>\n );\n },\n [isAllOptionsChecked, renderOption, selectedOptions, type]\n );\n\n return (\n <Tag {...props}>\n <div>\n {!disableSearch ? (\n <StyledSelectForm ref={formRef}>\n <StyledSelectInput\n ref={handleRef}\n autoFocus\n placeholder={placeholder}\n />\n {actionIcon && actionLabel && (\n <Tooltip\n popperTooltipStyle={{ zIndex: 1301 }}\n title={actionLabel}\n >\n <div>{actionIcon}</div>\n </Tooltip>\n )}\n {actionIcon && !actionLabel && actionIcon}\n </StyledSelectForm>\n ) : null}\n <Autocomplete\n {...prop}\n inputEl={childNode}\n handleEmptyAction={handleEmptyAction}\n selected={selected}\n handleChange={handleChange}\n renderOption={handleRenderOption}\n options={options}\n handleDefaultOptionChange={handleDefaultOptionChangeCallback}\n type={type}\n preselectDefaultValue={preselectDefaultValue}\n keepSameOptionsOrder={keepSameOptionsOrder}\n />\n </div>\n </Tag>\n );\n};\n\nSelect.displayName = \"Select\";\n"],"file":"Select.js"}
1
+ {"version":3,"sources":["../../../../src/components/Select/Select.tsx"],"names":["React","useCallback","useState","useMemo","useEffect","useRef","Autocomplete","isOptionGroup","Tooltip","Menu","classNames","useForkRef","StyledSelectForm","StyledSelectInput","StyledCheckbox","StyledRadioButton","OptionContent","Select","type","mode","target","options","selected","position","onChange","actionIcon","actionLabel","placeholder","emptyAction","disableSearch","forceCloseMenu","selectClassName","keepSameOptionsOrder","onSelectOpen","onSelectClose","renderOption","handleDefaultOptionChange","preselectDefaultValue","prop","childNode","setChildNode","elementRef","handleRef","Tag","formRef","open","setOpen","selectedOptions","Array","selectOptions","allOptionValues","reduce","acc","option","id","allGroupOptions","map","isAllOptionsChecked","every","includes","focus","handleChange","selectedValue","onClose","onOpen","props","menuClassName","className","handleEmptyAction","value","current","reset","handleDefaultOptionChangeCallback","length","handleRenderOption","image","color","textColor","name","additionalInfo","zIndex","displayName"],"mappings":"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","sourcesContent":["import React, {\n FC,\n useCallback,\n useState,\n ReactElement,\n useMemo,\n useEffect,\n useRef,\n Ref,\n} from \"react\";\nimport { Autocomplete, isOptionGroup } from \"../Autocomplete\";\nimport { Tooltip } from \"../Tooltip\";\nimport { Menu } from \"../Menu/Menu\";\nimport { IOptionItemProps } from \"../Select/Option\";\nimport { IOptionGroupProps } from \"../Select/OptionGroup\";\nimport classNames from \"classnames\";\nimport { Placement } from \"@popperjs/core\";\nimport { IAutocompleteProps } from \"../Autocomplete/Autocomplete\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport {\n StyledSelectForm,\n StyledSelectInput,\n StyledCheckbox,\n StyledRadioButton,\n} from \"./Styles\";\nimport { OptionContent } from \"./OptionContent/OptionContent\";\n\ninterface ElementWithRef<T> extends ReactElement {\n ref?: Ref<T>;\n}\n\nexport interface ISelectProps\n extends Omit<IAutocompleteProps, \"handleChange\" | \"inputEl\"> {\n /** Menu width mode */\n mode?: \"normal\" | \"wider\" | \"tiny\";\n /** Set select target element */\n target?: ElementWithRef<Element>;\n /** Set Select position */\n position?: Placement;\n /** onChange callback */\n onChange?: (e: (string | number)[] | string | number) => void;\n /** Set action icon in select */\n actionIcon?: ReactElement;\n /** Set label for action icon */\n actionLabel?: string;\n /** Placeholder for Select input */\n placeholder?: string;\n /** Function that triggers when empty is clicked */\n emptyAction?: (e: string | undefined) => void;\n /** Removes input from Select */\n disableSearch?: boolean;\n /** Close menu on select */\n forceCloseMenu?: boolean;\n /** Set select classNames */\n selectClassName?: string;\n /** Callback called when the Select menu is opened */\n onSelectOpen?: () => void;\n /** Callback called when the Select menu is closed */\n onSelectClose?: () => void;\n}\n\nexport const Select: FC<ISelectProps> = ({\n type = \"single\",\n mode,\n target,\n options,\n selected = [],\n position = \"bottom-start\",\n onChange = () => null,\n actionIcon,\n actionLabel,\n placeholder,\n emptyAction = (): null => null,\n disableSearch = false,\n forceCloseMenu,\n selectClassName,\n keepSameOptionsOrder = false,\n onSelectOpen,\n onSelectClose,\n renderOption,\n handleDefaultOptionChange,\n preselectDefaultValue = type === \"single\",\n ...prop\n}) => {\n const [childNode, setChildNode] = useState<HTMLInputElement | null>();\n const elementRef = useRef<HTMLInputElement | null>(null);\n\n const handleRef = useForkRef(setChildNode, elementRef);\n\n const Tag = !target ? \"div\" : Menu;\n const formRef = useRef<HTMLFormElement | null>(null);\n\n const [open, setOpen] = useState(false);\n\n const selectedOptions = useMemo(\n () => (selected instanceof Array ? selected : [selected]),\n [selected]\n );\n\n const selectOptions = useMemo(() => {\n if (!options) {\n return [];\n }\n return options;\n }, [options]);\n\n const allOptionValues = useMemo(() => {\n return selectOptions.reduce(\n (\n acc: (string | number)[],\n option: IOptionGroupProps | IOptionItemProps\n ) => {\n if (!isOptionGroup(option)) {\n return [...acc, option.id];\n }\n const allGroupOptions = option.options.map((option) => option.id);\n return [...acc, ...allGroupOptions];\n },\n []\n );\n }, [selectOptions]);\n\n const isAllOptionsChecked = useMemo(\n () => allOptionValues.every((option) => selectedOptions.includes(option)),\n [allOptionValues, selectedOptions]\n );\n\n useEffect(() => {\n open && childNode?.focus();\n }, [childNode, open]);\n\n const handleChange = useCallback(\n (selectedValue) => {\n if (forceCloseMenu) {\n setOpen(false);\n }\n onChange(selectedValue);\n },\n [onChange, forceCloseMenu]\n );\n\n const onClose = useCallback(() => {\n setOpen(false);\n if (onSelectClose) {\n onSelectClose();\n }\n }, [onSelectClose]);\n\n const onOpen = useCallback(() => {\n setOpen(true);\n if (onSelectOpen) {\n onSelectOpen();\n }\n }, [onSelectOpen]);\n\n const props = useMemo(() => {\n if (target) {\n return {\n menuClassName: classNames(\"c-select\", selectClassName),\n onClose,\n onOpen,\n target,\n mode,\n open,\n position,\n };\n }\n return { className: classNames(\"c-select\", selectClassName) };\n }, [target, selectClassName, onClose, onOpen, mode, open, position]);\n\n const handleEmptyAction = useCallback(\n (value) => {\n emptyAction(value);\n if (forceCloseMenu) {\n setOpen(false);\n }\n formRef.current?.reset();\n },\n [emptyAction, forceCloseMenu]\n );\n\n const handleDefaultOptionChangeCallback = useCallback(() => {\n if (type === \"multiple\") {\n if (selectedOptions.length === allOptionValues.length) {\n if (typeof handleDefaultOptionChange === \"function\") {\n handleDefaultOptionChange();\n } else {\n onChange([]);\n }\n } else {\n if (typeof handleDefaultOptionChange === \"function\") {\n handleDefaultOptionChange();\n } else {\n onChange(allOptionValues);\n }\n }\n } else {\n if (typeof handleDefaultOptionChange === \"function\") {\n handleDefaultOptionChange();\n } else {\n onChange(\"\");\n }\n }\n if (forceCloseMenu) {\n setOpen(false);\n }\n }, [\n onChange,\n type,\n forceCloseMenu,\n selectedOptions.length,\n allOptionValues,\n handleDefaultOptionChange,\n ]);\n\n const handleRenderOption = useCallback(\n (option, props) => {\n if (typeof renderOption === \"function\") {\n return renderOption(option, props);\n }\n return (\n <>\n <OptionContent\n imageUrl={option.image}\n color={option.color}\n textColor={option.textColor}\n name={option.name}\n additionalInfo={option.additionalInfo}\n />\n {option.id === null ? (\n type === \"multiple\" ? (\n <StyledCheckbox checked={isAllOptionsChecked} {...props} />\n ) : (\n <StyledRadioButton\n checked={selectedOptions.length < 1 || !selectedOptions[0]}\n {...props}\n />\n )\n ) : type === \"multiple\" ? (\n <StyledCheckbox {...props} />\n ) : (\n <StyledRadioButton {...props} />\n )}\n </>\n );\n },\n [isAllOptionsChecked, renderOption, selectedOptions, type]\n );\n\n return (\n <Tag {...props}>\n <div>\n {!disableSearch ? (\n <StyledSelectForm ref={formRef}>\n <StyledSelectInput\n ref={handleRef}\n autoFocus\n placeholder={placeholder}\n />\n {actionIcon && actionLabel && (\n <Tooltip\n popperTooltipStyle={{ zIndex: 1301 }}\n title={actionLabel}\n >\n <div>{actionIcon}</div>\n </Tooltip>\n )}\n {actionIcon && !actionLabel && actionIcon}\n </StyledSelectForm>\n ) : null}\n <Autocomplete\n {...prop}\n inputEl={childNode}\n handleEmptyAction={handleEmptyAction}\n selected={selected}\n handleChange={handleChange}\n renderOption={handleRenderOption}\n options={options}\n handleDefaultOptionChange={handleDefaultOptionChangeCallback}\n type={type}\n preselectDefaultValue={preselectDefaultValue}\n keepSameOptionsOrder={keepSameOptionsOrder}\n />\n </div>\n </Tag>\n );\n};\n\nSelect.displayName = \"Select\";\n"],"file":"Select.js"}
@@ -0,0 +1,3 @@
1
+ import { RefObject } from "react";
2
+ export declare function useOnClickOutside<T extends HTMLElement>(ref: RefObject<T>, handler: (e: MouseEvent) => void): void;
3
+ //# sourceMappingURL=useOnClickOutside.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useOnClickOutside.d.ts","sourceRoot":"","sources":["../../../src/hooks/useOnClickOutside.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAE7C,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,WAAW,EACrD,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,EACjB,OAAO,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,QA0BjC"}
@@ -0,0 +1,27 @@
1
+ import { useEffect } from "react";
2
+ export function useOnClickOutside(ref, handler) {
3
+ useEffect(function () {
4
+ var listener = function listener(event) {
5
+ // Do nothing if clicking ref's element or descendent elements
6
+ if (!ref.current || ref.current.contains(event.target)) {
7
+ return;
8
+ }
9
+
10
+ handler(event);
11
+ };
12
+
13
+ document.addEventListener("mousedown", listener);
14
+ document.addEventListener("touchstart", listener);
15
+ return function () {
16
+ document.removeEventListener("mousedown", listener);
17
+ document.removeEventListener("touchstart", listener);
18
+ };
19
+ }, // Add ref and handler to effect dependencies
20
+ // It's worth noting that because passed in handler is a new ...
21
+ // ... function on every render that will cause this effect ...
22
+ // ... callback/cleanup to run every render. It's not a big deal ...
23
+ // ... but to optimize you can wrap handler in useCallback before ...
24
+ // ... passing it into this hook.
25
+ [ref, handler]);
26
+ }
27
+ //# sourceMappingURL=useOnClickOutside.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/hooks/useOnClickOutside.tsx"],"names":["useEffect","useOnClickOutside","ref","handler","listener","event","current","contains","target","document","addEventListener","removeEventListener"],"mappings":"AAAA,SAAoBA,SAApB,QAAqC,OAArC;AAEA,OAAO,SAASC,iBAAT,CACLC,GADK,EAELC,OAFK,EAGL;AACAH,EAAAA,SAAS,CACP,YAAM;AACJ,QAAMI,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAAW;AAC1B;AACA,UAAI,CAACH,GAAG,CAACI,OAAL,IAAgBJ,GAAG,CAACI,OAAJ,CAAYC,QAAZ,CAAqBF,KAAK,CAACG,MAA3B,CAApB,EAAwD;AACtD;AACD;;AACDL,MAAAA,OAAO,CAACE,KAAD,CAAP;AACD,KAND;;AAOAI,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,WAA1B,EAAuCN,QAAvC;AACAK,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,YAA1B,EAAwCN,QAAxC;AACA,WAAO,YAAM;AACXK,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,WAA7B,EAA0CP,QAA1C;AACAK,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,YAA7B,EAA2CP,QAA3C;AACD,KAHD;AAID,GAfM,EAgBP;AACA;AACA;AACA;AACA;AACA;AACA,GAACF,GAAD,EAAMC,OAAN,CAtBO,CAAT;AAwBD","sourcesContent":["import { RefObject, useEffect } from \"react\";\n\nexport function useOnClickOutside<T extends HTMLElement>(\n ref: RefObject<T>,\n handler: (e: MouseEvent) => void\n) {\n useEffect(\n () => {\n const listener = (event) => {\n // Do nothing if clicking ref's element or descendent elements\n if (!ref.current || ref.current.contains(event.target)) {\n return;\n }\n handler(event);\n };\n document.addEventListener(\"mousedown\", listener);\n document.addEventListener(\"touchstart\", listener);\n return () => {\n document.removeEventListener(\"mousedown\", listener);\n document.removeEventListener(\"touchstart\", listener);\n };\n },\n // Add ref and handler to effect dependencies\n // It's worth noting that because passed in handler is a new ...\n // ... function on every render that will cause this effect ...\n // ... callback/cleanup to run every render. It's not a big deal ...\n // ... but to optimize you can wrap handler in useCallback before ...\n // ... passing it into this hook.\n [ref, handler]\n );\n}\n"],"file":"useOnClickOutside.js"}