@onewelcome/react-lib-components 11.1.0-delta → 12.1.0-alpha

package/dist/components/Form/Select/SingleSelect/useSearch.es.js

@@ -0,0 +1,83 @@
+import React, { useState, useRef, useEffect } from "react";
+import { Input } from "../../Input/Input.es.js";
+import { filterProps } from "../../../../util/helper.es.js";
+const useSearch = ({
+  search,
+  optionsCount,
+  searchInputClassName,
+  expanded,
+  setFocusedSelectItem
+}) => {
+  var _a;
+  const [filter, setFilter] = useState("");
+  const [isSearching, setIsSearching] = useState(false);
+  const DEFAULT_RENDER_THRESHOLD = 10;
+  const searchInputRef = useRef(null);
+  const threshold = (search == null ? void 0 : search.renderThreshold) ?? DEFAULT_RENDER_THRESHOLD;
+  const hasEnoughChildren = optionsCount >= threshold;
+  const filterResults = (event) => {
+    setFilter(event.currentTarget.value);
+  };
+  const shouldRenderSearch = () => {
+    if (search == null ? void 0 : search.enabled) {
+      return hasEnoughChildren;
+    }
+    if (search) {
+      return search.enabled;
+    }
+    return optionsCount > DEFAULT_RENDER_THRESHOLD;
+  };
+  const renderSearch = () => {
+    var _a2, _b;
+    const filteredProps = filterProps((search == null ? void 0 : search.searchInputProps) ?? {}, /^reset$/, false);
+    return /* @__PURE__ */ React.createElement(
+      Input,
+      {
+        ...filteredProps,
+        ref: searchInputRef,
+        onFocus: () => setIsSearching(true),
+        onBlur: () => setIsSearching(false),
+        onChange: filterResults,
+        className: searchInputClassName,
+        wrapperProps: {
+          className: (_b = (_a2 = search == null ? void 0 : search.searchInputProps) == null ? void 0 : _a2.wrapperProps) == null ? void 0 : _b.className
+        },
+        style: {
+          display: expanded ? "block" : "none"
+        },
+        type: "text",
+        name: "search-option",
+        placeholder: (search == null ? void 0 : search.searchPlaceholder) ? search == null ? void 0 : search.searchPlaceholder : "Search item"
+      }
+    );
+  };
+  const resetSearchState = () => {
+    setFilter("");
+    setIsSearching(false);
+    setFocusedSelectItem(-1);
+  };
+  const visible = shouldRenderSearch();
+  useEffect(() => {
+    var _a2;
+    ((_a2 = search == null ? void 0 : search.searchInputProps) == null ? void 0 : _a2.reset) && resetSearchState();
+  }, [(_a = search == null ? void 0 : search.searchInputProps) == null ? void 0 : _a.reset]);
+  useEffect(() => {
+    const searchDeactivated = !visible && !isSearching;
+    if (searchDeactivated) {
+      resetSearchState();
+    }
+  }, [isSearching, visible]);
+  return {
+    renderSearch,
+    setIsSearching,
+    searchVisible: visible,
+    searchThreshold: threshold,
+    searchInputRef,
+    filter,
+    isSearching
+  };
+};
+export {
+  useSearch
+};
+//# sourceMappingURL=useSearch.es.js.map

package/dist/components/Form/Select/SingleSelect/useSearch.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSearch.es.js","sources":["../../../../../src/components/Form/Select/SingleSelect/useSearch.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { useEffect, useRef, useState } from \"react\";\nimport { SearchProps } from \"../Select.interfaces\";\nimport { Input } from \"../../Input/Input\";\nimport { filterProps } from \"../../../../util/helper\";\n\ninterface Props {\n  search?: SearchProps;\n  optionsCount: number;\n  searchInputClassName: string;\n  expanded: boolean;\n  setFocusedSelectItem: (idx: number) => void;\n}\n\n/** @scope .*/\nexport const useSearch = ({\n  search,\n  optionsCount,\n  searchInputClassName,\n  expanded,\n  setFocusedSelectItem\n}: Props) => {\n  const [filter, setFilter] = useState(\"\");\n  const [isSearching, setIsSearching] = useState(false);\n\n  const DEFAULT_RENDER_THRESHOLD = 10;\n\n  const searchInputRef = useRef<HTMLInputElement>(null);\n\n  const threshold = search?.renderThreshold ?? DEFAULT_RENDER_THRESHOLD;\n  const hasEnoughChildren = optionsCount >= threshold;\n\n  const filterResults = (event: React.ChangeEvent<HTMLInputElement>) => {\n    setFilter(event.currentTarget.value);\n  };\n\n  const shouldRenderSearch = () => {\n    if (search?.enabled) {\n      return hasEnoughChildren;\n    }\n\n    if (search) {\n      return search.enabled as boolean;\n    }\n\n    return optionsCount > DEFAULT_RENDER_THRESHOLD;\n  };\n\n  const renderSearch = () => {\n    const filteredProps = filterProps(search?.searchInputProps ?? {}, /^reset$/, false);\n\n    return (\n      <Input\n        {...filteredProps}\n        ref={searchInputRef}\n        onFocus={() => setIsSearching(true)}\n        onBlur={() => setIsSearching(false)}\n        onChange={filterResults}\n        className={searchInputClassName}\n        wrapperProps={{\n          className: search?.searchInputProps?.wrapperProps?.className\n        }}\n        style={{\n          display: expanded ? \"block\" : \"none\"\n        }}\n        type=\"text\"\n        name=\"search-option\"\n        placeholder={search?.searchPlaceholder ? search?.searchPlaceholder : \"Search item\"}\n      />\n    );\n  };\n\n  const resetSearchState = () => {\n    setFilter(\"\");\n    setIsSearching(false);\n    setFocusedSelectItem(-1);\n  };\n\n  const visible = shouldRenderSearch();\n\n  useEffect(() => {\n    search?.searchInputProps?.reset && resetSearchState();\n  }, [search?.searchInputProps?.reset]);\n\n  useEffect(() => {\n    const searchDeactivated =\n      !visible &&\n      !isSearching; /*solves issue in MultiSelect when we filtered result and selected result causes list to be shorter than threshold so still we have a filter applied but can't change it due to `visible` variable has false  */\n    if (searchDeactivated) {\n      resetSearchState();\n    }\n  }, [isSearching, visible]);\n\n  return {\n    renderSearch,\n    setIsSearching,\n    searchVisible: visible,\n    searchThreshold: threshold,\n    searchInputRef,\n    filter,\n    isSearching\n  };\n};\n"],"names":["_a"],"mappings":";;;AA8BO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAa;;AACX,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,EAAE;AACvC,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,KAAK;AAEpD,QAAM,2BAA2B;AAE3B,QAAA,iBAAiB,OAAyB,IAAI;AAE9C,QAAA,aAAY,iCAAQ,oBAAmB;AAC7C,QAAM,oBAAoB,gBAAgB;AAEpC,QAAA,gBAAgB,CAAC,UAA+C;AAC1D,cAAA,MAAM,cAAc,KAAK;AAAA,EACrC;AAEA,QAAM,qBAAqB,MAAM;AAC/B,QAAI,iCAAQ,SAAS;AACZ,aAAA;AAAA,IAAA;AAGT,QAAI,QAAQ;AACV,aAAO,OAAO;AAAA,IAAA;AAGhB,WAAO,eAAe;AAAA,EACxB;AAEA,QAAM,eAAe,MAAM;;AACzB,UAAM,gBAAgB,aAAY,iCAAQ,qBAAoB,CAAC,GAAG,WAAW,KAAK;AAGhF,WAAA,sBAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ,KAAK;AAAA,QACL,SAAS,MAAM,eAAe,IAAI;AAAA,QAClC,QAAQ,MAAM,eAAe,KAAK;AAAA,QAClC,UAAU;AAAA,QACV,WAAW;AAAA,QACX,cAAc;AAAA,UACZ,YAAW,MAAAA,MAAA,iCAAQ,qBAAR,gBAAAA,IAA0B,iBAA1B,mBAAwC;AAAA,QACrD;AAAA,QACA,OAAO;AAAA,UACL,SAAS,WAAW,UAAU;AAAA,QAChC;AAAA,QACA,MAAK;AAAA,QACL,MAAK;AAAA,QACL,cAAa,iCAAQ,qBAAoB,iCAAQ,oBAAoB;AAAA,MAAA;AAAA,IACvE;AAAA,EAEJ;AAEA,QAAM,mBAAmB,MAAM;AAC7B,cAAU,EAAE;AACZ,mBAAe,KAAK;AACpB,yBAAqB,EAAE;AAAA,EACzB;AAEA,QAAM,UAAU,mBAAmB;AAEnC,YAAU,MAAM;;AACN,MAAAA,MAAA,iCAAA,qBAAA,gBAAAA,IAAkB,UAAS,iBAAiB;AAAA,EACnD,GAAA,EAAC,sCAAQ,qBAAR,mBAA0B,KAAK,CAAC;AAEpC,YAAU,MAAM;AACR,UAAA,oBACJ,CAAC,WACD,CAAC;AACH,QAAI,mBAAmB;AACJ,uBAAA;AAAA,IAAA;AAAA,EACnB,GACC,CAAC,aAAa,OAAO,CAAC;AAElB,SAAA;AAAA,IACL;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;"}

package/dist/components/Form/Select/useAddNewBtn.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./useAddNewBtn.module.scss.cjs.js"),t=require("react");exports.useAddNewBtn=({id:n,addNew:l,filter:s,focusedSelectItem:o,optionsCount:r,searchInputRef:u,shouldClick:a,onClickCallback:d})=>{var c,i;const f=t.useRef(null),p=(null==l?void 0:l.label)??"Create new",b=o===r,m=!u.current,N="string"==typeof s&&!!s.trim()&&!!u.current,w=l&&(m||N||l.alwaysEnabled),C=[e.default["action-button"]];return(null==(c=null==l?void 0:l.btnProps)?void 0:c.className)&&C.push(null==(i=null==l?void 0:l.btnProps)?void 0:i.className),b&&C.push(e.default.focus),t.useEffect((()=>{f.current&&b&&a&&f.current.click()}),[f.current,b,a]),{addNewBtnOptionsContainerClassName:l?e.default["has-sibling"]:"",renderAddNew:()=>w&&t.createElement("button",{"data-testid":"select-action-button",...l.btnProps,ref:f,type:"button",className:C.join(" "),onClick:()=>{l.onAddNew(s),null==d||d()},id:n},!s&&p,s&&t.createElement("span",{style:{fontWeight:"700"}},`"${s}"`),s&&` (${p.toLowerCase()})`),addBtnRef:f}};
+//# sourceMappingURL=useAddNewBtn.cjs.js.map

