@onewelcome/react-lib-components 6.7.1 → 7.1.0

package/dist/esm/src/hooks/useFullHeightCollapse.esm.js

@@ -0,0 +1,33 @@
+import { useState } from 'react';
+
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+const useFullHeightCollapse = (isCollapsed) => {
+    const [collapsed, setCollapsed] = useState(isCollapsed !== null && isCollapsed !== void 0 ? isCollapsed : false);
+    const handleScroll = (e) => {
+        const target = e.target;
+        const { scrollTop, scrollHeight, clientHeight } = target;
+        const position = Math.ceil((scrollTop / (scrollHeight - clientHeight)) * 100);
+        setCollapsed(position !== 0);
+    };
+    return {
+        collapsed,
+        handleScroll
+    };
+};
+
+export { useFullHeightCollapse };
+//# sourceMappingURL=useFullHeightCollapse.esm.js.map

package/dist/esm/src/hooks/useFullHeightCollapse.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFullHeightCollapse.esm.js","sources":["../../../../../../src/hooks/useFullHeightCollapse.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 { useState } from \"react\";\n\nexport const useFullHeightCollapse = (isCollapsed?: boolean) => {\n  const [collapsed, setCollapsed] = useState(isCollapsed ?? false);\n\n  const handleScroll = (e: React.UIEvent<HTMLDivElement>) => {\n    const target = e.target as HTMLDivElement;\n    const { scrollTop, scrollHeight, clientHeight } = target;\n    const position = Math.ceil((scrollTop / (scrollHeight - clientHeight)) * 100);\n    setCollapsed(position !== 0);\n  };\n\n  return {\n    collapsed,\n    handleScroll\n  };\n};\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;;;AAcG;AAIU,MAAA,qBAAqB,GAAG,CAAC,WAAqB,KAAI;AAC7D,IAAA,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,WAAW,KAAA,IAAA,IAAX,WAAW,KAAX,KAAA,CAAA,GAAA,WAAW,GAAI,KAAK,CAAC,CAAC;AAEjE,IAAA,MAAM,YAAY,GAAG,CAAC,CAAgC,KAAI;AACxD,QAAA,MAAM,MAAM,GAAG,CAAC,CAAC,MAAwB,CAAC;QAC1C,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,YAAY,EAAE,GAAG,MAAM,CAAC;AACzD,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,SAAS,IAAI,YAAY,GAAG,YAAY,CAAC,IAAI,GAAG,CAAC,CAAC;AAC9E,QAAA,YAAY,CAAC,QAAQ,KAAK,CAAC,CAAC,CAAC;AAC/B,KAAC,CAAC;IAEF,OAAO;QACL,SAAS;QACT,YAAY;KACb,CAAC;AACJ;;;;"}

package/dist/esm/src/hooks/useGetDomRoot.esm.js

@@ -1,2 +1,37 @@
-import{useState as r,useEffect as t}from"react";const e=(e,o)=>{const[n,c]=r(document.body);t((()=>{if((o===null||o===void 0?void 0:o.current)&&!e){const r=o.current.closest(".basestyling-wrapper");if(r){c(r);return}}else if(e){c(e);return}}),[o]);return{root:n}};export{e as useGetDomRoot};
+import { useState, useEffect } from 'react';
+
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+const useGetDomRoot = (passedDomRoot, relativeElement) => {
+    const [root, setRoot] = useState(document.body);
+    useEffect(() => {
+        if ((relativeElement === null || relativeElement === void 0 ? void 0 : relativeElement.current) && !passedDomRoot) {
+            const closestBaseStylingWrapper = relativeElement.current.closest(".basestyling-wrapper");
+            if (closestBaseStylingWrapper) {
+                setRoot(closestBaseStylingWrapper);
+                return;
+            }
+        }
+        else if (passedDomRoot) {
+            setRoot(passedDomRoot);
+            return;
+        }
+    }, [relativeElement]);
+    return { root };
+};
+
+export { useGetDomRoot };
 //# sourceMappingURL=useGetDomRoot.esm.js.map