package/dist/components/Form/Select/useAddNewBtn.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAddNewBtn.cjs.js","sources":["../../../../src/components/Form/Select/useAddNewBtn.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport classes from \"./useAddNewBtn.module.scss\";\n\nimport React, { RefObject, useEffect, useRef } from \"react\";\nimport { AddNewProps } from \"./Select.interfaces\";\n\ninterface Props {\n  id?: string;\n  addNew?: AddNewProps;\n  filter: string;\n  focusedSelectItem: number;\n  optionsCount: number;\n  searchInputRef: RefObject<HTMLInputElement>;\n  shouldClick?: boolean;\n  onClickCallback?: () => void;\n}\n\n/** @scope .*/\nexport const useAddNewBtn = ({\n  id,\n  addNew,\n  filter,\n  focusedSelectItem,\n  optionsCount,\n  searchInputRef,\n  shouldClick,\n  onClickCallback\n}: Props) => {\n  const addBtnRef = useRef<HTMLButtonElement>(null);\n  const addNewLabel = addNew?.label ?? \"Create new\";\n  const isProgrammaticallyFocused = focusedSelectItem === optionsCount;\n  const isSearchDisabled = !searchInputRef.current;\n  const hasSearchQuery = typeof filter === \"string\" && !!filter.trim() && !!searchInputRef.current;\n  const shouldRender = addNew && (isSearchDisabled || hasSearchQuery || addNew.alwaysEnabled);\n\n  const additionalClasses = [classes[\"action-button\"]];\n  addNew?.btnProps?.className && additionalClasses.push(addNew?.btnProps?.className);\n  isProgrammaticallyFocused && additionalClasses.push(classes[\"focus\"]);\n\n  useEffect(() => {\n    const addBtnClicked = addBtnRef.current && isProgrammaticallyFocused && shouldClick;\n    if (addBtnClicked) {\n      addBtnRef.current.click();\n    }\n  }, [addBtnRef.current, isProgrammaticallyFocused, shouldClick]);\n\n  const renderAddNew = () =>\n    shouldRender && (\n      <button\n        data-testid=\"select-action-button\"\n        {...addNew.btnProps}\n        ref={addBtnRef}\n        type=\"button\"\n        className={additionalClasses.join(\" \")}\n        onClick={() => {\n          addNew.onAddNew(filter);\n          onClickCallback?.();\n        }}\n        id={id}\n      >\n        {!filter && addNewLabel}\n        {filter && <span style={{ fontWeight: \"700\" }}>{`\"${filter}\"`}</span>}\n        {filter && ` (${addNewLabel.toLowerCase()})`}\n      </button>\n    );\n\n  const addNewBtnOptionsContainerClassName = addNew ? classes[\"has-sibling\"] : \"\";\n\n  return {\n    addNewBtnOptionsContainerClassName,\n    renderAddNew,\n    addBtnRef\n  };\n};\n"],"names":["id","addNew","filter","focusedSelectItem","optionsCount","searchInputRef","shouldClick","onClickCallback","addBtnRef","useRef","addNewLabel","label","isProgrammaticallyFocused","isSearchDisabled","current","hasSearchQuery","trim","shouldRender","alwaysEnabled","additionalClasses","classes","_a","btnProps","className","push","_b","default","useEffect","click","addNewBtnOptionsContainerClassName","renderAddNew","React","createElement","ref","type","join","onClick","onAddNew","style","fontWeight","toLowerCase"],"mappings":"6KAiC4B,EAC1BA,KACAC,SACAC,SACAC,oBACAC,eACAC,iBACAC,cACAC,8BAEM,MAAAC,EAAYC,SAA0B,MACtCC,SAAcT,WAAQU,QAAS,aAC/BC,EAA4BT,IAAsBC,EAClDS,GAAoBR,EAAeS,QACnCC,EAAmC,iBAAXb,KAAyBA,EAAOc,UAAYX,EAAeS,QACnFG,EAAehB,IAAWY,GAAoBE,GAAkBd,EAAOiB,eAEvEC,EAAoB,CAACC,UAAQ,kBAiC5B,OAhCP,OAAQC,EAAA,MAAApB,OAAA,EAAAA,EAAAqB,mBAAUC,YAAaJ,EAAkBK,KAAK,OAAAC,EAAQ,MAAAxB,OAAA,EAAAA,EAAAqB,mBAAUC,WACxEX,GAA6BO,EAAkBK,KAAKJ,EAAQM,QAAO,OAEnEC,EAAAA,WAAU,KACcnB,EAAUM,SAAWF,GAA6BN,GAEtEE,EAAUM,QAAQc,OAAM,GAEzB,CAACpB,EAAUM,QAASF,EAA2BN,IAwB3C,CACLuB,mCAHyC5B,EAASmB,UAAQ,eAAiB,GAI3EU,aAxBmB,IACnBb,GACEc,EAAAC,cAAC,SAAA,CACC,cAAY,0BACR/B,EAAOqB,SACXW,IAAKzB,EACL0B,KAAK,SACLX,UAAWJ,EAAkBgB,KAAK,KAClCC,QAAS,KACPnC,EAAOoC,SAASnC,GACE,MAAAK,GAAAA,GAAA,EAEpBP,OAEEE,GAAUQ,EACXR,GAAW6B,EAAAC,cAAA,OAAA,CAAKM,MAAO,CAAEC,WAAY,QAAU,IAAIrC,MACnDA,GAAU,KAAKQ,EAAY8B,kBAShChC,YACF"}

package/dist/components/Form/Select/useAddNewBtn.es.js

@@ -0,0 +1,57 @@
+import classes from "./useAddNewBtn.module.scss.es.js";
+import React, { useRef, useEffect } from "react";
+const useAddNewBtn = ({
+  id,
+  addNew,
+  filter,
+  focusedSelectItem,
+  optionsCount,
+  searchInputRef,
+  shouldClick,
+  onClickCallback
+}) => {
+  var _a, _b;
+  const addBtnRef = useRef(null);
+  const addNewLabel = (addNew == null ? void 0 : addNew.label) ?? "Create new";
+  const isProgrammaticallyFocused = focusedSelectItem === optionsCount;
+  const isSearchDisabled = !searchInputRef.current;
+  const hasSearchQuery = typeof filter === "string" && !!filter.trim() && !!searchInputRef.current;
+  const shouldRender = addNew && (isSearchDisabled || hasSearchQuery || addNew.alwaysEnabled);
+  const additionalClasses = [classes["action-button"]];
+  ((_a = addNew == null ? void 0 : addNew.btnProps) == null ? void 0 : _a.className) && additionalClasses.push((_b = addNew == null ? void 0 : addNew.btnProps) == null ? void 0 : _b.className);
+  isProgrammaticallyFocused && additionalClasses.push(classes["focus"]);
+  useEffect(() => {
+    const addBtnClicked = addBtnRef.current && isProgrammaticallyFocused && shouldClick;
+    if (addBtnClicked) {
+      addBtnRef.current.click();
+    }
+  }, [addBtnRef.current, isProgrammaticallyFocused, shouldClick]);
+  const renderAddNew = () => shouldRender && /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      "data-testid": "select-action-button",
+      ...addNew.btnProps,
+      ref: addBtnRef,
+      type: "button",
+      className: additionalClasses.join(" "),
+      onClick: () => {
+        addNew.onAddNew(filter);
+        onClickCallback == null ? void 0 : onClickCallback();
+      },
+      id
+    },
+    !filter && addNewLabel,
+    filter && /* @__PURE__ */ React.createElement("span", { style: { fontWeight: "700" } }, `"${filter}"`),
+    filter && ` (${addNewLabel.toLowerCase()})`
+  );
+  const addNewBtnOptionsContainerClassName = addNew ? classes["has-sibling"] : "";
+  return {
+    addNewBtnOptionsContainerClassName,
+    renderAddNew,
+    addBtnRef
+  };
+};
+export {
+  useAddNewBtn
+};
+//# sourceMappingURL=useAddNewBtn.es.js.map

package/dist/components/Form/Select/useAddNewBtn.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAddNewBtn.es.js","sources":["../../../../src/components/Form/Select/useAddNewBtn.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport classes from \"./useAddNewBtn.module.scss\";\n\nimport React, { RefObject, useEffect, useRef } from \"react\";\nimport { AddNewProps } from \"./Select.interfaces\";\n\ninterface Props {\n  id?: string;\n  addNew?: AddNewProps;\n  filter: string;\n  focusedSelectItem: number;\n  optionsCount: number;\n  searchInputRef: RefObject<HTMLInputElement>;\n  shouldClick?: boolean;\n  onClickCallback?: () => void;\n}\n\n/** @scope .*/\nexport const useAddNewBtn = ({\n  id,\n  addNew,\n  filter,\n  focusedSelectItem,\n  optionsCount,\n  searchInputRef,\n  shouldClick,\n  onClickCallback\n}: Props) => {\n  const addBtnRef = useRef<HTMLButtonElement>(null);\n  const addNewLabel = addNew?.label ?? \"Create new\";\n  const isProgrammaticallyFocused = focusedSelectItem === optionsCount;\n  const isSearchDisabled = !searchInputRef.current;\n  const hasSearchQuery = typeof filter === \"string\" && !!filter.trim() && !!searchInputRef.current;\n  const shouldRender = addNew && (isSearchDisabled || hasSearchQuery || addNew.alwaysEnabled);\n\n  const additionalClasses = [classes[\"action-button\"]];\n  addNew?.btnProps?.className && additionalClasses.push(addNew?.btnProps?.className);\n  isProgrammaticallyFocused && additionalClasses.push(classes[\"focus\"]);\n\n  useEffect(() => {\n    const addBtnClicked = addBtnRef.current && isProgrammaticallyFocused && shouldClick;\n    if (addBtnClicked) {\n      addBtnRef.current.click();\n    }\n  }, [addBtnRef.current, isProgrammaticallyFocused, shouldClick]);\n\n  const renderAddNew = () =>\n    shouldRender && (\n      <button\n        data-testid=\"select-action-button\"\n        {...addNew.btnProps}\n        ref={addBtnRef}\n        type=\"button\"\n        className={additionalClasses.join(\" \")}\n        onClick={() => {\n          addNew.onAddNew(filter);\n          onClickCallback?.();\n        }}\n        id={id}\n      >\n        {!filter && addNewLabel}\n        {filter && <span style={{ fontWeight: \"700\" }}>{`\"${filter}\"`}</span>}\n        {filter && ` (${addNewLabel.toLowerCase()})`}\n      </button>\n    );\n\n  const addNewBtnOptionsContainerClassName = addNew ? classes[\"has-sibling\"] : \"\";\n\n  return {\n    addNewBtnOptionsContainerClassName,\n    renderAddNew,\n    addBtnRef\n  };\n};\n"],"names":[],"mappings":";;AAiCO,MAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAa;;AACL,QAAA,YAAY,OAA0B,IAAI;AAC1C,QAAA,eAAc,iCAAQ,UAAS;AACrC,QAAM,4BAA4B,sBAAsB;AAClD,QAAA,mBAAmB,CAAC,eAAe;AACnC,QAAA,iBAAiB,OAAO,WAAW,YAAY,CAAC,CAAC,OAAO,KAAK,KAAK,CAAC,CAAC,eAAe;AACzF,QAAM,eAAe,WAAW,oBAAoB,kBAAkB,OAAO;AAE7E,QAAM,oBAAoB,CAAC,QAAQ,eAAe,CAAC;AACnD,0CAAQ,aAAR,mBAAkB,cAAa,kBAAkB,MAAK,sCAAQ,aAAR,mBAAkB,SAAS;AACjF,+BAA6B,kBAAkB,KAAK,QAAQ,OAAO,CAAC;AAEpE,YAAU,MAAM;AACR,UAAA,gBAAgB,UAAU,WAAW,6BAA6B;AACxE,QAAI,eAAe;AACjB,gBAAU,QAAQ,MAAM;AAAA,IAAA;AAAA,KAEzB,CAAC,UAAU,SAAS,2BAA2B,WAAW,CAAC;AAExD,QAAA,eAAe,MACnB,gBACE,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,eAAY;AAAA,MACX,GAAG,OAAO;AAAA,MACX,KAAK;AAAA,MACL,MAAK;AAAA,MACL,WAAW,kBAAkB,KAAK,GAAG;AAAA,MACrC,SAAS,MAAM;AACb,eAAO,SAAS,MAAM;AACJ;AAAA,MACpB;AAAA,MACA;AAAA,IAAA;AAAA,IAEC,CAAC,UAAU;AAAA,IACX,UAAW,sBAAA,cAAA,QAAA,EAAK,OAAO,EAAE,YAAY,MAAM,EAAA,GAAI,IAAI,MAAM,GAAI;AAAA,IAC7D,UAAU,KAAK,YAAY,YAAa,CAAA;AAAA,EAC3C;AAGJ,QAAM,qCAAqC,SAAS,QAAQ,aAAa,IAAI;AAEtE,SAAA;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;"}

package/dist/components/Form/Select/useAddNewBtn.module.scss.cjs.js

@@ -0,0 +1,3 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.useAddNewBtn_sr-only_7l1Pc{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.useAddNewBtn_hidden_7l1Pc{display:none}.useAddNewBtn_slide-in_7l1Pc{animation:useAddNewBtn_slide-in_7l1Pc .5s forwards}@media (prefers-reduced-motion: reduce){.useAddNewBtn_slide-in_7l1Pc{animation-duration:.1ms}}.useAddNewBtn_slide-out_7l1Pc{animation:useAddNewBtn_slide-out_7l1Pc .5s forwards}@media (prefers-reduced-motion: reduce){.useAddNewBtn_slide-out_7l1Pc{animation-duration:.1ms}}@keyframes useAddNewBtn_slide-in_7l1Pc{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes useAddNewBtn_slide-out_7l1Pc{0%{transform:translateY(0)}to{transform:translateY(100vh)}}/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */ul.useAddNewBtn_has-sibling_7l1Pc{padding-bottom:2px}.useAddNewBtn_action-button_7l1Pc{position:relative;border:none;border-top:1px solid var(--color-blue-grey50);width:100%;height:calc(2.5 * var(--font-size));padding:.625rem .75rem;margin:0 0 .25rem;background-color:var(--light);border-radius:var(--input-border-radius);color:var(--default);text-align:left;box-sizing:border-box;cursor:pointer;font-family:var(--font-family);font-size:var(--form-control-font-size)}.useAddNewBtn_action-button_7l1Pc:focus,.useAddNewBtn_action-button_7l1Pc.useAddNewBtn_focus_7l1Pc{outline:none}.useAddNewBtn_action-button_7l1Pc:focus:before,.useAddNewBtn_action-button_7l1Pc.useAddNewBtn_focus_7l1Pc:before{outline:calc(.125 * var(--font-size)) solid var(--color-focus);outline-offset:0;border-radius:var(--focus-border-radius);content:"";position:absolute;top:0;left:.125rem;height:100%;width:calc(100% - .25rem);opacity:1;z-index:101}.useAddNewBtn_action-button_7l1Pc:hover{background-color:var(--color-blue-grey50)}.useAddNewBtn_action-button_7l1Pc:active{background-color:var(--color-blue-grey100)}')),document.head.appendChild(e)}}catch(n){console.error("vite-plugin-css-injected-by-js",n)}}();
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="useAddNewBtn_focus_7l1Pc",t={"has-sibling":"useAddNewBtn_has-sibling_7l1Pc","action-button":"useAddNewBtn_action-button_7l1Pc",focus:e};exports.default=t,exports.focus=e;
+//# sourceMappingURL=useAddNewBtn.module.scss.cjs.js.map

package/dist/components/Form/Select/useAddNewBtn.module.scss.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAddNewBtn.module.scss.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/Form/Select/useAddNewBtn.module.scss.es.js

@@ -0,0 +1,12 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.useAddNewBtn_sr-only_7l1Pc{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.useAddNewBtn_hidden_7l1Pc{display:none}.useAddNewBtn_slide-in_7l1Pc{animation:useAddNewBtn_slide-in_7l1Pc .5s forwards}@media (prefers-reduced-motion: reduce){.useAddNewBtn_slide-in_7l1Pc{animation-duration:.1ms}}.useAddNewBtn_slide-out_7l1Pc{animation:useAddNewBtn_slide-out_7l1Pc .5s forwards}@media (prefers-reduced-motion: reduce){.useAddNewBtn_slide-out_7l1Pc{animation-duration:.1ms}}@keyframes useAddNewBtn_slide-in_7l1Pc{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes useAddNewBtn_slide-out_7l1Pc{0%{transform:translateY(0)}to{transform:translateY(100vh)}}/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */ul.useAddNewBtn_has-sibling_7l1Pc{padding-bottom:2px}.useAddNewBtn_action-button_7l1Pc{position:relative;border:none;border-top:1px solid var(--color-blue-grey50);width:100%;height:calc(2.5 * var(--font-size));padding:.625rem .75rem;margin:0 0 .25rem;background-color:var(--light);border-radius:var(--input-border-radius);color:var(--default);text-align:left;box-sizing:border-box;cursor:pointer;font-family:var(--font-family);font-size:var(--form-control-font-size)}.useAddNewBtn_action-button_7l1Pc:focus,.useAddNewBtn_action-button_7l1Pc.useAddNewBtn_focus_7l1Pc{outline:none}.useAddNewBtn_action-button_7l1Pc:focus:before,.useAddNewBtn_action-button_7l1Pc.useAddNewBtn_focus_7l1Pc:before{outline:calc(.125 * var(--font-size)) solid var(--color-focus);outline-offset:0;border-radius:var(--focus-border-radius);content:"";position:absolute;top:0;left:.125rem;height:100%;width:calc(100% - .25rem);opacity:1;z-index:101}.useAddNewBtn_action-button_7l1Pc:hover{background-color:var(--color-blue-grey50)}.useAddNewBtn_action-button_7l1Pc:active{background-color:var(--color-blue-grey100)}')),document.head.appendChild(e)}}catch(n){console.error("vite-plugin-css-injected-by-js",n)}}();
+const focus = "useAddNewBtn_focus_7l1Pc";
+const classes = {
+  "has-sibling": "useAddNewBtn_has-sibling_7l1Pc",
+  "action-button": "useAddNewBtn_action-button_7l1Pc",
+  focus
+};
+export {
+  classes as default,
+  focus
+};
+//# sourceMappingURL=useAddNewBtn.module.scss.es.js.map

package/dist/components/Form/Select/useAddNewBtn.module.scss.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAddNewBtn.module.scss.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/components/Form/Select/useSelectPositionList.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),e=require("./Select.interfaces.cjs.js");exports.useSelectPositionList=({expanded:n,optionListReference:i,addBtnRef:o,containerReference:r})=>{const[s,c]=t.useState({wrapper:void 0,list:void 0}),[u,l]=t.useState(0),[d,g]=t.useState(e.Position.Below);t.useEffect((()=>{p()}),[n]);const p=()=>{var t;if(!n||!i.current||!r.current)return;const o=null==(t=i.current)?void 0:t.getBoundingClientRect().height,s=r.current.getBoundingClientRect(),c=s.top,u=window.innerHeight-s.bottom,l=o>u&&c>u?e.Position.Above:e.Position.Below;g(l),a(l)},a=t=>{var n;const s=null==(n=i.current)?void 0:n.getBoundingClientRect().height,u=o.current?o.current.getBoundingClientRect().height+parseInt(getComputedStyle(o.current).marginBottom):0,d=t===e.Position.Below?"top":"bottom";if(!r.current)return;const g="top"===d?window.innerHeight-r.current.getBoundingClientRect().bottom-16:r.current.getBoundingClientRect().top-16;if(s&&g<s+u)return c({wrapper:`${g}px`,list:u>0?g-u+"px":"none"}),void l(100);c({wrapper:void 0,list:void 0}),l(100)};return{optionsListMaxHeight:s,opacity:u,setOpacity:l,listPosition:d,setListPosition:g}};
+//# sourceMappingURL=useSelectPositionList.cjs.js.map

package/dist/components/Form/Select/useSelectPositionList.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectPositionList.cjs.js","sources":["../../../../src/components/Form/Select/useSelectPositionList.ts"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport { useEffect, useState } from \"react\";\nimport { Position, UseSelectPositionListParams } from \"./Select.interfaces\";\n\n/** @scope .*/\nexport const useSelectPositionList = ({\n  expanded,\n  optionListReference,\n  addBtnRef,\n  containerReference\n}: UseSelectPositionListParams) => {\n  const [optionsListMaxHeight, setOptionsListMaxHeight] = useState<{\n    wrapper?: string;\n    list?: string;\n  }>({\n    wrapper: undefined,\n    list: undefined\n  });\n  const [opacity, setOpacity] = useState(0); // We set opacity because otherwise if we calculate the max height you see the list full height for a split second and then it shortens.\n  const [listPosition, setListPosition] = useState<Position>(Position.Below);\n\n  useEffect(() => {\n    rePositionList();\n  }, [expanded]);\n\n  const rePositionList = () => {\n    if (!expanded || !optionListReference.current || !containerReference.current) {\n      return;\n    }\n\n    const listHeight = optionListReference.current?.getBoundingClientRect().height;\n\n    const viewportRelativeRect = containerReference.current.getBoundingClientRect();\n\n    const spaceOnTopOfSelect = viewportRelativeRect.top;\n    const spaceOnBottomOfSelect = window.innerHeight - viewportRelativeRect.bottom;\n\n    const position =\n      listHeight > spaceOnBottomOfSelect && spaceOnTopOfSelect > spaceOnBottomOfSelect\n        ? Position.Above\n        : Position.Below;\n\n    setListPosition(position);\n\n    // Calculate the potential max height of the options list\n    calculateOptionListMaxHeight(position);\n  };\n\n  const calculateOptionListMaxHeight = (position: Position) => {\n    // Calculate max height if there's more space below the select\n    const listHeight = optionListReference.current?.getBoundingClientRect().height;\n    const addNewButtonHeightWithMargin = addBtnRef.current\n      ? addBtnRef.current.getBoundingClientRect().height +\n        parseInt(getComputedStyle(addBtnRef.current).marginBottom)\n      : 0;\n    const transformOrigin = position === Position.Below ? \"top\" : \"bottom\";\n\n    if (!containerReference.current) {\n      console.error(\n        \"The containerReference is empty for some reason in the SelectService.ts for the Select component in react-lib-components. We are trying to calculate the option list max height on expand\"\n      );\n      return;\n    }\n\n    const availableSpace =\n      transformOrigin === \"top\"\n        ? window.innerHeight - containerReference.current.getBoundingClientRect().bottom - 16\n        : containerReference.current.getBoundingClientRect().top - 16;\n\n    if (listHeight && availableSpace < listHeight + addNewButtonHeightWithMargin) {\n      const maxHeightObject = {\n        wrapper: `${availableSpace}px`,\n        list:\n          addNewButtonHeightWithMargin > 0\n            ? `${availableSpace - addNewButtonHeightWithMargin}px`\n            : \"none\"\n      };\n      setOptionsListMaxHeight(maxHeightObject);\n      setOpacity(100);\n      return;\n    }\n\n    setOptionsListMaxHeight({ wrapper: undefined, list: undefined });\n    setOpacity(100);\n  };\n\n  return {\n    optionsListMaxHeight,\n    opacity,\n    setOpacity,\n    listPosition,\n    setListPosition\n  };\n};\n"],"names":["expanded","optionListReference","addBtnRef","containerReference","optionsListMaxHeight","setOptionsListMaxHeight","useState","wrapper","list","opacity","setOpacity","listPosition","setListPosition","Position","Below","useEffect","rePositionList","current","listHeight","_a","getBoundingClientRect","height","viewportRelativeRect","spaceOnTopOfSelect","top","spaceOnBottomOfSelect","window","innerHeight","bottom","position","Above","calculateOptionListMaxHeight","addNewButtonHeightWithMargin","parseInt","getComputedStyle","marginBottom","transformOrigin","availableSpace"],"mappings":"+KAoBqC,EACnCA,WACAC,sBACAC,YACAC,yBAEA,MAAOC,EAAsBC,GAA2BC,WAGrD,CACDC,aAAS,EACTC,UAAM,KAEDC,EAASC,GAAcJ,EAAAA,SAAS,IAChCK,EAAcC,GAAmBN,EAAAA,SAAmBO,EAAAA,SAASC,OAEpEC,EAAAA,WAAU,KACOC,GAAA,GACd,CAAChB,IAEJ,MAAMgB,EAAiB,WACrB,IAAKhB,IAAaC,EAAoBgB,UAAYd,EAAmBc,QACnE,OAGF,MAAMC,EAAa,OAAAC,EAAAlB,EAAoBgB,cAApB,EAAAE,EAA6BC,wBAAwBC,OAElEC,EAAuBnB,EAAmBc,QAAQG,wBAElDG,EAAqBD,EAAqBE,IAC1CC,EAAwBC,OAAOC,YAAcL,EAAqBM,OAElEC,EACJX,EAAaO,GAAyBF,EAAqBE,EACvDZ,EAAAA,SAASiB,MACTjB,EAAAA,SAASC,MAEfF,EAAgBiB,GAGhBE,EAA6BF,EAAQ,EAGjCE,EAAgCF,UAEpC,MAAMX,EAAa,OAAAC,EAAAlB,EAAoBgB,cAApB,EAAAE,EAA6BC,wBAAwBC,OAClEW,EAA+B9B,EAAUe,QAC3Cf,EAAUe,QAAQG,wBAAwBC,OAC1CY,SAASC,iBAAiBhC,EAAUe,SAASkB,cAC7C,EACEC,EAAkBP,IAAahB,EAASA,SAAAC,MAAQ,MAAQ,SAE1D,IAACX,EAAmBc,QAItB,OAGF,MAAMoB,EACgB,QAApBD,EACIV,OAAOC,YAAcxB,EAAmBc,QAAQG,wBAAwBQ,OAAS,GACjFzB,EAAmBc,QAAQG,wBAAwBI,IAAM,GAE3D,GAAAN,GAAcmB,EAAiBnB,EAAac,EAU9C,OAFA3B,EAPwB,CACtBE,QAAS,GAAG8B,MACZ7B,KACEwB,EAA+B,EACxBK,EAAiBL,EAApB,KACA,cAGRtB,EAAW,KAIbL,EAAwB,CAAEE,aAAS,EAAWC,UAAM,IACpDE,EAAW,IAAG,EAGT,MAAA,CACLN,uBACAK,UACAC,aACAC,eACAC,kBACF"}

package/dist/components/Form/Select/useSelectPositionList.es.js

@@ -0,0 +1,66 @@
+import { useState, useEffect } from "react";
+import { Position } from "./Select.interfaces.es.js";
+const useSelectPositionList = ({
+  expanded,
+  optionListReference,
+  addBtnRef,
+  containerReference
+}) => {
+  const [optionsListMaxHeight, setOptionsListMaxHeight] = useState({
+    wrapper: void 0,
+    list: void 0
+  });
+  const [opacity, setOpacity] = useState(0);
+  const [listPosition, setListPosition] = useState(Position.Below);
+  useEffect(() => {
+    rePositionList();
+  }, [expanded]);
+  const rePositionList = () => {
+    var _a;
+    if (!expanded || !optionListReference.current || !containerReference.current) {
+      return;
+    }
+    const listHeight = (_a = optionListReference.current) == null ? void 0 : _a.getBoundingClientRect().height;
+    const viewportRelativeRect = containerReference.current.getBoundingClientRect();
+    const spaceOnTopOfSelect = viewportRelativeRect.top;
+    const spaceOnBottomOfSelect = window.innerHeight - viewportRelativeRect.bottom;
+    const position = listHeight > spaceOnBottomOfSelect && spaceOnTopOfSelect > spaceOnBottomOfSelect ? Position.Above : Position.Below;
+    setListPosition(position);
+    calculateOptionListMaxHeight(position);
+  };
+  const calculateOptionListMaxHeight = (position) => {
+    var _a;
+    const listHeight = (_a = optionListReference.current) == null ? void 0 : _a.getBoundingClientRect().height;
+    const addNewButtonHeightWithMargin = addBtnRef.current ? addBtnRef.current.getBoundingClientRect().height + parseInt(getComputedStyle(addBtnRef.current).marginBottom) : 0;
+    const transformOrigin = position === Position.Below ? "top" : "bottom";
+    if (!containerReference.current) {
+      console.error(
+        "The containerReference is empty for some reason in the SelectService.ts for the Select component in react-lib-components. We are trying to calculate the option list max height on expand"
+      );
+      return;
+    }
+    const availableSpace = transformOrigin === "top" ? window.innerHeight - containerReference.current.getBoundingClientRect().bottom - 16 : containerReference.current.getBoundingClientRect().top - 16;
+    if (listHeight && availableSpace < listHeight + addNewButtonHeightWithMargin) {
+      const maxHeightObject = {
+        wrapper: `${availableSpace}px`,
+        list: addNewButtonHeightWithMargin > 0 ? `${availableSpace - addNewButtonHeightWithMargin}px` : "none"
+      };
+      setOptionsListMaxHeight(maxHeightObject);
+      setOpacity(100);
+      return;
+    }
+    setOptionsListMaxHeight({ wrapper: void 0, list: void 0 });
+    setOpacity(100);
+  };
+  return {
+    optionsListMaxHeight,
+    opacity,
+    setOpacity,
+    listPosition,
+    setListPosition
+  };
+};
+export {
+  useSelectPositionList
+};
+//# sourceMappingURL=useSelectPositionList.es.js.map

package/dist/components/Form/Select/useSelectPositionList.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectPositionList.es.js","sources":["../../../../src/components/Form/Select/useSelectPositionList.ts"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport { useEffect, useState } from \"react\";\nimport { Position, UseSelectPositionListParams } from \"./Select.interfaces\";\n\n/** @scope .*/\nexport const useSelectPositionList = ({\n  expanded,\n  optionListReference,\n  addBtnRef,\n  containerReference\n}: UseSelectPositionListParams) => {\n  const [optionsListMaxHeight, setOptionsListMaxHeight] = useState<{\n    wrapper?: string;\n    list?: string;\n  }>({\n    wrapper: undefined,\n    list: undefined\n  });\n  const [opacity, setOpacity] = useState(0); // We set opacity because otherwise if we calculate the max height you see the list full height for a split second and then it shortens.\n  const [listPosition, setListPosition] = useState<Position>(Position.Below);\n\n  useEffect(() => {\n    rePositionList();\n  }, [expanded]);\n\n  const rePositionList = () => {\n    if (!expanded || !optionListReference.current || !containerReference.current) {\n      return;\n    }\n\n    const listHeight = optionListReference.current?.getBoundingClientRect().height;\n\n    const viewportRelativeRect = containerReference.current.getBoundingClientRect();\n\n    const spaceOnTopOfSelect = viewportRelativeRect.top;\n    const spaceOnBottomOfSelect = window.innerHeight - viewportRelativeRect.bottom;\n\n    const position =\n      listHeight > spaceOnBottomOfSelect && spaceOnTopOfSelect > spaceOnBottomOfSelect\n        ? Position.Above\n        : Position.Below;\n\n    setListPosition(position);\n\n    // Calculate the potential max height of the options list\n    calculateOptionListMaxHeight(position);\n  };\n\n  const calculateOptionListMaxHeight = (position: Position) => {\n    // Calculate max height if there's more space below the select\n    const listHeight = optionListReference.current?.getBoundingClientRect().height;\n    const addNewButtonHeightWithMargin = addBtnRef.current\n      ? addBtnRef.current.getBoundingClientRect().height +\n        parseInt(getComputedStyle(addBtnRef.current).marginBottom)\n      : 0;\n    const transformOrigin = position === Position.Below ? \"top\" : \"bottom\";\n\n    if (!containerReference.current) {\n      console.error(\n        \"The containerReference is empty for some reason in the SelectService.ts for the Select component in react-lib-components. We are trying to calculate the option list max height on expand\"\n      );\n      return;\n    }\n\n    const availableSpace =\n      transformOrigin === \"top\"\n        ? window.innerHeight - containerReference.current.getBoundingClientRect().bottom - 16\n        : containerReference.current.getBoundingClientRect().top - 16;\n\n    if (listHeight && availableSpace < listHeight + addNewButtonHeightWithMargin) {\n      const maxHeightObject = {\n        wrapper: `${availableSpace}px`,\n        list:\n          addNewButtonHeightWithMargin > 0\n            ? `${availableSpace - addNewButtonHeightWithMargin}px`\n            : \"none\"\n      };\n      setOptionsListMaxHeight(maxHeightObject);\n      setOpacity(100);\n      return;\n    }\n\n    setOptionsListMaxHeight({ wrapper: undefined, list: undefined });\n    setOpacity(100);\n  };\n\n  return {\n    optionsListMaxHeight,\n    opacity,\n    setOpacity,\n    listPosition,\n    setListPosition\n  };\n};\n"],"names":[],"mappings":";;AAoBO,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAmC;AACjC,QAAM,CAAC,sBAAsB,uBAAuB,IAAI,SAGrD;AAAA,IACD,SAAS;AAAA,IACT,MAAM;AAAA,EAAA,CACP;AACD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,CAAC;AACxC,QAAM,CAAC,cAAc,eAAe,IAAI,SAAmB,SAAS,KAAK;AAEzE,YAAU,MAAM;AACC,mBAAA;AAAA,EAAA,GACd,CAAC,QAAQ,CAAC;AAEb,QAAM,iBAAiB,MAAM;;AAC3B,QAAI,CAAC,YAAY,CAAC,oBAAoB,WAAW,CAAC,mBAAmB,SAAS;AAC5E;AAAA,IAAA;AAGF,UAAM,cAAa,yBAAoB,YAApB,mBAA6B,wBAAwB;AAElE,UAAA,uBAAuB,mBAAmB,QAAQ,sBAAsB;AAE9E,UAAM,qBAAqB,qBAAqB;AAC1C,UAAA,wBAAwB,OAAO,cAAc,qBAAqB;AAExE,UAAM,WACJ,aAAa,yBAAyB,qBAAqB,wBACvD,SAAS,QACT,SAAS;AAEf,oBAAgB,QAAQ;AAGxB,iCAA6B,QAAQ;AAAA,EACvC;AAEM,QAAA,+BAA+B,CAAC,aAAuB;;AAE3D,UAAM,cAAa,yBAAoB,YAApB,mBAA6B,wBAAwB;AACxE,UAAM,+BAA+B,UAAU,UAC3C,UAAU,QAAQ,sBAAsB,EAAE,SAC1C,SAAS,iBAAiB,UAAU,OAAO,EAAE,YAAY,IACzD;AACJ,UAAM,kBAAkB,aAAa,SAAS,QAAQ,QAAQ;AAE1D,QAAA,CAAC,mBAAmB,SAAS;AACvB,cAAA;AAAA,QACN;AAAA,MACF;AACA;AAAA,IAAA;AAGF,UAAM,iBACJ,oBAAoB,QAChB,OAAO,cAAc,mBAAmB,QAAQ,sBAAsB,EAAE,SAAS,KACjF,mBAAmB,QAAQ,sBAAA,EAAwB,MAAM;AAE3D,QAAA,cAAc,iBAAiB,aAAa,8BAA8B;AAC5E,YAAM,kBAAkB;AAAA,QACtB,SAAS,GAAG,cAAc;AAAA,QAC1B,MACE,+BAA+B,IAC3B,GAAG,iBAAiB,4BAA4B,OAChD;AAAA,MACR;AACA,8BAAwB,eAAe;AACvC,iBAAW,GAAG;AACd;AAAA,IAAA;AAGF,4BAAwB,EAAE,SAAS,QAAW,MAAM,QAAW;AAC/D,eAAW,GAAG;AAAA,EAChB;AAEO,SAAA;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;"}