package/dist/esm/src/hooks/useGetDomRoot.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useGetDomRoot.esm.js","sources":["../../../../../../src/hooks/useGetDomRoot.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\";\n\nexport const useGetDomRoot = (\n  passedDomRoot: HTMLElement | undefined,\n  relativeElement: React.RefObject<HTMLDivElement> | null\n) => {\n  const [root, setRoot] = useState<HTMLElement>(document.body);\n\n  useEffect(() => {\n    if (relativeElement?.current && !passedDomRoot) {\n      const closestBaseStylingWrapper = relativeElement.current.closest(\".basestyling-wrapper\");\n\n      if (closestBaseStylingWrapper) {\n        setRoot(closestBaseStylingWrapper as HTMLElement);\n        return;\n      }\n    } else if (passedDomRoot) {\n      setRoot(passedDomRoot);\n      return;\n    }\n  }, [relativeElement]);\n\n  return { root };\n};\n"],"names":["useGetDomRoot","passedDomRoot","relativeElement","root","setRoot","useState","document","body","useEffect","current","closestBaseStylingWrapper","closest"],"mappings":"sDAkBaA,EAAgB,CAC3BC,EACAC,KAEA,MAAOC,EAAMC,GAAWC,EAAsBC,SAASC,MAEvDC,GAAU,KACR,IAAIN,IAAA,MAAAA,SAAA,OAAA,EAAAA,EAAiBO,WAAYR,EAAe,CAC9C,MAAMS,EAA4BR,EAAgBO,QAAQE,QAAQ,wBAElE,GAAID,EAA2B,CAC7BN,EAAQM,GACR,MACD,CACF,MAAM,GAAIT,EAAe,CACxBG,EAAQH,GACR,MACD,IACA,CAACC,IAEJ,MAAO,CAAEC,OAAM"}
+{"version":3,"file":"useGetDomRoot.esm.js","sources":["../../../../../../src/hooks/useGetDomRoot.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\";\n\nexport const useGetDomRoot = (\n  passedDomRoot: HTMLElement | undefined,\n  relativeElement: React.RefObject<HTMLDivElement> | null\n) => {\n  const [root, setRoot] = useState<HTMLElement>(document.body);\n\n  useEffect(() => {\n    if (relativeElement?.current && !passedDomRoot) {\n      const closestBaseStylingWrapper = relativeElement.current.closest(\".basestyling-wrapper\");\n\n      if (closestBaseStylingWrapper) {\n        setRoot(closestBaseStylingWrapper as HTMLElement);\n        return;\n      }\n    } else if (passedDomRoot) {\n      setRoot(passedDomRoot);\n      return;\n    }\n  }, [relativeElement]);\n\n  return { root };\n};\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;;;AAcG;MAIU,aAAa,GAAG,CAC3B,aAAsC,EACtC,eAAuD,KACrD;AACF,IAAA,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAc,QAAQ,CAAC,IAAI,CAAC,CAAC;IAE7D,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAA,eAAe,KAAf,IAAA,IAAA,eAAe,KAAf,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,eAAe,CAAE,OAAO,KAAI,CAAC,aAAa,EAAE;YAC9C,MAAM,yBAAyB,GAAG,eAAe,CAAC,OAAO,CAAC,OAAO,CAAC,sBAAsB,CAAC,CAAC;YAE1F,IAAI,yBAAyB,EAAE;gBAC7B,OAAO,CAAC,yBAAwC,CAAC,CAAC;gBAClD,OAAO;aACR;SACF;aAAM,IAAI,aAAa,EAAE;YACxB,OAAO,CAAC,aAAa,CAAC,CAAC;YACvB,OAAO;SACR;AACH,KAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,OAAO,EAAE,IAAI,EAAE,CAAC;AAClB;;;;"}

package/dist/esm/src/hooks/usePosition.esm.js

@@ -1,2 +1,241 @@
-import{useState as t}from"react";import{useDebouncedCallback as i}from"./useDebouncedCallback.esm.js";var e;(function(t){t["LEFT"]="left";t["CENTER"]="center";t["CENTER_H"]="centerh";t["RIGHT"]="right"})(e||(e={}));var o;(function(t){t["TOP"]="top";t["CENTER"]="center";t["CENTER_V"]="centerv";t["BOTTOM"]="bottom"})(o||(o={}));const n={relativeElement:void 0,elementToBePositioned:void 0,transformOrigin:{horizontal:"left",vertical:"top"},placement:{horizontal:"left",vertical:"top"},offset:{top:0,right:0,bottom:0,left:0},debounceAmount:20};const r=(e=n)=>{var o;const r={...n,...e};const[l,f]=t(false);if(r.transformOrigin===void 0)r.transformOrigin=n.transformOrigin;if(r.placement===void 0)r.placement=n.placement;if(r.offset===void 0)r.offset=n.offset;const[h,d]=t({left:0,top:0,right:"initial",bottom:"initial"});const c=(t,i,e,o)=>{let n=t;if(i[e]==="left"&&n<0||i[e]==="top"&&n<0||i[e]==="center"&&n<0||i[e]==="bottom"&&n<0)n=0;if(i[e]==="left"&&n>window.innerWidth-o.width||i[e]==="center"&&e==="horizontal"&&n>window.innerWidth-o.width)n=window.innerWidth-o.width;if(i[e]==="top"&&n>window.innerHeight-o.height||i[e]==="center"&&e==="vertical"&&n>window.innerHeight-o.height)n=window.innerHeight-o.height;if(i[e]==="right"&&n>window.innerWidth-o.width)n=window.innerWidth-o.width;if(i[e]==="bottom"&&n>window.innerHeight-o.height)n=window.innerHeight-o.height;return n};const v=(t,i,e)=>{var o,n,l,f,h,d,c,v,s,a,u,g;let m=t;if(i==="horizontal"&&((o=r.offset)===null||o===void 0?void 0:o.left)!==0||i==="horizontal"&&((n=r.offset)===null||n===void 0?void 0:n.right)!==0){if(e[i]==="left"||e[i]==="center"){m+=(l=r.offset)===null||l===void 0?void 0:l.left;m-=(f=r.offset)===null||f===void 0?void 0:f.right}if(e[i]==="right"){m-=(h=r.offset)===null||h===void 0?void 0:h.left;m+=(d=r.offset)===null||d===void 0?void 0:d.right}}if(i==="vertical"&&((c=r.offset)===null||c===void 0?void 0:c.top)!==0||i==="vertical"&&((v=r.offset)===null||v===void 0?void 0:v.bottom)!==0){if(e[i]==="top"||e[i]==="center"){m+=(s=r.offset)===null||s===void 0?void 0:s.top;m-=(a=r.offset)===null||a===void 0?void 0:a.bottom}if(e[i]==="bottom"){m-=(u=r.offset)===null||u===void 0?void 0:u.top;m+=(g=r.offset)===null||g===void 0?void 0:g.bottom}}return m};const s=(t,i,e,o,n)=>{let r=0;if(t[i]==="left"||t[i]==="top")r=e[o];else if(t[i]==="center")r=e[o]-n[i==="horizontal"?"width":"height"]/2;else if(t[i]==="right"||t[i]==="bottom")r=window[i==="horizontal"?"innerWidth":"innerHeight"]-e[o];return r};const a=t=>{if(t==="horizontal")return"centerh";else if(t==="vertical")return"centerv";throw new Error(`the requested return value isn't "vertical" or "horizontal" ${t} was given.`)};const u=(t,i,e,o,n)=>{const r=i==="center"?a(e):i;const l=s(t,e,o,r,n);const f=v(l,e,t);const h=c(f,t,e,n);return h};const g=(t,i,e)=>{var o,n;const l=u(r.transformOrigin,r.placement[e],e,t,i);let f="left";let h="right";if(e==="horizontal"&&((o=r.transformOrigin)===null||o===void 0?void 0:o.horizontal)==="right"){f="right";h="left"}else if(e==="horizontal"){f="left";h="right"}if(e==="vertical"&&((n=r.transformOrigin)===null||n===void 0?void 0:n.vertical)==="bottom"){f="bottom";h="top"}else if(e==="vertical"){f="top";h="bottom"}d((t=>({...t,[f]:l,[h]:"initial"})))};const m=i((()=>{var t,i;if(!((t=r.relativeElement)===null||t===void 0?void 0:t.current)||!((i=r.elementToBePositioned)===null||i===void 0?void 0:i.current))return;const e=r.relativeElement.current.getBoundingClientRect();const o={height:r.elementToBePositioned.current.offsetHeight,width:r.elementToBePositioned.current.offsetWidth};const n={top:e.top,right:e.right,bottom:e.bottom,center:0,centerv:e.top+e.height/2,centerh:e.left+e.width/2,left:e.left,width:e.width,height:e.height,x:e.x,y:e.y};g(n,o,"horizontal");g(n,o,"vertical");if(!l)f(true)}),(o=r.debounceAmount)!==null&&o!==void 0?o:20);return{top:h.top,bottom:h.bottom,left:h.left,right:h.right,calculatePosition:m,initialCalculationDone:l}};export{e as horizontal,r as usePosition,o as vertical};
+import { useState } from 'react';
+import { useDebouncedCallback } from './useDebouncedCallback.esm.js';
+
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+var horizontal;
+(function (horizontal) {
+    horizontal["LEFT"] = "left";
+    horizontal["CENTER"] = "center";
+    horizontal["CENTER_H"] = "centerh";
+    horizontal["RIGHT"] = "right";
+})(horizontal || (horizontal = {}));
+var vertical;
+(function (vertical) {
+    vertical["TOP"] = "top";
+    vertical["CENTER"] = "center";
+    vertical["CENTER_V"] = "centerv";
+    vertical["BOTTOM"] = "bottom";
+})(vertical || (vertical = {}));
+const defaultConfigObject = {
+    relativeElement: undefined,
+    elementToBePositioned: undefined,
+    transformOrigin: {
+        horizontal: "left",
+        vertical: "top"
+    },
+    placement: {
+        horizontal: "left",
+        vertical: "top"
+    },
+    offset: {
+        top: 0,
+        right: 0,
+        bottom: 0,
+        left: 0
+    },
+    debounceAmount: 20
+};
+/* eslint-disable @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain*/
+const usePosition = (providedConfigObject = defaultConfigObject) => {
+    var _a;
+    const configObject = { ...defaultConfigObject, ...providedConfigObject };
+    const [initialCalculationDone, setInitialCalculationDone] = useState(false);
+    if (configObject.transformOrigin === undefined) {
+        configObject.transformOrigin = defaultConfigObject.transformOrigin;
+    }
+    if (configObject.placement === undefined) {
+        configObject.placement = defaultConfigObject.placement;
+    }
+    if (configObject.offset === undefined) {
+        configObject.offset = defaultConfigObject.offset;
+    }
+    const [position, setPosition] = useState({
+        left: 0,
+        top: 0,
+        right: "initial",
+        bottom: "initial"
+    });
+    const _fixPossibleViewportOverflow = (value, transformOrigin, requestedReturnValue, elDimensions) => {
+        let returnValue = value;
+        if ((transformOrigin[requestedReturnValue] === "left" && returnValue < 0) ||
+            (transformOrigin[requestedReturnValue] === "top" && returnValue < 0) ||
+            (transformOrigin[requestedReturnValue] === "center" && returnValue < 0) ||
+            (transformOrigin[requestedReturnValue] === "bottom" && returnValue < 0)) {
+            returnValue = 0;
+        }
+        if ((transformOrigin[requestedReturnValue] === "left" &&
+            returnValue > window.innerWidth - elDimensions.width) ||
+            (transformOrigin[requestedReturnValue] === "center" &&
+                requestedReturnValue === "horizontal" &&
+                returnValue > window.innerWidth - elDimensions.width)) {
+            returnValue = window.innerWidth - elDimensions.width;
+        }
+        if ((transformOrigin[requestedReturnValue] === "top" &&
+            returnValue > window.innerHeight - elDimensions.height) ||
+            (transformOrigin[requestedReturnValue] === "center" &&
+                requestedReturnValue === "vertical" &&
+                returnValue > window.innerHeight - elDimensions.height)) {
+            returnValue = window.innerHeight - elDimensions.height;
+        }
+        if (transformOrigin[requestedReturnValue] === "right" &&
+            returnValue > window.innerWidth - elDimensions.width) {
+            returnValue = window.innerWidth - elDimensions.width;
+        }
+        if (transformOrigin[requestedReturnValue] === "bottom" &&
+            returnValue > window.innerHeight - elDimensions.height) {
+            returnValue = window.innerHeight - elDimensions.height;
+        }
+        return returnValue;
+    };
+    const _applyOffsetToPlacementValue = (value, requestedReturnValue, transformOrigin) => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+        let returnValue = value;
+        if ((requestedReturnValue === "horizontal" && ((_a = configObject.offset) === null || _a === void 0 ? void 0 : _a.left) !== 0) ||
+            (requestedReturnValue === "horizontal" && ((_b = configObject.offset) === null || _b === void 0 ? void 0 : _b.right) !== 0)) {
+            if (transformOrigin[requestedReturnValue] === "left" ||
+                transformOrigin[requestedReturnValue] === "center") {
+                returnValue += (_c = configObject.offset) === null || _c === void 0 ? void 0 : _c.left;
+                returnValue -= (_d = configObject.offset) === null || _d === void 0 ? void 0 : _d.right;
+            }
+            if (transformOrigin[requestedReturnValue] === "right") {
+                returnValue -= (_e = configObject.offset) === null || _e === void 0 ? void 0 : _e.left;
+                returnValue += (_f = configObject.offset) === null || _f === void 0 ? void 0 : _f.right;
+            }
+        }
+        if ((requestedReturnValue === "vertical" && ((_g = configObject.offset) === null || _g === void 0 ? void 0 : _g.top) !== 0) ||
+            (requestedReturnValue === "vertical" && ((_h = configObject.offset) === null || _h === void 0 ? void 0 : _h.bottom) !== 0)) {
+            if (transformOrigin[requestedReturnValue] === "top" ||
+                transformOrigin[requestedReturnValue] === "center") {
+                returnValue += (_j = configObject.offset) === null || _j === void 0 ? void 0 : _j.top;
+                returnValue -= (_k = configObject.offset) === null || _k === void 0 ? void 0 : _k.bottom;
+            }
+            if (transformOrigin[requestedReturnValue] === "bottom") {
+                returnValue -= (_l = configObject.offset) === null || _l === void 0 ? void 0 : _l.top;
+                returnValue += (_m = configObject.offset) === null || _m === void 0 ? void 0 : _m.bottom;
+            }
+        }
+        return returnValue;
+    };
+    const _calculateInitialPlacementValue = (transformOrigin, requestedReturnValue, relEl, placementOriginDefinition, elDimensions) => {
+        let value = 0;
+        if (transformOrigin[requestedReturnValue] === "left" ||
+            transformOrigin[requestedReturnValue] === "top") {
+            value = relEl[placementOriginDefinition];
+        }
+        else if (transformOrigin[requestedReturnValue] === "center") {
+            value =
+                relEl[placementOriginDefinition] -
+                    elDimensions[requestedReturnValue === "horizontal" ? "width" : "height"] / 2;
+        }
+        else if (transformOrigin[requestedReturnValue] === "right" ||
+            transformOrigin[requestedReturnValue] === "bottom") {
+            value =
+                window[requestedReturnValue === "horizontal" ? "innerWidth" : "innerHeight"] -
+                    relEl[placementOriginDefinition];
+        }
+        return value;
+    };
+    /**
+     *
+     * @param requestedReturnValue whether the requested return value is for the horizontal or vertical axis
+     * @returns either the horizontally centered placement definition (centerh) or the vertically centered one (centerv)
+     */
+    const _determineCenteredPlacementOrigin = (requestedReturnValue) => {
+        if (requestedReturnValue === "horizontal") {
+            return "centerh";
+        }
+        else if (requestedReturnValue === "vertical") {
+            return "centerv";
+        }
+        throw new Error(`the requested return value isn't "vertical" or "horizontal" ${requestedReturnValue} was given.`);
+    };
+    const _calculatePlacementValue = (transformOrigin, placement, requestedReturnValue, relEl, elDimensions) => {
+        const placementOriginDefinition = placement === "center" ? _determineCenteredPlacementOrigin(requestedReturnValue) : placement;
+        const value = _calculateInitialPlacementValue(transformOrigin, requestedReturnValue, relEl, placementOriginDefinition, elDimensions);
+        const valueWithOffset = _applyOffsetToPlacementValue(value, requestedReturnValue, transformOrigin);
+        return _fixPossibleViewportOverflow(valueWithOffset, transformOrigin, requestedReturnValue, elDimensions);
+    };
+    const _calculatePlacement = (relEl, elDimensions, axis) => {
+        var _a, _b;
+        const placementValue = _calculatePlacementValue(configObject.transformOrigin, configObject.placement[axis], axis, relEl, elDimensions);
+        let direction = "left";
+        let oppositeDirection = "right";
+        if (axis === "horizontal" && ((_a = configObject.transformOrigin) === null || _a === void 0 ? void 0 : _a.horizontal) === "right") {
+            direction = "right";
+            oppositeDirection = "left";
+        }
+        else if (axis === "horizontal") {
+            direction = "left";
+            oppositeDirection = "right";
+        }
+        if (axis === "vertical" && ((_b = configObject.transformOrigin) === null || _b === void 0 ? void 0 : _b.vertical) === "bottom") {
+            direction = "bottom";
+            oppositeDirection = "top";
+        }
+        else if (axis === "vertical") {
+            direction = "top";
+            oppositeDirection = "bottom";
+        }
+        setPosition(prevState => ({
+            ...prevState,
+            [direction]: placementValue,
+            [oppositeDirection]: "initial"
+        }));
+    };
+    const calculatePosition = useDebouncedCallback(() => {
+        var _a, _b;
+        if (!((_a = configObject.relativeElement) === null || _a === void 0 ? void 0 : _a.current) || !((_b = configObject.elementToBePositioned) === null || _b === void 0 ? void 0 : _b.current)) {
+            return;
+        }
+        const relativeElRect = configObject.relativeElement
+            .current.getBoundingClientRect();
+        const elementToBePositionedDimensions = {
+            height: configObject.elementToBePositioned.current.offsetHeight,
+            width: configObject.elementToBePositioned.current.offsetWidth
+        };
+        /** We want to add a center (horizontal and vertical) property to the DOMRect object. Since it's a special object we can't modify so we clone it and add it. */
+        const clonedRelEl = {
+            top: relativeElRect.top,
+            right: relativeElRect.right,
+            bottom: relativeElRect.bottom,
+            center: 0,
+            centerv: relativeElRect.top + relativeElRect.height / 2,
+            centerh: relativeElRect.left + relativeElRect.width / 2,
+            left: relativeElRect.left,
+            width: relativeElRect.width,
+            height: relativeElRect.height,
+            x: relativeElRect.x,
+            y: relativeElRect.y
+        };
+        _calculatePlacement(clonedRelEl, elementToBePositionedDimensions, "horizontal");
+        _calculatePlacement(clonedRelEl, elementToBePositionedDimensions, "vertical");
+        if (!initialCalculationDone) {
+            setInitialCalculationDone(true);
+        }
+    }, (_a = configObject.debounceAmount) !== null && _a !== void 0 ? _a : 20);
+    return {
+        top: position.top,
+        bottom: position.bottom,
+        left: position.left,
+        right: position.right,
+        calculatePosition,
+        initialCalculationDone
+    };
+};
+
+export { horizontal, usePosition, vertical };
 //# sourceMappingURL=usePosition.esm.js.map