package/dist/components/Form/Textarea/Textarea.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),s=require("./Textarea.module.scss.cjs.js"),a=require("../../../hooks/useDetermineStatusIcon.cjs.js"),r=require("../../withReadOnly.cjs.js").withReadOnly(e.forwardRef((({error:r=!1,success:t=!1,disabled:u=!1,className:l,rows:o=4,wrapperProps:c,onFocus:d,onBlur:n,value:i,...f},p)=>{const[m,h]=e.useState(!1),j=[s.default["textarea-wrapper"]],w=[s.default.outline];(null==c?void 0:c.className)&&j.push(c.className),u&&j.push(s.default.disabled)&&w.push(s.default.disabled),r&&j.push(s.default.error)&&w.push(s.default.error),m&&j.push(s.default.focus)&&w.push(s.default.focus),t&&j.push("success");const v=a.useDetermineStatusIcon({success:t,error:r});return e.createElement("div",{...c,className:j.join(" ")},f["data-readonlyview"]?e.createElement("div",{"data-readonlyview":!0,tabIndex:0,className:`${r?s.default.error:""} ${t?s.default.success:""}`},i):e.createElement("textarea",{...f,ref:p,rows:o,className:`${r?s.default.error:""} ${s.default.textarea} ${l??""}`,disabled:u,onFocus:e=>{h(!0),null==d||d(e)},onBlur:e=>{h(!1),null==n||n(e)},value:i}),v,e.createElement("span",{className:w.join(" ")}))})));exports.Textarea=r;
+//# sourceMappingURL=Textarea.cjs.js.map

package/dist/components/Form/Textarea/Textarea.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.cjs.js","sources":["../../../../src/components/Form/Textarea/Textarea.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef, useState } from \"react\";\nimport classes from \"./Textarea.module.scss\";\nimport { FormElement } from \"../form.interfaces\";\nimport { useDetermineStatusIcon } from \"../../../hooks/useDetermineStatusIcon\";\nimport { withReadOnly } from \"../../withReadOnly\";\n\nexport interface Props extends ComponentPropsWithRef<\"textarea\">, FormElement {\n  wrapperProps?: ComponentPropsWithRef<\"div\">;\n  readOnlyView?: boolean;\n}\n\nconst TextareaComponent: ForwardRefRenderFunction<HTMLTextAreaElement, Props> = (\n  {\n    error = false,\n    success = false,\n    disabled = false,\n    className,\n    rows = 4,\n    wrapperProps,\n    onFocus,\n    onBlur,\n    value,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const [focus, setFocus] = useState(false);\n\n  const wrapperClasses = [classes[\"textarea-wrapper\"]];\n  const outlineClasses = [classes[\"outline\"]];\n\n  wrapperProps?.className && wrapperClasses.push(wrapperProps.className);\n  disabled && wrapperClasses.push(classes[\"disabled\"]) && outlineClasses.push(classes[\"disabled\"]);\n  error && wrapperClasses.push(classes[\"error\"]) && outlineClasses.push(classes[\"error\"]);\n  focus && wrapperClasses.push(classes[\"focus\"]) && outlineClasses.push(classes[\"focus\"]);\n  success && wrapperClasses.push(\"success\");\n\n  const icon = useDetermineStatusIcon({ success, error });\n\n  const renderTextarea = () => {\n    if (rest[\"data-readonlyview\"]) {\n      return (\n        <div\n          data-readonlyview={true}\n          tabIndex={0}\n          className={`${error ? classes[\"error\"] : \"\"} ${success ? classes[\"success\"] : \"\"}`}\n        >\n          {value}\n        </div>\n      );\n    }\n    return (\n      <textarea\n        {...rest}\n        ref={ref}\n        rows={rows}\n        className={`${error ? classes[\"error\"] : \"\"} ${classes[\"textarea\"]} ${className ?? \"\"}`}\n        disabled={disabled}\n        onFocus={event => {\n          setFocus(true);\n          onFocus?.(event);\n        }}\n        onBlur={event => {\n          setFocus(false);\n          onBlur?.(event);\n        }}\n        value={value}\n      />\n    );\n  };\n\n  return (\n    <div {...wrapperProps} className={wrapperClasses.join(\" \")}>\n      {renderTextarea()}\n      {icon}\n      <span className={outlineClasses.join(\" \")}></span>\n    </div>\n  );\n};\n\nexport const Textarea = withReadOnly(React.forwardRef(TextareaComponent));\n"],"names":["Textarea","withReadOnly","React","forwardRef","error","success","disabled","className","rows","wrapperProps","onFocus","onBlur","value","rest","ref","focus","setFocus","useState","wrapperClasses","classes","outlineClasses","push","icon","useDetermineStatusIcon","join","createElement","tabIndex","event"],"mappings":"8MAgGaA,uCAAWC,aAAaC,EAAMC,YArEqC,EAE5EC,SAAQ,EACRC,WAAU,EACVC,YAAW,EACXC,YACAC,OAAO,EACPC,eACAC,UACAC,SACAC,WACGC,GAELC,KAEA,MAAOC,EAAOC,GAAYC,EAAAA,UAAS,GAE7BC,EAAiB,CAACC,UAAQ,qBAC1BC,EAAiB,CAACD,UAAiB,UAEzC,MAAAV,OAAA,EAAAA,EAAcF,YAAaW,EAAeG,KAAKZ,EAAaF,WAChDD,GAAAY,EAAeG,KAAKF,EAAAA,QAAkB,WAAMC,EAAeC,KAAKF,UAAkB,UACrFf,GAAAc,EAAeG,KAAKF,EAAAA,QAAe,QAAMC,EAAeC,KAAKF,UAAe,OAC5EJ,GAAAG,EAAeG,KAAKF,EAAAA,QAAe,QAAMC,EAAeC,KAAKF,UAAe,OAC1Ed,GAAAa,EAAeG,KAAK,WAE/B,MAAMC,EAAOC,EAAAA,uBAAuB,CAAElB,UAASD,iCAmC5C,MAAK,IAAGK,EAAcF,UAAWW,EAAeM,KAAK,MAhClDX,EAAK,qBAELX,EAAAuB,cAAC,MAAA,CACC,qBAAmB,EACnBC,SAAU,EACVnB,UAAW,GAAGH,EAAQe,EAAAA,QAAe,MAAI,MAAMd,EAAUc,EAAAA,QAAiB,QAAI,MAE7EP,GAKLV,EAAAuB,cAAC,WAAA,IACKZ,EACJC,MACAN,OACAD,UAAW,GAAGH,EAAQe,EAAAA,QAAe,MAAI,MAAMA,EAAAA,QAAkB,YAAKZ,GAAa,KACnFD,WACAI,QAAkBiB,IAChBX,GAAS,GACC,MAAAN,GAAAA,EAAAiB,EAAA,EAEZhB,OAAiBgB,IACfX,GAAS,GACA,MAAAL,GAAAA,EAAAgB,EAAA,EAEXf,UAQDU,kBACA,OAAK,CAAAf,UAAWa,EAAeI,KAAK,OACvC"}

package/dist/components/Form/Textarea/Textarea.es.js

@@ -0,0 +1,64 @@
+import React, { useState } from "react";
+import classes from "./Textarea.module.scss.es.js";
+import { useDetermineStatusIcon } from "../../../hooks/useDetermineStatusIcon.es.js";
+import { withReadOnly } from "../../withReadOnly.es.js";
+const TextareaComponent = ({
+  error = false,
+  success = false,
+  disabled = false,
+  className,
+  rows = 4,
+  wrapperProps,
+  onFocus,
+  onBlur,
+  value,
+  ...rest
+}, ref) => {
+  const [focus, setFocus] = useState(false);
+  const wrapperClasses = [classes["textarea-wrapper"]];
+  const outlineClasses = [classes["outline"]];
+  (wrapperProps == null ? void 0 : wrapperProps.className) && wrapperClasses.push(wrapperProps.className);
+  disabled && wrapperClasses.push(classes["disabled"]) && outlineClasses.push(classes["disabled"]);
+  error && wrapperClasses.push(classes["error"]) && outlineClasses.push(classes["error"]);
+  focus && wrapperClasses.push(classes["focus"]) && outlineClasses.push(classes["focus"]);
+  success && wrapperClasses.push("success");
+  const icon = useDetermineStatusIcon({ success, error });
+  const renderTextarea = () => {
+    if (rest["data-readonlyview"]) {
+      return /* @__PURE__ */ React.createElement(
+        "div",
+        {
+          "data-readonlyview": true,
+          tabIndex: 0,
+          className: `${error ? classes["error"] : ""} ${success ? classes["success"] : ""}`
+        },
+        value
+      );
+    }
+    return /* @__PURE__ */ React.createElement(
+      "textarea",
+      {
+        ...rest,
+        ref,
+        rows,
+        className: `${error ? classes["error"] : ""} ${classes["textarea"]} ${className ?? ""}`,
+        disabled,
+        onFocus: (event) => {
+          setFocus(true);
+          onFocus == null ? void 0 : onFocus(event);
+        },
+        onBlur: (event) => {
+          setFocus(false);
+          onBlur == null ? void 0 : onBlur(event);
+        },
+        value
+      }
+    );
+  };
+  return /* @__PURE__ */ React.createElement("div", { ...wrapperProps, className: wrapperClasses.join(" ") }, renderTextarea(), icon, /* @__PURE__ */ React.createElement("span", { className: outlineClasses.join(" ") }));
+};
+const Textarea = withReadOnly(React.forwardRef(TextareaComponent));
+export {
+  Textarea
+};
+//# sourceMappingURL=Textarea.es.js.map