package/dist/esm/src/hooks/usePosition.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePosition.esm.js","sources":["../../../../../../src/hooks/usePosition.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 React, { useState } from \"react\";\nimport { useDebouncedCallback } from \"./useDebouncedCallback\";\n\nexport interface ConfigObject {\n  relativeElement: RefElement;\n  elementToBePositioned: RefElement;\n  transformOrigin?: Placement;\n  placement?: Placement;\n  offset?: Offset;\n  debounceAmount?: number;\n}\n\nexport enum horizontal {\n  LEFT = \"left\",\n  CENTER = \"center\",\n  CENTER_H = \"centerh\",\n  RIGHT = \"right\"\n}\n\nexport enum vertical {\n  TOP = \"top\",\n  CENTER = \"center\",\n  CENTER_V = \"centerv\",\n  BOTTOM = \"bottom\"\n}\n\nexport type HorizontalPlacement = `${horizontal}`;\nexport type VerticalPlacement = `${vertical}`;\n\ntype Axis = \"vertical\" | \"horizontal\";\ntype RefElement = React.RefObject<HTMLOrSVGElement> | undefined;\n\ninterface DomRectObject {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n  center: number;\n  centerh: number;\n  centerv: number;\n  width: number;\n  height: number;\n  x: number;\n  y: number;\n}\n\nexport interface Placement {\n  horizontal: HorizontalPlacement;\n  vertical: VerticalPlacement;\n}\n\nexport interface Offset {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n}\n\nexport interface Position {\n  top: PositionType;\n  right: PositionType;\n  bottom: PositionType;\n  left: PositionType;\n}\n\ninterface Dimensions {\n  height: number;\n  width: number;\n}\n\nexport type PositionType = number | \"initial\";\n\nconst defaultConfigObject: ConfigObject = {\n  relativeElement: undefined,\n  elementToBePositioned: undefined,\n  transformOrigin: {\n    horizontal: \"left\",\n    vertical: \"top\"\n  },\n  placement: {\n    horizontal: \"left\",\n    vertical: \"top\"\n  },\n  offset: {\n    top: 0,\n    right: 0,\n    bottom: 0,\n    left: 0\n  },\n  debounceAmount: 20\n};\n\n/* eslint-disable @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain*/\nexport const usePosition = (providedConfigObject: ConfigObject = defaultConfigObject) => {\n  const configObject = { ...defaultConfigObject, ...providedConfigObject };\n  const [initialCalculationDone, setInitialCalculationDone] = useState(false);\n\n  if (configObject.transformOrigin === undefined) {\n    configObject.transformOrigin = defaultConfigObject.transformOrigin;\n  }\n\n  if (configObject.placement === undefined) {\n    configObject.placement = defaultConfigObject.placement;\n  }\n\n  if (configObject.offset === undefined) {\n    configObject.offset = defaultConfigObject.offset;\n  }\n\n  const [position, setPosition] = useState<Position>({\n    left: 0,\n    top: 0,\n    right: \"initial\",\n    bottom: \"initial\"\n  });\n\n  const _fixPossibleViewportOverflow = (\n    value: number,\n    transformOrigin: Placement,\n    requestedReturnValue: Axis,\n    elDimensions: Dimensions\n  ) => {\n    let returnValue = value;\n\n    if (\n      (transformOrigin[requestedReturnValue] === \"left\" && returnValue < 0) ||\n      (transformOrigin[requestedReturnValue] === \"top\" && returnValue < 0) ||\n      (transformOrigin[requestedReturnValue] === \"center\" && returnValue < 0) ||\n      (transformOrigin[requestedReturnValue] === \"bottom\" && returnValue < 0)\n    ) {\n      returnValue = 0;\n    }\n\n    if (\n      (transformOrigin[requestedReturnValue] === \"left\" &&\n        returnValue > window.innerWidth - elDimensions.width) ||\n      (transformOrigin[requestedReturnValue] === \"center\" &&\n        requestedReturnValue === \"horizontal\" &&\n        returnValue > window.innerWidth - elDimensions.width)\n    ) {\n      returnValue = window.innerWidth - elDimensions.width;\n    }\n\n    if (\n      (transformOrigin[requestedReturnValue] === \"top\" &&\n        returnValue > window.innerHeight - elDimensions.height) ||\n      (transformOrigin[requestedReturnValue] === \"center\" &&\n        requestedReturnValue === \"vertical\" &&\n        returnValue > window.innerHeight - elDimensions.height)\n    ) {\n      returnValue = window.innerHeight - elDimensions.height;\n    }\n\n    if (\n      transformOrigin[requestedReturnValue] === \"right\" &&\n      returnValue > window.innerWidth - elDimensions.width\n    ) {\n      returnValue = window.innerWidth - elDimensions.width;\n    }\n\n    if (\n      transformOrigin[requestedReturnValue] === \"bottom\" &&\n      returnValue > window.innerHeight - elDimensions.height\n    ) {\n      returnValue = window.innerHeight - elDimensions.height;\n    }\n\n    return returnValue;\n  };\n\n  const _applyOffsetToPlacementValue = (\n    value: number,\n    requestedReturnValue: Axis,\n    transformOrigin: Placement\n  ) => {\n    let returnValue = value;\n    if (\n      (requestedReturnValue === \"horizontal\" && configObject.offset?.left !== 0) ||\n      (requestedReturnValue === \"horizontal\" && configObject.offset?.right !== 0)\n    ) {\n      if (\n        transformOrigin[requestedReturnValue] === \"left\" ||\n        transformOrigin[requestedReturnValue] === \"center\"\n      ) {\n        returnValue += configObject.offset?.left!;\n        returnValue -= configObject.offset?.right!;\n      }\n\n      if (transformOrigin[requestedReturnValue] === \"right\") {\n        returnValue -= configObject.offset?.left!;\n        returnValue += configObject.offset?.right!;\n      }\n    }\n\n    if (\n      (requestedReturnValue === \"vertical\" && configObject.offset?.top !== 0) ||\n      (requestedReturnValue === \"vertical\" && configObject.offset?.bottom !== 0)\n    ) {\n      if (\n        transformOrigin[requestedReturnValue] === \"top\" ||\n        transformOrigin[requestedReturnValue] === \"center\"\n      ) {\n        returnValue += configObject.offset?.top!;\n        returnValue -= configObject.offset?.bottom!;\n      }\n\n      if (transformOrigin[requestedReturnValue] === \"bottom\") {\n        returnValue -= configObject.offset?.top!;\n        returnValue += configObject.offset?.bottom!;\n      }\n    }\n\n    return returnValue;\n  };\n\n  const _calculateInitialPlacementValue = (\n    transformOrigin: Placement,\n    requestedReturnValue: Axis,\n    relEl: DomRectObject,\n    placementOriginDefinition: HorizontalPlacement | VerticalPlacement,\n    elDimensions: Dimensions\n  ) => {\n    let value = 0;\n\n    if (\n      transformOrigin[requestedReturnValue] === \"left\" ||\n      transformOrigin[requestedReturnValue] === \"top\"\n    ) {\n      value = relEl[placementOriginDefinition];\n    } else if (transformOrigin[requestedReturnValue] === \"center\") {\n      value =\n        relEl[placementOriginDefinition] -\n        elDimensions[requestedReturnValue === \"horizontal\" ? \"width\" : \"height\"] / 2;\n    } else if (\n      transformOrigin[requestedReturnValue] === \"right\" ||\n      transformOrigin[requestedReturnValue] === \"bottom\"\n    ) {\n      value =\n        window[requestedReturnValue === \"horizontal\" ? \"innerWidth\" : \"innerHeight\"] -\n        relEl[placementOriginDefinition];\n    }\n\n    return value;\n  };\n\n  /**\n   *\n   * @param requestedReturnValue whether the requested return value is for the horizontal or vertical axis\n   * @returns either the horizontally centered placement definition (centerh) or the vertically centered one (centerv)\n   */\n  const _determineCenteredPlacementOrigin = (requestedReturnValue: Axis) => {\n    if (requestedReturnValue === \"horizontal\") {\n      return \"centerh\";\n    } else if (requestedReturnValue === \"vertical\") {\n      return \"centerv\";\n    }\n    throw new Error(\n      `the requested return value isn't \"vertical\" or \"horizontal\" ${requestedReturnValue} was given.`\n    );\n  };\n\n  const _calculatePlacementValue = (\n    transformOrigin: Placement,\n    placement: HorizontalPlacement | VerticalPlacement,\n    requestedReturnValue: Axis,\n    relEl: DomRectObject,\n    elDimensions: Dimensions\n  ): number => {\n    const placementOriginDefinition =\n      placement === \"center\" ? _determineCenteredPlacementOrigin(requestedReturnValue) : placement;\n\n    const value = _calculateInitialPlacementValue(\n      transformOrigin,\n      requestedReturnValue,\n      relEl,\n      placementOriginDefinition,\n      elDimensions\n    );\n\n    const valueWithOffset = _applyOffsetToPlacementValue(\n      value,\n      requestedReturnValue,\n      transformOrigin\n    );\n\n    const valueCorrectionForViewportOverflow = _fixPossibleViewportOverflow(\n      valueWithOffset,\n      transformOrigin,\n      requestedReturnValue,\n      elDimensions\n    );\n\n    return valueCorrectionForViewportOverflow;\n  };\n\n  const _calculatePlacement = (relEl: DomRectObject, elDimensions: Dimensions, axis: Axis) => {\n    const placementValue = _calculatePlacementValue(\n      configObject.transformOrigin!,\n      configObject.placement![axis]!,\n      axis,\n      relEl,\n      elDimensions\n    );\n\n    let direction = \"left\";\n    let oppositeDirection = \"right\";\n\n    if (axis === \"horizontal\" && configObject.transformOrigin?.horizontal === \"right\") {\n      direction = \"right\";\n      oppositeDirection = \"left\";\n    } else if (axis === \"horizontal\") {\n      direction = \"left\";\n      oppositeDirection = \"right\";\n    }\n\n    if (axis === \"vertical\" && configObject.transformOrigin?.vertical === \"bottom\") {\n      direction = \"bottom\";\n      oppositeDirection = \"top\";\n    } else if (axis === \"vertical\") {\n      direction = \"top\";\n      oppositeDirection = \"bottom\";\n    }\n\n    setPosition(prevState => ({\n      ...prevState,\n      [direction]: placementValue,\n      [oppositeDirection]: \"initial\"\n    }));\n  };\n\n  const calculatePosition = useDebouncedCallback(() => {\n    if (!configObject.relativeElement?.current || !configObject.elementToBePositioned?.current)\n      return;\n    const relativeElRect = (configObject.relativeElement!\n      .current as HTMLElement)!.getBoundingClientRect();\n    const elementToBePositionedDimensions: Dimensions = {\n      height: (configObject.elementToBePositioned!.current as HTMLElement).offsetHeight,\n      width: (configObject.elementToBePositioned!.current as HTMLElement).offsetWidth\n    };\n\n    /** We want to add a center (horizontal and vertical) property to the DOMRect object. Since it's a special object we can't modify so we clone it and add it. */\n    const clonedRelEl = {\n      top: relativeElRect.top,\n      right: relativeElRect.right,\n      bottom: relativeElRect.bottom,\n      center: 0,\n      centerv: relativeElRect.top + relativeElRect.height / 2,\n      centerh: relativeElRect.left + relativeElRect.width / 2,\n      left: relativeElRect.left,\n      width: relativeElRect.width,\n      height: relativeElRect.height,\n      x: relativeElRect.x,\n      y: relativeElRect.y\n    };\n\n    _calculatePlacement(clonedRelEl, elementToBePositionedDimensions, \"horizontal\");\n    _calculatePlacement(clonedRelEl, elementToBePositionedDimensions, \"vertical\");\n\n    if (!initialCalculationDone) {\n      setInitialCalculationDone(true);\n    }\n  }, configObject.debounceAmount ?? 20);\n\n  return {\n    top: position.top,\n    bottom: position.bottom,\n    left: position.left,\n    right: position.right,\n    calculatePosition,\n    initialCalculationDone\n  };\n};\n"],"names":["horizontal","vertical","defaultConfigObject","relativeElement","undefined","elementToBePositioned","transformOrigin","placement","offset","top","right","bottom","left","debounceAmount","usePosition","providedConfigObject","configObject","initialCalculationDone","setInitialCalculationDone","useState","position","setPosition","_fixPossibleViewportOverflow","value","requestedReturnValue","elDimensions","returnValue","window","innerWidth","width","innerHeight","height","_applyOffsetToPlacementValue","_a","_b","_c","_d","_e","_f","_g","_h","_j","_k","_l","_m","_calculateInitialPlacementValue","relEl","placementOriginDefinition","_determineCenteredPlacementOrigin","Error","_calculatePlacementValue","valueWithOffset","valueCorrectionForViewportOverflow","_calculatePlacement","axis","placementValue","direction","oppositeDirection","prevState","calculatePosition","useDebouncedCallback","current","relativeElRect","getBoundingClientRect","elementToBePositionedDimensions","offsetHeight","offsetWidth","clonedRelEl","center","centerv","centerh","x","y"],"mappings":"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"}
+{"version":3,"file":"usePosition.esm.js","sources":["../../../../../../src/hooks/usePosition.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 React, { useState } from \"react\";\nimport { useDebouncedCallback } from \"./useDebouncedCallback\";\n\nexport interface ConfigObject {\n  relativeElement: RefElement;\n  elementToBePositioned: RefElement;\n  transformOrigin?: Placement;\n  placement?: Placement;\n  offset?: Offset;\n  debounceAmount?: number;\n}\n\nexport enum horizontal {\n  LEFT = \"left\",\n  CENTER = \"center\",\n  CENTER_H = \"centerh\",\n  RIGHT = \"right\"\n}\n\nexport enum vertical {\n  TOP = \"top\",\n  CENTER = \"center\",\n  CENTER_V = \"centerv\",\n  BOTTOM = \"bottom\"\n}\n\nexport type HorizontalPlacement = `${horizontal}`;\nexport type VerticalPlacement = `${vertical}`;\n\ntype Axis = \"vertical\" | \"horizontal\";\ntype RefElement = React.RefObject<HTMLOrSVGElement> | undefined;\n\ninterface DomRectObject {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n  center: number;\n  centerh: number;\n  centerv: number;\n  width: number;\n  height: number;\n  x: number;\n  y: number;\n}\n\nexport interface Placement {\n  horizontal: HorizontalPlacement;\n  vertical: VerticalPlacement;\n}\n\nexport interface Offset {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n}\n\nexport interface Position {\n  top: PositionType;\n  right: PositionType;\n  bottom: PositionType;\n  left: PositionType;\n}\n\ninterface Dimensions {\n  height: number;\n  width: number;\n}\n\nexport type PositionType = number | \"initial\";\n\nconst defaultConfigObject: ConfigObject = {\n  relativeElement: undefined,\n  elementToBePositioned: undefined,\n  transformOrigin: {\n    horizontal: \"left\",\n    vertical: \"top\"\n  },\n  placement: {\n    horizontal: \"left\",\n    vertical: \"top\"\n  },\n  offset: {\n    top: 0,\n    right: 0,\n    bottom: 0,\n    left: 0\n  },\n  debounceAmount: 20\n};\n\n/* eslint-disable @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain*/\nexport const usePosition = (providedConfigObject: ConfigObject = defaultConfigObject) => {\n  const configObject = { ...defaultConfigObject, ...providedConfigObject };\n  const [initialCalculationDone, setInitialCalculationDone] = useState(false);\n\n  if (configObject.transformOrigin === undefined) {\n    configObject.transformOrigin = defaultConfigObject.transformOrigin;\n  }\n\n  if (configObject.placement === undefined) {\n    configObject.placement = defaultConfigObject.placement;\n  }\n\n  if (configObject.offset === undefined) {\n    configObject.offset = defaultConfigObject.offset;\n  }\n\n  const [position, setPosition] = useState<Position>({\n    left: 0,\n    top: 0,\n    right: \"initial\",\n    bottom: \"initial\"\n  });\n\n  const _fixPossibleViewportOverflow = (\n    value: number,\n    transformOrigin: Placement,\n    requestedReturnValue: Axis,\n    elDimensions: Dimensions\n  ) => {\n    let returnValue = value;\n\n    if (\n      (transformOrigin[requestedReturnValue] === \"left\" && returnValue < 0) ||\n      (transformOrigin[requestedReturnValue] === \"top\" && returnValue < 0) ||\n      (transformOrigin[requestedReturnValue] === \"center\" && returnValue < 0) ||\n      (transformOrigin[requestedReturnValue] === \"bottom\" && returnValue < 0)\n    ) {\n      returnValue = 0;\n    }\n\n    if (\n      (transformOrigin[requestedReturnValue] === \"left\" &&\n        returnValue > window.innerWidth - elDimensions.width) ||\n      (transformOrigin[requestedReturnValue] === \"center\" &&\n        requestedReturnValue === \"horizontal\" &&\n        returnValue > window.innerWidth - elDimensions.width)\n    ) {\n      returnValue = window.innerWidth - elDimensions.width;\n    }\n\n    if (\n      (transformOrigin[requestedReturnValue] === \"top\" &&\n        returnValue > window.innerHeight - elDimensions.height) ||\n      (transformOrigin[requestedReturnValue] === \"center\" &&\n        requestedReturnValue === \"vertical\" &&\n        returnValue > window.innerHeight - elDimensions.height)\n    ) {\n      returnValue = window.innerHeight - elDimensions.height;\n    }\n\n    if (\n      transformOrigin[requestedReturnValue] === \"right\" &&\n      returnValue > window.innerWidth - elDimensions.width\n    ) {\n      returnValue = window.innerWidth - elDimensions.width;\n    }\n\n    if (\n      transformOrigin[requestedReturnValue] === \"bottom\" &&\n      returnValue > window.innerHeight - elDimensions.height\n    ) {\n      returnValue = window.innerHeight - elDimensions.height;\n    }\n\n    return returnValue;\n  };\n\n  const _applyOffsetToPlacementValue = (\n    value: number,\n    requestedReturnValue: Axis,\n    transformOrigin: Placement\n  ) => {\n    let returnValue = value;\n    if (\n      (requestedReturnValue === \"horizontal\" && configObject.offset?.left !== 0) ||\n      (requestedReturnValue === \"horizontal\" && configObject.offset?.right !== 0)\n    ) {\n      if (\n        transformOrigin[requestedReturnValue] === \"left\" ||\n        transformOrigin[requestedReturnValue] === \"center\"\n      ) {\n        returnValue += configObject.offset?.left!;\n        returnValue -= configObject.offset?.right!;\n      }\n\n      if (transformOrigin[requestedReturnValue] === \"right\") {\n        returnValue -= configObject.offset?.left!;\n        returnValue += configObject.offset?.right!;\n      }\n    }\n\n    if (\n      (requestedReturnValue === \"vertical\" && configObject.offset?.top !== 0) ||\n      (requestedReturnValue === \"vertical\" && configObject.offset?.bottom !== 0)\n    ) {\n      if (\n        transformOrigin[requestedReturnValue] === \"top\" ||\n        transformOrigin[requestedReturnValue] === \"center\"\n      ) {\n        returnValue += configObject.offset?.top!;\n        returnValue -= configObject.offset?.bottom!;\n      }\n\n      if (transformOrigin[requestedReturnValue] === \"bottom\") {\n        returnValue -= configObject.offset?.top!;\n        returnValue += configObject.offset?.bottom!;\n      }\n    }\n\n    return returnValue;\n  };\n\n  const _calculateInitialPlacementValue = (\n    transformOrigin: Placement,\n    requestedReturnValue: Axis,\n    relEl: DomRectObject,\n    placementOriginDefinition: HorizontalPlacement | VerticalPlacement,\n    elDimensions: Dimensions\n  ) => {\n    let value = 0;\n\n    if (\n      transformOrigin[requestedReturnValue] === \"left\" ||\n      transformOrigin[requestedReturnValue] === \"top\"\n    ) {\n      value = relEl[placementOriginDefinition];\n    } else if (transformOrigin[requestedReturnValue] === \"center\") {\n      value =\n        relEl[placementOriginDefinition] -\n        elDimensions[requestedReturnValue === \"horizontal\" ? \"width\" : \"height\"] / 2;\n    } else if (\n      transformOrigin[requestedReturnValue] === \"right\" ||\n      transformOrigin[requestedReturnValue] === \"bottom\"\n    ) {\n      value =\n        window[requestedReturnValue === \"horizontal\" ? \"innerWidth\" : \"innerHeight\"] -\n        relEl[placementOriginDefinition];\n    }\n\n    return value;\n  };\n\n  /**\n   *\n   * @param requestedReturnValue whether the requested return value is for the horizontal or vertical axis\n   * @returns either the horizontally centered placement definition (centerh) or the vertically centered one (centerv)\n   */\n  const _determineCenteredPlacementOrigin = (requestedReturnValue: Axis) => {\n    if (requestedReturnValue === \"horizontal\") {\n      return \"centerh\";\n    } else if (requestedReturnValue === \"vertical\") {\n      return \"centerv\";\n    }\n    throw new Error(\n      `the requested return value isn't \"vertical\" or \"horizontal\" ${requestedReturnValue} was given.`\n    );\n  };\n\n  const _calculatePlacementValue = (\n    transformOrigin: Placement,\n    placement: HorizontalPlacement | VerticalPlacement,\n    requestedReturnValue: Axis,\n    relEl: DomRectObject,\n    elDimensions: Dimensions\n  ): number => {\n    const placementOriginDefinition =\n      placement === \"center\" ? _determineCenteredPlacementOrigin(requestedReturnValue) : placement;\n\n    const value = _calculateInitialPlacementValue(\n      transformOrigin,\n      requestedReturnValue,\n      relEl,\n      placementOriginDefinition,\n      elDimensions\n    );\n\n    const valueWithOffset = _applyOffsetToPlacementValue(\n      value,\n      requestedReturnValue,\n      transformOrigin\n    );\n\n    return _fixPossibleViewportOverflow(\n      valueWithOffset,\n      transformOrigin,\n      requestedReturnValue,\n      elDimensions\n    );\n  };\n\n  const _calculatePlacement = (relEl: DomRectObject, elDimensions: Dimensions, axis: Axis) => {\n    const placementValue = _calculatePlacementValue(\n      configObject.transformOrigin!,\n      configObject.placement![axis]!,\n      axis,\n      relEl,\n      elDimensions\n    );\n\n    let direction = \"left\";\n    let oppositeDirection = \"right\";\n\n    if (axis === \"horizontal\" && configObject.transformOrigin?.horizontal === \"right\") {\n      direction = \"right\";\n      oppositeDirection = \"left\";\n    } else if (axis === \"horizontal\") {\n      direction = \"left\";\n      oppositeDirection = \"right\";\n    }\n\n    if (axis === \"vertical\" && configObject.transformOrigin?.vertical === \"bottom\") {\n      direction = \"bottom\";\n      oppositeDirection = \"top\";\n    } else if (axis === \"vertical\") {\n      direction = \"top\";\n      oppositeDirection = \"bottom\";\n    }\n\n    setPosition(prevState => ({\n      ...prevState,\n      [direction]: placementValue,\n      [oppositeDirection]: \"initial\"\n    }));\n  };\n\n  const calculatePosition = useDebouncedCallback(() => {\n    if (!configObject.relativeElement?.current || !configObject.elementToBePositioned?.current) {\n      return;\n    }\n    const relativeElRect = (configObject.relativeElement!\n      .current as HTMLElement)!.getBoundingClientRect();\n    const elementToBePositionedDimensions: Dimensions = {\n      height: (configObject.elementToBePositioned!.current as HTMLElement).offsetHeight,\n      width: (configObject.elementToBePositioned!.current as HTMLElement).offsetWidth\n    };\n\n    /** We want to add a center (horizontal and vertical) property to the DOMRect object. Since it's a special object we can't modify so we clone it and add it. */\n    const clonedRelEl = {\n      top: relativeElRect.top,\n      right: relativeElRect.right,\n      bottom: relativeElRect.bottom,\n      center: 0,\n      centerv: relativeElRect.top + relativeElRect.height / 2,\n      centerh: relativeElRect.left + relativeElRect.width / 2,\n      left: relativeElRect.left,\n      width: relativeElRect.width,\n      height: relativeElRect.height,\n      x: relativeElRect.x,\n      y: relativeElRect.y\n    };\n\n    _calculatePlacement(clonedRelEl, elementToBePositionedDimensions, \"horizontal\");\n    _calculatePlacement(clonedRelEl, elementToBePositionedDimensions, \"vertical\");\n\n    if (!initialCalculationDone) {\n      setInitialCalculationDone(true);\n    }\n  }, configObject.debounceAmount ?? 20);\n\n  return {\n    top: position.top,\n    bottom: position.bottom,\n    left: position.left,\n    right: position.right,\n    calculatePosition,\n    initialCalculationDone\n  };\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/src/hooks/useRepeater.esm.js

@@ -1,2 +1,40 @@
-import e,{useState as t,useEffect as o}from"react";import{generateID as n}from"../util/helper.esm.js";const r=({componentToRepeat:r})=>{const[c,m]=t([]);o((()=>{p()}),[]);const p=()=>{const t=e.cloneElement(r,{key:n(20)});m((e=>[...e,t]))};const s=e=>{const t=c.filter((t=>t!==e));m(t)};return{repeatedComponents:c,repeat:p,remove:s}};export{r as useRepeater};
+import React, { useState, useEffect } from 'react';
+import { generateID } from '../util/helper.esm.js';
+
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+const useRepeater = ({ componentToRepeat }) => {
+    const [repeatedComponents, setRepeatedComponents] = useState([]);
+    useEffect(() => {
+        repeat();
+    }, []);
+    const repeat = () => {
+        const clonedComponent = React.cloneElement(componentToRepeat, { key: generateID(20) });
+        setRepeatedComponents(prevState => [...prevState, clonedComponent]);
+    };
+    const remove = (componentToRemove) => {
+        const newRepeatedComponents = repeatedComponents.filter(component => component !== componentToRemove);
+        setRepeatedComponents(newRepeatedComponents);
+    };
+    return {
+        repeatedComponents,
+        repeat,
+        remove
+    };
+};
+
+export { useRepeater };
 //# sourceMappingURL=useRepeater.esm.js.map

package/dist/esm/src/hooks/useRepeater.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRepeater.esm.js","sources":["../../../../../../src/hooks/useRepeater.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 React, { useEffect, useState, JSX } from \"react\";\nimport { generateID } from \"../util/helper\";\n\ninterface Arguments {\n  componentToRepeat: React.ReactElement;\n}\n\nexport const useRepeater = <T>({ componentToRepeat }: Arguments) => {\n  const [repeatedComponents, setRepeatedComponents] = useState<JSX.Element[]>([]);\n\n  useEffect(() => {\n    repeat();\n  }, []);\n\n  const repeat = () => {\n    const clonedComponent = React.cloneElement(componentToRepeat, { key: generateID(20) });\n\n    setRepeatedComponents(prevState => [...prevState, clonedComponent]);\n  };\n\n  const remove = (componentToRemove: React.ReactElement<T>) => {\n    const newRepeatedComponents = repeatedComponents.filter(\n      component => component !== componentToRemove\n    );\n\n    setRepeatedComponents(newRepeatedComponents);\n  };\n\n  return {\n    repeatedComponents,\n    repeat,\n    remove\n  };\n};\n"],"names":["useRepeater","componentToRepeat","repeatedComponents","setRepeatedComponents","useState","useEffect","repeat","clonedComponent","React","cloneElement","key","generateID","prevState","remove","componentToRemove","newRepeatedComponents","filter","component"],"mappings":"4GAuBaA,EAAc,EAAMC,wBAC/B,MAAOC,EAAoBC,GAAyBC,EAAwB,IAE5EC,GAAU,KACRC,GAAQ,GACP,IAEH,MAAMA,EAAS,KACb,MAAMC,EAAkBC,EAAMC,aAAaR,EAAmB,CAAES,IAAKC,EAAW,MAEhFR,GAAsBS,GAAa,IAAIA,EAAWL,IAAiB,EAGrE,MAAMM,EAAUC,IACd,MAAMC,EAAwBb,EAAmBc,QAC/CC,GAAaA,IAAcH,IAG7BX,EAAsBY,EAAsB,EAG9C,MAAO,CACLb,qBACAI,SACAO,SACD"}
+{"version":3,"file":"useRepeater.esm.js","sources":["../../../../../../src/hooks/useRepeater.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 React, { useEffect, useState, JSX } from \"react\";\nimport { generateID } from \"../util/helper\";\n\ninterface Arguments {\n  componentToRepeat: React.ReactElement;\n}\n\nexport const useRepeater = <T>({ componentToRepeat }: Arguments) => {\n  const [repeatedComponents, setRepeatedComponents] = useState<JSX.Element[]>([]);\n\n  useEffect(() => {\n    repeat();\n  }, []);\n\n  const repeat = () => {\n    const clonedComponent = React.cloneElement(componentToRepeat, { key: generateID(20) });\n\n    setRepeatedComponents(prevState => [...prevState, clonedComponent]);\n  };\n\n  const remove = (componentToRemove: React.ReactElement<T>) => {\n    const newRepeatedComponents = repeatedComponents.filter(\n      component => component !== componentToRemove\n    );\n\n    setRepeatedComponents(newRepeatedComponents);\n  };\n\n  return {\n    repeatedComponents,\n    repeat,\n    remove\n  };\n};\n"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;AAcG;MASU,WAAW,GAAG,CAAI,EAAE,iBAAiB,EAAa,KAAI;IACjE,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAgB,EAAE,CAAC,CAAC;IAEhF,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,EAAE,CAAC;KACV,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,MAAM,GAAG,MAAK;AAClB,QAAA,MAAM,eAAe,GAAG,KAAK,CAAC,YAAY,CAAC,iBAAiB,EAAE,EAAE,GAAG,EAAE,UAAU,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;AAEvF,QAAA,qBAAqB,CAAC,SAAS,IAAI,CAAC,GAAG,SAAS,EAAE,eAAe,CAAC,CAAC,CAAC;AACtE,KAAC,CAAC;AAEF,IAAA,MAAM,MAAM,GAAG,CAAC,iBAAwC,KAAI;AAC1D,QAAA,MAAM,qBAAqB,GAAG,kBAAkB,CAAC,MAAM,CACrD,SAAS,IAAI,SAAS,KAAK,iBAAiB,CAC7C,CAAC;QAEF,qBAAqB,CAAC,qBAAqB,CAAC,CAAC;AAC/C,KAAC,CAAC;IAEF,OAAO;QACL,kBAAkB;QAClB,MAAM;QACN,MAAM;KACP,CAAC;AACJ;;;;"}

package/dist/esm/src/hooks/useSpacing.esm.js

@@ -1,2 +1,33 @@
-const r=.25;const t="rem";const n=/(\d+\.?\d*)+/g;const e=(e,o)=>{if(e)return Object.entries(e).reduce(((e,[o,c])=>{const s=String(c).matchAll(n);const u=Array.from(s).map((([n])=>`${Number(n)*r}${t}`)).join(" ");return{...e,[o]:u}}),o!==null&&o!==void 0?o:{});return o};export{e as useSpacing};
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+const defaultFactor = 0.25;
+const defaultUnit = "rem";
+const spacingNumberRegex = /(\d+\.?\d*)+/g;
+const useSpacing = (spacingProps, style) => {
+    if (spacingProps) {
+        return Object.entries(spacingProps).reduce((prev, [spacing, multiplier]) => {
+            const matches = String(multiplier).matchAll(spacingNumberRegex);
+            const cssSpacingValue = Array.from(matches)
+                .map(([multiplierValue]) => `${Number(multiplierValue) * defaultFactor}${defaultUnit}`)
+                .join(" ");
+            return { ...prev, [spacing]: cssSpacingValue };
+        }, style !== null && style !== void 0 ? style : {});
+    }
+    return style;
+};
+
+export { useSpacing };
 //# sourceMappingURL=useSpacing.esm.js.map

package/dist/esm/src/hooks/useSpacing.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSpacing.esm.js","sources":["../../../../../../src/hooks/useSpacing.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 { CSSProperties } from \"react\";\n\nexport type SpacingMultiplier = 0 | 0.5 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;\ntype SpacingMultiplierStringOrNumber = `${SpacingMultiplier}` | SpacingMultiplier;\ntype MultiValueSpacingMultiplier =\n  | `${SpacingMultiplier} ${SpacingMultiplier} ${SpacingMultiplier} ${SpacingMultiplier}`\n  | `${SpacingMultiplier} ${SpacingMultiplier} ${SpacingMultiplier}`\n  | `${SpacingMultiplier} ${SpacingMultiplier}`\n  | SpacingMultiplierStringOrNumber;\n\nexport interface Spacing {\n  padding?: MultiValueSpacingMultiplier;\n  paddingTop?: SpacingMultiplierStringOrNumber;\n  paddingBottom?: SpacingMultiplierStringOrNumber;\n  paddingLeft?: SpacingMultiplierStringOrNumber;\n  paddingRight?: SpacingMultiplierStringOrNumber;\n  margin?: MultiValueSpacingMultiplier;\n  marginTop?: SpacingMultiplierStringOrNumber;\n  marginBottom?: SpacingMultiplierStringOrNumber;\n  marginLeft?: SpacingMultiplierStringOrNumber;\n  marginRight?: SpacingMultiplierStringOrNumber;\n}\n\nconst defaultFactor = 0.25;\nconst defaultUnit = \"rem\";\nconst spacingNumberRegex = /(\\d+\\.?\\d*)+/g;\n\nexport const useSpacing = (\n  spacingProps?: Spacing,\n  style?: CSSProperties\n): CSSProperties | undefined => {\n  if (spacingProps) {\n    return Object.entries(spacingProps).reduce<CSSProperties>((prev, [spacing, multiplier]) => {\n      const matches = String(multiplier).matchAll(spacingNumberRegex);\n      const cssSpacingValue = Array.from(matches)\n        .map(([multiplierValue]) => `${Number(multiplierValue) * defaultFactor}${defaultUnit}`)\n        .join(\" \");\n      return { ...prev, [spacing]: cssSpacingValue };\n    }, style ?? {});\n  }\n  return style;\n};\n"],"names":["defaultFactor","defaultUnit","spacingNumberRegex","useSpacing","spacingProps","style","Object","entries","reduce","prev","spacing","multiplier","matches","String","matchAll","cssSpacingValue","Array","from","map","multiplierValue","Number","join"],"mappings":"AAuCA,MAAMA,EAAgB,IACtB,MAAMC,EAAc,MACpB,MAAMC,EAAqB,sBAEdC,EAAa,CACxBC,EACAC,KAEA,GAAID,EACF,OAAOE,OAAOC,QAAQH,GAAcI,QAAsB,CAACC,GAAOC,EAASC,MACzE,MAAMC,EAAUC,OAAOF,GAAYG,SAASZ,GAC5C,MAAMa,EAAkBC,MAAMC,KAAKL,GAChCM,KAAI,EAAEC,KAAqB,GAAGC,OAAOD,GAAmBnB,IAAgBC,MACxEoB,KAAK,KACR,MAAO,IAAKZ,EAAMC,CAACA,GAAUK,EAAiB,GAC7CV,IAAA,MAAAA,WAAAA,EAAS,CAAA,GAEd,OAAOA,CAAK"}
+{"version":3,"file":"useSpacing.esm.js","sources":["../../../../../../src/hooks/useSpacing.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 { CSSProperties } from \"react\";\n\nexport type SpacingMultiplier = 0 | 0.5 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;\ntype SpacingMultiplierStringOrNumber = `${SpacingMultiplier}` | SpacingMultiplier;\ntype MultiValueSpacingMultiplier =\n  | `${SpacingMultiplier} ${SpacingMultiplier} ${SpacingMultiplier} ${SpacingMultiplier}`\n  | `${SpacingMultiplier} ${SpacingMultiplier} ${SpacingMultiplier}`\n  | `${SpacingMultiplier} ${SpacingMultiplier}`\n  | SpacingMultiplierStringOrNumber;\n\nexport interface Spacing {\n  padding?: MultiValueSpacingMultiplier;\n  paddingTop?: SpacingMultiplierStringOrNumber;\n  paddingBottom?: SpacingMultiplierStringOrNumber;\n  paddingLeft?: SpacingMultiplierStringOrNumber;\n  paddingRight?: SpacingMultiplierStringOrNumber;\n  margin?: MultiValueSpacingMultiplier;\n  marginTop?: SpacingMultiplierStringOrNumber;\n  marginBottom?: SpacingMultiplierStringOrNumber;\n  marginLeft?: SpacingMultiplierStringOrNumber;\n  marginRight?: SpacingMultiplierStringOrNumber;\n}\n\nconst defaultFactor = 0.25;\nconst defaultUnit = \"rem\";\nconst spacingNumberRegex = /(\\d+\\.?\\d*)+/g;\n\nexport const useSpacing = (\n  spacingProps?: Spacing,\n  style?: CSSProperties\n): CSSProperties | undefined => {\n  if (spacingProps) {\n    return Object.entries(spacingProps).reduce<CSSProperties>((prev, [spacing, multiplier]) => {\n      const matches = String(multiplier).matchAll(spacingNumberRegex);\n      const cssSpacingValue = Array.from(matches)\n        .map(([multiplierValue]) => `${Number(multiplierValue) * defaultFactor}${defaultUnit}`)\n        .join(\" \");\n      return { ...prev, [spacing]: cssSpacingValue };\n    }, style ?? {});\n  }\n  return style;\n};\n"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;AAcG;AAyBH,MAAM,aAAa,GAAG,IAAI,CAAC;AAC3B,MAAM,WAAW,GAAG,KAAK,CAAC;AAC1B,MAAM,kBAAkB,GAAG,eAAe,CAAC;MAE9B,UAAU,GAAG,CACxB,YAAsB,EACtB,KAAqB,KACQ;IAC7B,IAAI,YAAY,EAAE;AAChB,QAAA,OAAO,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,MAAM,CAAgB,CAAC,IAAI,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,KAAI;YACxF,MAAM,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,QAAQ,CAAC,kBAAkB,CAAC,CAAC;AAChE,YAAA,MAAM,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC;AACxC,iBAAA,GAAG,CAAC,CAAC,CAAC,eAAe,CAAC,KAAK,CAAA,EAAG,MAAM,CAAC,eAAe,CAAC,GAAG,aAAa,CAAG,EAAA,WAAW,EAAE,CAAC;iBACtF,IAAI,CAAC,GAAG,CAAC,CAAC;YACb,OAAO,EAAE,GAAG,IAAI,EAAE,CAAC,OAAO,GAAG,eAAe,EAAE,CAAC;SAChD,EAAE,KAAK,KAAL,IAAA,IAAA,KAAK,cAAL,KAAK,GAAI,EAAE,CAAC,CAAC;KACjB;AACD,IAAA,OAAO,KAAK,CAAC;AACf;;;;"}

package/dist/esm/src/hooks/useWrapper.esm.js

@@ -1,2 +1,34 @@
-import{useState as o}from"react";import{generateID as r}from"../util/helper.esm.js";const s=()=>{const[s]=o(r(20));const[e]=o(r(20));const[t]=o(r(20));const[c,l]=o(false);return{helperId:s,errorId:e,labelId:t,hasFocus:c,setHasFocus:l}};export{s as useWrapper};
+import { useState } from 'react';
+import { generateID } from '../util/helper.esm.js';
+
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+const useWrapper = () => {
+    const [helperId] = useState(generateID(20));
+    const [errorId] = useState(generateID(20));
+    const [labelId] = useState(generateID(20));
+    const [hasFocus, setHasFocus] = useState(false);
+    return {
+        helperId,
+        errorId,
+        labelId,
+        hasFocus,
+        setHasFocus
+    };
+};
+
+export { useWrapper };
 //# sourceMappingURL=useWrapper.esm.js.map

package/dist/esm/src/hooks/useWrapper.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useWrapper.esm.js","sources":["../../../../../../src/hooks/useWrapper.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 { useState } from \"react\";\nimport { generateID } from \"../util/helper\";\n\nexport const useWrapper = () => {\n  const [helperId] = useState(generateID(20));\n  const [errorId] = useState(generateID(20));\n  const [labelId] = useState(generateID(20));\n  const [hasFocus, setHasFocus] = useState(false);\n\n  return {\n    helperId,\n    errorId,\n    labelId,\n    hasFocus,\n    setHasFocus\n  };\n};\n"],"names":["useWrapper","helperId","useState","generateID","errorId","labelId","hasFocus","setHasFocus"],"mappings":"oFAmBO,MAAMA,EAAa,KACxB,MAAOC,GAAYC,EAASC,EAAW,KACvC,MAAOC,GAAWF,EAASC,EAAW,KACtC,MAAOE,GAAWH,EAASC,EAAW,KACtC,MAAOG,EAAUC,GAAeL,EAAS,OAEzC,MAAO,CACLD,WACAG,UACAC,UACAC,WACAC,cACD"}
+{"version":3,"file":"useWrapper.esm.js","sources":["../../../../../../src/hooks/useWrapper.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 { useState } from \"react\";\nimport { generateID } from \"../util/helper\";\n\nexport const useWrapper = () => {\n  const [helperId] = useState(generateID(20));\n  const [errorId] = useState(generateID(20));\n  const [labelId] = useState(generateID(20));\n  const [hasFocus, setHasFocus] = useState(false);\n\n  return {\n    helperId,\n    errorId,\n    labelId,\n    hasFocus,\n    setHasFocus\n  };\n};\n"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;AAcG;AAKI,MAAM,UAAU,GAAG,MAAK;IAC7B,MAAM,CAAC,QAAQ,CAAC,GAAG,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,CAAC;IAC5C,MAAM,CAAC,OAAO,CAAC,GAAG,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,CAAC;IAC3C,MAAM,CAAC,OAAO,CAAC,GAAG,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,CAAC;IAC3C,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhD,OAAO;QACL,QAAQ;QACR,OAAO;QACP,OAAO;QACP,QAAQ;QACR,WAAW;KACZ,CAAC;AACJ;;;;"}