package/dist/components/Form/Textarea/Textarea.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.es.js","sources":["../../../../src/components/Form/Textarea/Textarea.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef, useState } from \"react\";\nimport classes from \"./Textarea.module.scss\";\nimport { FormElement } from \"../form.interfaces\";\nimport { useDetermineStatusIcon } from \"../../../hooks/useDetermineStatusIcon\";\nimport { withReadOnly } from \"../../withReadOnly\";\n\nexport interface Props extends ComponentPropsWithRef<\"textarea\">, FormElement {\n  wrapperProps?: ComponentPropsWithRef<\"div\">;\n  readOnlyView?: boolean;\n}\n\nconst TextareaComponent: ForwardRefRenderFunction<HTMLTextAreaElement, Props> = (\n  {\n    error = false,\n    success = false,\n    disabled = false,\n    className,\n    rows = 4,\n    wrapperProps,\n    onFocus,\n    onBlur,\n    value,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const [focus, setFocus] = useState(false);\n\n  const wrapperClasses = [classes[\"textarea-wrapper\"]];\n  const outlineClasses = [classes[\"outline\"]];\n\n  wrapperProps?.className && wrapperClasses.push(wrapperProps.className);\n  disabled && wrapperClasses.push(classes[\"disabled\"]) && outlineClasses.push(classes[\"disabled\"]);\n  error && wrapperClasses.push(classes[\"error\"]) && outlineClasses.push(classes[\"error\"]);\n  focus && wrapperClasses.push(classes[\"focus\"]) && outlineClasses.push(classes[\"focus\"]);\n  success && wrapperClasses.push(\"success\");\n\n  const icon = useDetermineStatusIcon({ success, error });\n\n  const renderTextarea = () => {\n    if (rest[\"data-readonlyview\"]) {\n      return (\n        <div\n          data-readonlyview={true}\n          tabIndex={0}\n          className={`${error ? classes[\"error\"] : \"\"} ${success ? classes[\"success\"] : \"\"}`}\n        >\n          {value}\n        </div>\n      );\n    }\n    return (\n      <textarea\n        {...rest}\n        ref={ref}\n        rows={rows}\n        className={`${error ? classes[\"error\"] : \"\"} ${classes[\"textarea\"]} ${className ?? \"\"}`}\n        disabled={disabled}\n        onFocus={event => {\n          setFocus(true);\n          onFocus?.(event);\n        }}\n        onBlur={event => {\n          setFocus(false);\n          onBlur?.(event);\n        }}\n        value={value}\n      />\n    );\n  };\n\n  return (\n    <div {...wrapperProps} className={wrapperClasses.join(\" \")}>\n      {renderTextarea()}\n      {icon}\n      <span className={outlineClasses.join(\" \")}></span>\n    </div>\n  );\n};\n\nexport const Textarea = withReadOnly(React.forwardRef(TextareaComponent));\n"],"names":[],"mappings":";;;;AA2BA,MAAM,oBAA0E,CAC9E;AAAA,EACE,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,WAAW;AAAA,EACX;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GACA,QACG;AACH,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,KAAK;AAExC,QAAM,iBAAiB,CAAC,QAAQ,kBAAkB,CAAC;AACnD,QAAM,iBAAiB,CAAC,QAAQ,SAAS,CAAC;AAE1C,gDAAc,cAAa,eAAe,KAAK,aAAa,SAAS;AACzD,cAAA,eAAe,KAAK,QAAQ,UAAU,CAAC,KAAK,eAAe,KAAK,QAAQ,UAAU,CAAC;AACtF,WAAA,eAAe,KAAK,QAAQ,OAAO,CAAC,KAAK,eAAe,KAAK,QAAQ,OAAO,CAAC;AAC7E,WAAA,eAAe,KAAK,QAAQ,OAAO,CAAC,KAAK,eAAe,KAAK,QAAQ,OAAO,CAAC;AAC3E,aAAA,eAAe,KAAK,SAAS;AAExC,QAAM,OAAO,uBAAuB,EAAE,SAAS,OAAO;AAEtD,QAAM,iBAAiB,MAAM;AACvB,QAAA,KAAK,mBAAmB,GAAG;AAE3B,aAAA,sBAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,qBAAmB;AAAA,UACnB,UAAU;AAAA,UACV,WAAW,GAAG,QAAQ,QAAQ,OAAO,IAAI,EAAE,IAAI,UAAU,QAAQ,SAAS,IAAI,EAAE;AAAA,QAAA;AAAA,QAE/E;AAAA,MACH;AAAA,IAAA;AAIF,WAAA,sBAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA,WAAW,GAAG,QAAQ,QAAQ,OAAO,IAAI,EAAE,IAAI,QAAQ,UAAU,CAAC,IAAI,aAAa,EAAE;AAAA,QACrF;AAAA,QACA,SAAS,CAAS,UAAA;AAChB,mBAAS,IAAI;AACb,6CAAU;AAAA,QACZ;AAAA,QACA,QAAQ,CAAS,UAAA;AACf,mBAAS,KAAK;AACd,2CAAS;AAAA,QACX;AAAA,QACA;AAAA,MAAA;AAAA,IACF;AAAA,EAEJ;AAEA,6CACG,OAAK,EAAA,GAAG,cAAc,WAAW,eAAe,KAAK,GAAG,EAAA,GACtD,eACA,GAAA,0CACA,QAAK,EAAA,WAAW,eAAe,KAAK,GAAG,GAAG,CAC7C;AAEJ;AAEO,MAAM,WAAW,aAAa,MAAM,WAAW,iBAAiB,CAAC;"}

package/dist/components/Form/Textarea/Textarea.module.scss.cjs.js

@@ -0,0 +1,3 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.Textarea_sr-only_7l1Pc{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.Textarea_hidden_7l1Pc{display:none}.Textarea_slide-in_7l1Pc{animation:Textarea_slide-in_7l1Pc .5s forwards}@media (prefers-reduced-motion: reduce){.Textarea_slide-in_7l1Pc{animation-duration:.1ms}}.Textarea_slide-out_7l1Pc{animation:Textarea_slide-out_7l1Pc .5s forwards}@media (prefers-reduced-motion: reduce){.Textarea_slide-out_7l1Pc{animation-duration:.1ms}}@keyframes Textarea_slide-in_7l1Pc{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes Textarea_slide-out_7l1Pc{0%{transform:translateY(0)}to{transform:translateY(100vh)}}/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.Textarea_textarea-wrapper_7l1Pc{position:relative;box-sizing:border-box;width:100%}.Textarea_textarea-wrapper_7l1Pc [data-icon-status=success],.Textarea_textarea-wrapper_7l1Pc [data-icon-status=error]{position:absolute;right:1.25rem;z-index:1;top:.85rem;font-size:var(--font-size-big)}.Textarea_textarea-wrapper_7l1Pc [data-icon-status=success]:before,.Textarea_textarea-wrapper_7l1Pc [data-icon-status=error]:before{font-size:var(--icon-font-big);height:1.25rem;width:1.25rem;display:flex;align-items:center;justify-content:center}.Textarea_textarea-wrapper_7l1Pc [data-icon-status=success]{color:var(--success)}.Textarea_textarea-wrapper_7l1Pc [data-icon-status=error]{color:var(--error)}.Textarea_textarea-wrapper_7l1Pc:hover .Textarea_outline_7l1Pc{border-color:var(--input-border-color);background-color:var(--input-hover-background-color)}.Textarea_textarea-wrapper_7l1Pc .Textarea_outline_7l1Pc.Textarea_disabled_7l1Pc{border-color:var(--disabled);background-color:var(--input-disabled-background-color)}.Textarea_textarea-wrapper_7l1Pc .Textarea_outline_7l1Pc.Textarea_error_7l1Pc{border-color:var(--error)}.Textarea_textarea-wrapper_7l1Pc:has(div[data-readonlyview=true]:focus){position:relative;z-index:2;outline:calc(.125 * var(--font-size)) solid var(--color-focus);outline-offset:calc(.125 * var(--font-size));border-radius:var(--focus-border-radius)}.Textarea_textarea-wrapper_7l1Pc:has(div[data-readonlyview=true]:focus) .Textarea_outline_7l1Pc{border-width:var(--input-border-width);border-color:var(--input-border-color)}.Textarea_textarea-wrapper_7l1Pc div[data-readonlyview=true]{min-height:4rem;border:1px solid var(--color-blue-grey100);color:var(--read-only-text-color);background-color:var(--color-white);padding:.5rem .75rem;font-family:var(--font-family);font-size:var(--input-font-size);position:relative;border-radius:.125rem;word-wrap:break-word}.Textarea_textarea-wrapper_7l1Pc div[data-readonlyview=true]:focus{outline:none}.Textarea_textarea-wrapper_7l1Pc div[data-readonlyview=true]~span.Textarea_outline_7l1Pc{display:none}.Textarea_textarea-wrapper_7l1Pc div[data-readonlyview=true]:has(~[data-icon-status]){padding-right:2.5rem}.Textarea_textarea-wrapper_7l1Pc .Textarea_outline_7l1Pc{transition-property:background-color,border-color;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.Textarea_textarea-wrapper_7l1Pc .Textarea_outline_7l1Pc{transition-duration:.1ms}}.Textarea_textarea-wrapper_7l1Pc:not(.Textarea_disabled_7l1Pc):has(textarea:focus){position:relative;z-index:2;outline:calc(.125 * var(--font-size)) solid var(--color-focus);outline-offset:calc(.125 * var(--font-size));border-radius:var(--focus-border-radius)}.Textarea_textarea-wrapper_7l1Pc:not(.Textarea_disabled_7l1Pc):has(textarea:focus) .Textarea_outline_7l1Pc{border-width:var(--input-border-width);border-color:var(--input-border-color)}.Textarea_textarea_7l1Pc{padding:calc(.625 * var(--font-size)) calc(.5 * var(--font-size));box-sizing:border-box;border:0;border-radius:var(--input-border-radius);font-family:var(--font-family);font-size:var(--input-font-size);color:var(--color-blue-grey900);vertical-align:top;resize:vertical;position:relative;background-color:transparent;z-index:1;width:calc(100% - var(--input-border-width));margin:var(--input-border-width) 0}.Textarea_textarea_7l1Pc:disabled{cursor:not-allowed;color:var(--greyed-out)}.Textarea_textarea_7l1Pc{transition-property:all;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.Textarea_textarea_7l1Pc{transition-duration:.1ms}}.Textarea_textarea_7l1Pc:focus:not(:disabled){outline:none}.Textarea_textarea_7l1Pc:has(~[data-icon-status]){padding-right:2.5rem}.Textarea_error_7l1Pc{border-color:var(--error)}[data-readonlyview=true] .Textarea_outline_7l1Pc{border-color:var(--read-only-border-color)}.Textarea_outline_7l1Pc{pointer-events:none;position:absolute;margin:0;padding:0;top:0;right:0;bottom:0;left:0;border-color:var(--input-border-color);border-style:var(--input-border-style);border-width:var(--input-border-width);border-radius:var(--input-border-radius);transition-property:all;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.Textarea_outline_7l1Pc{transition-duration:.1ms}}')),document.head.appendChild(e)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}}();
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="Textarea_outline_7l1Pc",r="Textarea_disabled_7l1Pc",t="Textarea_error_7l1Pc",a="Textarea_textarea_7l1Pc",o={"textarea-wrapper":"Textarea_textarea-wrapper_7l1Pc",outline:e,disabled:r,error:t,textarea:a};exports.default=o,exports.disabled=r,exports.error=t,exports.outline=e,exports.textarea=a;
+//# sourceMappingURL=Textarea.module.scss.cjs.js.map

package/dist/components/Form/Textarea/Textarea.module.scss.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.module.scss.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/Form/Textarea/Textarea.module.scss.es.js

@@ -0,0 +1,20 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.Textarea_sr-only_7l1Pc{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.Textarea_hidden_7l1Pc{display:none}.Textarea_slide-in_7l1Pc{animation:Textarea_slide-in_7l1Pc .5s forwards}@media (prefers-reduced-motion: reduce){.Textarea_slide-in_7l1Pc{animation-duration:.1ms}}.Textarea_slide-out_7l1Pc{animation:Textarea_slide-out_7l1Pc .5s forwards}@media (prefers-reduced-motion: reduce){.Textarea_slide-out_7l1Pc{animation-duration:.1ms}}@keyframes Textarea_slide-in_7l1Pc{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes Textarea_slide-out_7l1Pc{0%{transform:translateY(0)}to{transform:translateY(100vh)}}/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.Textarea_textarea-wrapper_7l1Pc{position:relative;box-sizing:border-box;width:100%}.Textarea_textarea-wrapper_7l1Pc [data-icon-status=success],.Textarea_textarea-wrapper_7l1Pc [data-icon-status=error]{position:absolute;right:1.25rem;z-index:1;top:.85rem;font-size:var(--font-size-big)}.Textarea_textarea-wrapper_7l1Pc [data-icon-status=success]:before,.Textarea_textarea-wrapper_7l1Pc [data-icon-status=error]:before{font-size:var(--icon-font-big);height:1.25rem;width:1.25rem;display:flex;align-items:center;justify-content:center}.Textarea_textarea-wrapper_7l1Pc [data-icon-status=success]{color:var(--success)}.Textarea_textarea-wrapper_7l1Pc [data-icon-status=error]{color:var(--error)}.Textarea_textarea-wrapper_7l1Pc:hover .Textarea_outline_7l1Pc{border-color:var(--input-border-color);background-color:var(--input-hover-background-color)}.Textarea_textarea-wrapper_7l1Pc .Textarea_outline_7l1Pc.Textarea_disabled_7l1Pc{border-color:var(--disabled);background-color:var(--input-disabled-background-color)}.Textarea_textarea-wrapper_7l1Pc .Textarea_outline_7l1Pc.Textarea_error_7l1Pc{border-color:var(--error)}.Textarea_textarea-wrapper_7l1Pc:has(div[data-readonlyview=true]:focus){position:relative;z-index:2;outline:calc(.125 * var(--font-size)) solid var(--color-focus);outline-offset:calc(.125 * var(--font-size));border-radius:var(--focus-border-radius)}.Textarea_textarea-wrapper_7l1Pc:has(div[data-readonlyview=true]:focus) .Textarea_outline_7l1Pc{border-width:var(--input-border-width);border-color:var(--input-border-color)}.Textarea_textarea-wrapper_7l1Pc div[data-readonlyview=true]{min-height:4rem;border:1px solid var(--color-blue-grey100);color:var(--read-only-text-color);background-color:var(--color-white);padding:.5rem .75rem;font-family:var(--font-family);font-size:var(--input-font-size);position:relative;border-radius:.125rem;word-wrap:break-word}.Textarea_textarea-wrapper_7l1Pc div[data-readonlyview=true]:focus{outline:none}.Textarea_textarea-wrapper_7l1Pc div[data-readonlyview=true]~span.Textarea_outline_7l1Pc{display:none}.Textarea_textarea-wrapper_7l1Pc div[data-readonlyview=true]:has(~[data-icon-status]){padding-right:2.5rem}.Textarea_textarea-wrapper_7l1Pc .Textarea_outline_7l1Pc{transition-property:background-color,border-color;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.Textarea_textarea-wrapper_7l1Pc .Textarea_outline_7l1Pc{transition-duration:.1ms}}.Textarea_textarea-wrapper_7l1Pc:not(.Textarea_disabled_7l1Pc):has(textarea:focus){position:relative;z-index:2;outline:calc(.125 * var(--font-size)) solid var(--color-focus);outline-offset:calc(.125 * var(--font-size));border-radius:var(--focus-border-radius)}.Textarea_textarea-wrapper_7l1Pc:not(.Textarea_disabled_7l1Pc):has(textarea:focus) .Textarea_outline_7l1Pc{border-width:var(--input-border-width);border-color:var(--input-border-color)}.Textarea_textarea_7l1Pc{padding:calc(.625 * var(--font-size)) calc(.5 * var(--font-size));box-sizing:border-box;border:0;border-radius:var(--input-border-radius);font-family:var(--font-family);font-size:var(--input-font-size);color:var(--color-blue-grey900);vertical-align:top;resize:vertical;position:relative;background-color:transparent;z-index:1;width:calc(100% - var(--input-border-width));margin:var(--input-border-width) 0}.Textarea_textarea_7l1Pc:disabled{cursor:not-allowed;color:var(--greyed-out)}.Textarea_textarea_7l1Pc{transition-property:all;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.Textarea_textarea_7l1Pc{transition-duration:.1ms}}.Textarea_textarea_7l1Pc:focus:not(:disabled){outline:none}.Textarea_textarea_7l1Pc:has(~[data-icon-status]){padding-right:2.5rem}.Textarea_error_7l1Pc{border-color:var(--error)}[data-readonlyview=true] .Textarea_outline_7l1Pc{border-color:var(--read-only-border-color)}.Textarea_outline_7l1Pc{pointer-events:none;position:absolute;margin:0;padding:0;top:0;right:0;bottom:0;left:0;border-color:var(--input-border-color);border-style:var(--input-border-style);border-width:var(--input-border-width);border-radius:var(--input-border-radius);transition-property:all;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.Textarea_outline_7l1Pc{transition-duration:.1ms}}')),document.head.appendChild(e)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}}();
+const outline = "Textarea_outline_7l1Pc";
+const disabled = "Textarea_disabled_7l1Pc";
+const error = "Textarea_error_7l1Pc";
+const textarea = "Textarea_textarea_7l1Pc";
+const classes = {
+  "textarea-wrapper": "Textarea_textarea-wrapper_7l1Pc",
+  outline,
+  disabled,
+  error,
+  textarea
+};
+export {
+  classes as default,
+  disabled,
+  error,
+  outline,
+  textarea
+};
+//# sourceMappingURL=Textarea.module.scss.es.js.map

package/dist/components/Form/Textarea/Textarea.module.scss.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.module.scss.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}

package/dist/components/Form/Toggle/Toggle.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),a=require("../Checkbox/Checkbox.cjs.js"),l=require("./Toggle.module.scss.cjs.js"),r=e.forwardRef((({checked:r,disabled:t,helperProps:s,className:d,label:o,labelPosition:p="right",hideLabel:c=!1,labelOverflow:u="nowrap",version:g="emphasis",spacing:h="packed",...i},f)=>{const b=[l.default["toggle-wrapper"]];return d&&b.push(d),b.push(l.default[`toggle-wrapper--${p}`]),c&&b.push(l.default["toggle-wrapper--hide-label"]),b.push(l.default[`toggle-wrapper--${u}`]),b.push(l.default[`toggle-wrapper--${g}`]),b.push(l.default[`toggle-wrapper--${h}`]),t&&b.push(l.default["toggle-wrapper--disabled"]),e.createElement("div",{className:b.join(" ")},e.createElement(a.Checkbox,{...i,ref:f,checked:r,className:l.default.checkbox,helperProps:{className:l.default["toggle-helper"],...s},disabled:t,label:o},e.createElement("span",{"data-toggle":"true","aria-hidden":"true",className:`${l.default.toggle} ${r?l.default.checked:""} ${t?l.default.disabled:""} `})))}));exports.Toggle=r;
+//# sourceMappingURL=Toggle.cjs.js.map

package/dist/components/Form/Toggle/Toggle.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.cjs.js","sources":["../../../../src/components/Form/Toggle/Toggle.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef } from \"react\";\nimport { Checkbox, Props as CheckboxProps } from \"../Checkbox/Checkbox\";\nimport classes from \"./Toggle.module.scss\";\n\nexport interface Props\n  extends\n    ComponentPropsWithRef<\"input\">,\n    Omit<CheckboxProps, \"indeterminate\" | \"errorMessage\" | \"error\" | \"label\"> {\n  label?: string | React.ReactElement;\n  labelPosition?: \"left\" | \"right\";\n  hideLabel?: boolean;\n  labelOverflow?: \"wrap\" | \"nowrap\";\n  version?: \"emphasis\" | \"neutral\";\n  spacing?: \"packed\" | \"between\";\n}\n\nconst ToggleComponent: ForwardRefRenderFunction<HTMLInputElement, Props> = (\n  {\n    checked,\n    disabled,\n    helperProps,\n    className,\n    label,\n    labelPosition = \"right\",\n    hideLabel = false,\n    labelOverflow = \"nowrap\",\n    version = \"emphasis\",\n    spacing = \"packed\",\n    ...rest\n  }: Props,\n  ref\n) => {\n  const classNames = [classes[\"toggle-wrapper\"]];\n  className && classNames.push(className);\n  classNames.push(classes[`toggle-wrapper--${labelPosition}`]);\n  hideLabel && classNames.push(classes[\"toggle-wrapper--hide-label\"]);\n  classNames.push(classes[`toggle-wrapper--${labelOverflow}`]);\n  classNames.push(classes[`toggle-wrapper--${version}`]);\n  classNames.push(classes[`toggle-wrapper--${spacing}`]);\n  disabled && classNames.push(classes[\"toggle-wrapper--disabled\"]);\n\n  return (\n    <div className={classNames.join(\" \")}>\n      <Checkbox\n        {...rest}\n        ref={ref}\n        checked={checked}\n        className={classes[\"checkbox\"]}\n        helperProps={{ className: classes[\"toggle-helper\"], ...helperProps }}\n        disabled={disabled}\n        label={label}\n      >\n        <span\n          data-toggle=\"true\"\n          aria-hidden=\"true\"\n          className={`${classes[\"toggle\"]} ${checked ? classes[\"checked\"] : \"\"} ${\n            disabled ? classes[\"disabled\"] : \"\"\n          } `}\n        ></span>\n      </Checkbox>\n    </div>\n  );\n};\n\nexport const Toggle = React.forwardRef(ToggleComponent);\n"],"names":["Toggle","React","forwardRef","checked","disabled","helperProps","className","label","labelPosition","hideLabel","labelOverflow","version","spacing","rest","ref","classNames","classes","push","default","join","createElement","Checkbox"],"mappings":"2LAgFaA,EAASC,EAAMC,YAhD+C,EAEvEC,UACAC,WACAC,cACAC,YACAC,QACAC,gBAAgB,QAChBC,aAAY,EACZC,gBAAgB,SAChBC,UAAU,WACVC,UAAU,YACPC,GAELC,KAEA,MAAMC,EAAa,CAACC,UAAQ,0BACfV,GAAAS,EAAWE,KAAKX,GAC7BS,EAAWE,KAAKD,EAAAE,QAAQ,mBAAmBV,MAC3CC,GAAaM,EAAWE,KAAKD,EAAQE,QAAA,+BACrCH,EAAWE,KAAKD,EAAAE,QAAQ,mBAAmBR,MAC3CK,EAAWE,KAAKD,EAAAE,QAAQ,mBAAmBP,MAC3CI,EAAWE,KAAKD,EAAAE,QAAQ,mBAAmBN,MAC3CR,GAAYW,EAAWE,KAAKD,EAAQE,QAAA,6CAGjC,MAAI,CAAAZ,UAAWS,EAAWI,KAAK,MAC9BlB,EAAAmB,cAACC,EAAAA,SAAA,IACKR,EACJC,MACAX,UACAG,UAAWU,UAAkB,SAC7BX,YAAa,CAAEC,UAAWU,EAAAA,QAAQ,oBAAqBX,GACvDD,WACAG,SAEAN,EAAAmB,cAAC,OAAA,CACC,cAAY,OACZ,cAAY,OACZd,UAAW,GAAGU,EAAAE,QAAgB,UAAKf,EAAUa,EAAAE,QAAiB,QAAI,MAChEd,EAAWY,EAAQE,QAAU,SAAI,SAIzC"}

package/dist/components/Form/Toggle/Toggle.es.js

@@ -0,0 +1,50 @@
+import React from "react";
+import { Checkbox } from "../Checkbox/Checkbox.es.js";
+import classes from "./Toggle.module.scss.es.js";
+const ToggleComponent = ({
+  checked,
+  disabled,
+  helperProps,
+  className,
+  label,
+  labelPosition = "right",
+  hideLabel = false,
+  labelOverflow = "nowrap",
+  version = "emphasis",
+  spacing = "packed",
+  ...rest
+}, ref) => {
+  const classNames = [classes["toggle-wrapper"]];
+  className && classNames.push(className);
+  classNames.push(classes[`toggle-wrapper--${labelPosition}`]);
+  hideLabel && classNames.push(classes["toggle-wrapper--hide-label"]);
+  classNames.push(classes[`toggle-wrapper--${labelOverflow}`]);
+  classNames.push(classes[`toggle-wrapper--${version}`]);
+  classNames.push(classes[`toggle-wrapper--${spacing}`]);
+  disabled && classNames.push(classes["toggle-wrapper--disabled"]);
+  return /* @__PURE__ */ React.createElement("div", { className: classNames.join(" ") }, /* @__PURE__ */ React.createElement(
+    Checkbox,
+    {
+      ...rest,
+      ref,
+      checked,
+      className: classes["checkbox"],
+      helperProps: { className: classes["toggle-helper"], ...helperProps },
+      disabled,
+      label
+    },
+    /* @__PURE__ */ React.createElement(
+      "span",
+      {
+        "data-toggle": "true",
+        "aria-hidden": "true",
+        className: `${classes["toggle"]} ${checked ? classes["checked"] : ""} ${disabled ? classes["disabled"] : ""} `
+      }
+    )
+  ));
+};
+const Toggle = React.forwardRef(ToggleComponent);
+export {
+  Toggle
+};
+//# sourceMappingURL=Toggle.es.js.map

package/dist/components/Form/Toggle/Toggle.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.es.js","sources":["../../../../src/components/Form/Toggle/Toggle.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef } from \"react\";\nimport { Checkbox, Props as CheckboxProps } from \"../Checkbox/Checkbox\";\nimport classes from \"./Toggle.module.scss\";\n\nexport interface Props\n  extends\n    ComponentPropsWithRef<\"input\">,\n    Omit<CheckboxProps, \"indeterminate\" | \"errorMessage\" | \"error\" | \"label\"> {\n  label?: string | React.ReactElement;\n  labelPosition?: \"left\" | \"right\";\n  hideLabel?: boolean;\n  labelOverflow?: \"wrap\" | \"nowrap\";\n  version?: \"emphasis\" | \"neutral\";\n  spacing?: \"packed\" | \"between\";\n}\n\nconst ToggleComponent: ForwardRefRenderFunction<HTMLInputElement, Props> = (\n  {\n    checked,\n    disabled,\n    helperProps,\n    className,\n    label,\n    labelPosition = \"right\",\n    hideLabel = false,\n    labelOverflow = \"nowrap\",\n    version = \"emphasis\",\n    spacing = \"packed\",\n    ...rest\n  }: Props,\n  ref\n) => {\n  const classNames = [classes[\"toggle-wrapper\"]];\n  className && classNames.push(className);\n  classNames.push(classes[`toggle-wrapper--${labelPosition}`]);\n  hideLabel && classNames.push(classes[\"toggle-wrapper--hide-label\"]);\n  classNames.push(classes[`toggle-wrapper--${labelOverflow}`]);\n  classNames.push(classes[`toggle-wrapper--${version}`]);\n  classNames.push(classes[`toggle-wrapper--${spacing}`]);\n  disabled && classNames.push(classes[\"toggle-wrapper--disabled\"]);\n\n  return (\n    <div className={classNames.join(\" \")}>\n      <Checkbox\n        {...rest}\n        ref={ref}\n        checked={checked}\n        className={classes[\"checkbox\"]}\n        helperProps={{ className: classes[\"toggle-helper\"], ...helperProps }}\n        disabled={disabled}\n        label={label}\n      >\n        <span\n          data-toggle=\"true\"\n          aria-hidden=\"true\"\n          className={`${classes[\"toggle\"]} ${checked ? classes[\"checked\"] : \"\"} ${\n            disabled ? classes[\"disabled\"] : \"\"\n          } `}\n        ></span>\n      </Checkbox>\n    </div>\n  );\n};\n\nexport const Toggle = React.forwardRef(ToggleComponent);\n"],"names":[],"mappings":";;;AAgCA,MAAM,kBAAqE,CACzE;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,UAAU;AAAA,EACV,UAAU;AAAA,EACV,GAAG;AACL,GACA,QACG;AACH,QAAM,aAAa,CAAC,QAAQ,gBAAgB,CAAC;AAChC,eAAA,WAAW,KAAK,SAAS;AACtC,aAAW,KAAK,QAAQ,mBAAmB,aAAa,EAAE,CAAC;AAC3D,eAAa,WAAW,KAAK,QAAQ,4BAA4B,CAAC;AAClE,aAAW,KAAK,QAAQ,mBAAmB,aAAa,EAAE,CAAC;AAC3D,aAAW,KAAK,QAAQ,mBAAmB,OAAO,EAAE,CAAC;AACrD,aAAW,KAAK,QAAQ,mBAAmB,OAAO,EAAE,CAAC;AACrD,cAAY,WAAW,KAAK,QAAQ,0BAA0B,CAAC;AAE/D,6CACG,OAAI,EAAA,WAAW,WAAW,KAAK,GAAG,KACjC,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA,WAAW,QAAQ,UAAU;AAAA,MAC7B,aAAa,EAAE,WAAW,QAAQ,eAAe,GAAG,GAAG,YAAY;AAAA,MACnE;AAAA,MACA;AAAA,IAAA;AAAA,IAEA,sBAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,eAAY;AAAA,QACZ,eAAY;AAAA,QACZ,WAAW,GAAG,QAAQ,QAAQ,CAAC,IAAI,UAAU,QAAQ,SAAS,IAAI,EAAE,IAClE,WAAW,QAAQ,UAAU,IAAI,EACnC;AAAA,MAAA;AAAA,IAAA;AAAA,EACD,CAEL;AAEJ;AAEa,MAAA,SAAS,MAAM,WAAW,eAAe;"}

package/dist/components/Form/Toggle/Toggle.module.scss.cjs.js

@@ -0,0 +1,3 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.Toggle_sr-only_7l1Pc{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.Toggle_hidden_7l1Pc{display:none}.Toggle_slide-in_7l1Pc{animation:Toggle_slide-in_7l1Pc .5s forwards}@media (prefers-reduced-motion: reduce){.Toggle_slide-in_7l1Pc{animation-duration:.1ms}}.Toggle_slide-out_7l1Pc{animation:Toggle_slide-out_7l1Pc .5s forwards}@media (prefers-reduced-motion: reduce){.Toggle_slide-out_7l1Pc{animation-duration:.1ms}}@keyframes Toggle_slide-in_7l1Pc{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes Toggle_slide-out_7l1Pc{0%{transform:translateY(0)}to{transform:translateY(100vh)}}/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the "License");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an "AS IS" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.Toggle_toggle-wrapper_7l1Pc{display:flex;align-items:center;position:relative}.Toggle_toggle-wrapper_7l1Pc label{white-space:nowrap}.Toggle_toggle-wrapper--left_7l1Pc>div>div{flex-direction:row-reverse;position:relative}.Toggle_toggle-wrapper--left_7l1Pc>div>div input{left:initial;right:0}.Toggle_toggle-wrapper--left_7l1Pc>div>div label{margin-left:0;margin-right:.5rem}.Toggle_toggle-wrapper--left_7l1Pc>div>div+div{margin-left:0}.Toggle_toggle-wrapper--hide-label_7l1Pc>div>div label{display:none}.Toggle_toggle-wrapper--hide-label_7l1Pc>div>div+div{margin-left:0}.Toggle_toggle-wrapper--wrap_7l1Pc label{white-space:normal}.Toggle_toggle-wrapper--neutral_7l1Pc input:checked+span{background-color:var(--color-blue-grey500)}.Toggle_toggle-wrapper--neutral_7l1Pc input+span:after{color:var(--color-blue-grey500)}.Toggle_toggle-wrapper--between_7l1Pc{width:100%}.Toggle_toggle-wrapper--between_7l1Pc>div{width:100%}.Toggle_toggle-wrapper--between_7l1Pc>div>div{justify-content:space-between}.Toggle_toggle-wrapper--between_7l1Pc.Toggle_toggle-wrapper--right_7l1Pc>div>div+div{margin-left:0;text-align:right}.Toggle_toggle-wrapper--disabled_7l1Pc input+span{background-color:var(--color-blue-grey50)}.Toggle_toggle-wrapper--disabled_7l1Pc input+span:before{background-color:var(--color-blue-grey200)}.Toggle_toggle-wrapper--disabled_7l1Pc input+span:after{color:var(--color-blue-grey50)}.Toggle_toggle-wrapper--disabled_7l1Pc input:checked+span{background-color:var(--color-blue-grey200)}.Toggle_toggle-wrapper--disabled_7l1Pc input:checked+span:before{background-color:var(--color-blue-grey50)}.Toggle_toggle-wrapper--disabled_7l1Pc input:checked+span:after{color:var(--color-blue-grey200)}.Toggle_toggle_7l1Pc{width:calc(2 * var(--font-size));min-width:calc(2 * var(--font-size));height:var(--font-size-big);background-color:var(--toggle-background-color);border-radius:2.5rem;position:relative;display:block;pointer-events:none;transition-property:background-color;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.Toggle_toggle_7l1Pc{transition-duration:.1ms}}.Toggle_toggle_7l1Pc:before{content:"";width:var(--font-size);height:var(--font-size);border-radius:50%;display:block;background-color:var(--light);position:absolute;top:50%;transform:translateY(-50%) translate(0);left:calc(.125 * var(--font-size));transition-property:transform;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.Toggle_toggle_7l1Pc:before{transition-duration:.1ms}}.Toggle_toggle_7l1Pc:after{content:"";font-family:icomoon;position:absolute;font-size:calc(.4375 * var(--font-size));top:47%;left:calc(.4 * var(--font-size));transform:translateY(-50%) translate(0);color:var(--color-primary);transition-property:transform;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.Toggle_toggle_7l1Pc:after{transition-duration:.1ms}}.Toggle_toggle_7l1Pc.Toggle_checked_7l1Pc{background-color:var(--color-primary)}.Toggle_toggle_7l1Pc.Toggle_checked_7l1Pc:before{transform:translateY(-50%) translate(calc(100% - .25 * var(--font-size)))}.Toggle_toggle_7l1Pc.Toggle_checked_7l1Pc:after{transform:translateY(-50%) translate(170%);content:""}.Toggle_toggle_7l1Pc.Toggle_disabled_7l1Pc{cursor:not-allowed}.Toggle_toggle-helper_7l1Pc{margin-left:2.5rem}.Toggle_checkbox_7l1Pc{z-index:10;position:static}.Toggle_checkbox_7l1Pc>div:first-child{display:flex;align-items:flex-start}.Toggle_checkbox_7l1Pc input{width:calc(2 * var(--font-size))}.Toggle_checkbox_7l1Pc input~[data-icon][aria-hidden]{display:none}.Toggle_checkbox_7l1Pc input:focus-visible+*{border-radius:2.5rem;outline-offset:.125rem;outline-width:.125rem}')),document.head.appendChild(e)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}}();
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="Toggle_hidden_7l1Pc",l="Toggle_toggle_7l1Pc",g="Toggle_checked_7l1Pc",o="Toggle_disabled_7l1Pc",r="Toggle_checkbox_7l1Pc",t={"sr-only":"Toggle_sr-only_7l1Pc",hidden:e,"slide-in":"Toggle_slide-in_7l1Pc","slide-out":"Toggle_slide-out_7l1Pc","toggle-wrapper":"Toggle_toggle-wrapper_7l1Pc","toggle-wrapper--left":"Toggle_toggle-wrapper--left_7l1Pc","toggle-wrapper--hide-label":"Toggle_toggle-wrapper--hide-label_7l1Pc","toggle-wrapper--wrap":"Toggle_toggle-wrapper--wrap_7l1Pc","toggle-wrapper--neutral":"Toggle_toggle-wrapper--neutral_7l1Pc","toggle-wrapper--between":"Toggle_toggle-wrapper--between_7l1Pc","toggle-wrapper--right":"Toggle_toggle-wrapper--right_7l1Pc","toggle-wrapper--disabled":"Toggle_toggle-wrapper--disabled_7l1Pc",toggle:l,checked:g,disabled:o,"toggle-helper":"Toggle_toggle-helper_7l1Pc",checkbox:r};exports.checkbox=r,exports.checked=g,exports.default=t,exports.disabled=o,exports.hidden=e,exports.toggle=l;
+//# sourceMappingURL=Toggle.module.scss.cjs.js.map

package/dist/components/Form/Toggle/Toggle.module.scss.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.module.scss.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}