@onewelcome/react-lib-components 9.8.1 → 10.0.0

package/dist/components/Stepper/Stepper.es.js

@@ -0,0 +1,30 @@
+import React from "react";
+import { Step } from "./Step.es.js";
+import classes from "./Stepper.module.scss.es.js";
+const Stepper = ({
+  steps,
+  direction = "horizontal",
+  textPosition,
+  className,
+  ...rest
+}) => {
+  const additionalClasses = [];
+  direction === "horizontal" && additionalClasses.push(classes["horizontal"]);
+  textPosition === "bottom" && additionalClasses.push(classes["text-bottom"]);
+  className && additionalClasses.push(className);
+  return /* @__PURE__ */ React.createElement("div", { ...rest, className: `${classes["stepper"]} ${additionalClasses.join(" ")}` }, steps.map((step, index) => /* @__PURE__ */ React.createElement(
+    Step,
+    {
+      ...step,
+      key: step.label.toLowerCase().replace(/\s/, "-"),
+      index,
+      direction,
+      lastStep: index + 1 === steps.length,
+      textPosition
+    }
+  )));
+};
+export {
+  Stepper
+};
+//# sourceMappingURL=Stepper.es.js.map

package/dist/components/Stepper/Stepper.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stepper.es.js","sources":["../../../src/components/Stepper/Stepper.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, { ComponentPropsWithRef } from \"react\";\nimport { Step, Props as StepProps } from \"./Step\";\nimport classes from \"./Stepper.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  steps: StepProps[];\n  direction: \"horizontal\" | \"vertical\";\n  textPosition?: \"bottom\" | \"right\";\n}\n\nexport const Stepper = ({\n  steps,\n  direction = \"horizontal\",\n  textPosition,\n  className,\n  ...rest\n}: Props) => {\n  const additionalClasses = [];\n  direction === \"horizontal\" && additionalClasses.push(classes[\"horizontal\"]);\n  textPosition === \"bottom\" && additionalClasses.push(classes[\"text-bottom\"]);\n  className && additionalClasses.push(className);\n\n  return (\n    <div {...rest} className={`${classes[\"stepper\"]} ${additionalClasses.join(\" \")}`}>\n      {steps.map((step, index) => (\n        <Step\n          {...step}\n          key={step.label.toLowerCase().replace(/\\s/, \"-\")}\n          index={index}\n          direction={direction}\n          lastStep={index + 1 === steps.length}\n          textPosition={textPosition}\n        />\n      ))}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;AA0BO,MAAM,UAAU,CAAC;AAAA,EACtB;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAa;AACX,QAAM,oBAAoB,CAAC;AAC3B,gBAAc,gBAAgB,kBAAkB,KAAK,QAAQ,YAAY,CAAC;AAC1E,mBAAiB,YAAY,kBAAkB,KAAK,QAAQ,aAAa,CAAC;AAC7D,eAAA,kBAAkB,KAAK,SAAS;AAE7C,6CACG,OAAK,EAAA,GAAG,MAAM,WAAW,GAAG,QAAQ,SAAS,CAAC,IAAI,kBAAkB,KAAK,GAAG,CAAC,MAC3E,MAAM,IAAI,CAAC,MAAM,UAChB,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK,KAAK,MAAM,YAAc,EAAA,QAAQ,MAAM,GAAG;AAAA,MAC/C;AAAA,MACA;AAAA,MACA,UAAU,QAAQ,MAAM,MAAM;AAAA,MAC9B;AAAA,IAAA;AAAA,EAAA,CAEH,CACH;AAEJ;"}

package/dist/components/Stepper/Stepper.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(".Stepper_stepper_E7GBT{display:flex;gap:.5rem;justify-content:flex-start;width:auto;flex-direction:column}.Stepper_stepper_E7GBT.Stepper_horizontal_E7GBT{justify-content:center;flex-direction:row;width:100%}.Stepper_stepper_E7GBT.Stepper_horizontal_E7GBT.Stepper_text-bottom_E7GBT{gap:0}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}}();
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="Stepper_stepper_E7GBT",t="Stepper_horizontal_E7GBT",o={stepper:e,horizontal:t,"text-bottom":"Stepper_text-bottom_E7GBT"};exports.default=o,exports.horizontal=t,exports.stepper=e;
+//# sourceMappingURL=Stepper.module.scss.cjs.js.map

package/dist/components/Stepper/Stepper.module.scss.es.js

@@ -0,0 +1,14 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode(".Stepper_stepper_E7GBT{display:flex;gap:.5rem;justify-content:flex-start;width:auto;flex-direction:column}.Stepper_stepper_E7GBT.Stepper_horizontal_E7GBT{justify-content:center;flex-direction:row;width:100%}.Stepper_stepper_E7GBT.Stepper_horizontal_E7GBT.Stepper_text-bottom_E7GBT{gap:0}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}}();
+const stepper = "Stepper_stepper_E7GBT";
+const horizontal = "Stepper_horizontal_E7GBT";
+const classes = {
+  stepper,
+  horizontal,
+  "text-bottom": "Stepper_text-bottom_E7GBT"
+};
+export {
+  classes as default,
+  horizontal,
+  stepper
+};
+//# sourceMappingURL=Stepper.module.scss.es.js.map

package/dist/components/Stepper/Stepper.module.scss.es.js.map

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

package/dist/components/Tabs/Tab.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=require("./Tab.module.scss.cjs.js");exports.Tab=({children:a,tabActive:r,...s})=>e.createElement("div",{...s,"aria-hidden":!r,role:"tabpanel",className:`${t.default.tab} ${r?t.default.selected:""} ${s.className??""}`},a);
+//# sourceMappingURL=Tab.cjs.js.map

package/dist/components/Tabs/Tab.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.cjs.js","sources":["../../../src/components/Tabs/Tab.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, { HTMLProps } from \"react\";\nimport classes from \"./Tab.module.scss\";\n\nexport interface Props extends Omit<HTMLProps<HTMLDivElement>, \"children\"> {\n  title: string;\n  /* eslint-disable-next-line @typescript-eslint/no-explicit-any */\n  children?: any;\n  tabActive?: boolean;\n  icon?: React.ReactNode;\n}\n\nexport const Tab = ({ children, tabActive, ...rest }: Props) => {\n  return (\n    <div\n      {...rest}\n      aria-hidden={!tabActive}\n      role=\"tabpanel\"\n      className={`${classes[\"tab\"]} ${tabActive ? classes[\"selected\"] : \"\"} ${\n        rest.className ?? \"\"\n      }`}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["children","tabActive","rest","React","createElement","role","className","classes","default"],"mappings":"2JA2BmB,EAAGA,WAAUC,eAAcC,KAE1CC,EAAAC,cAAC,MAAA,IACKF,EACJ,eAAcD,EACdI,KAAK,WACLC,UAAW,GAAGC,EAAAA,QAAa,OAAKN,EAAYM,EAAQC,QAAU,SAAI,MAChEN,EAAKI,WAAa,MAGnBN"}

package/dist/components/Tabs/Tab.es.js

@@ -0,0 +1,18 @@
+import React from "react";
+import classes from "./Tab.module.scss.es.js";
+const Tab = ({ children, tabActive, ...rest }) => {
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      ...rest,
+      "aria-hidden": !tabActive,
+      role: "tabpanel",
+      className: `${classes["tab"]} ${tabActive ? classes["selected"] : ""} ${rest.className ?? ""}`
+    },
+    children
+  );
+};
+export {
+  Tab
+};
+//# sourceMappingURL=Tab.es.js.map

package/dist/components/Tabs/Tab.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.es.js","sources":["../../../src/components/Tabs/Tab.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, { HTMLProps } from \"react\";\nimport classes from \"./Tab.module.scss\";\n\nexport interface Props extends Omit<HTMLProps<HTMLDivElement>, \"children\"> {\n  title: string;\n  /* eslint-disable-next-line @typescript-eslint/no-explicit-any */\n  children?: any;\n  tabActive?: boolean;\n  icon?: React.ReactNode;\n}\n\nexport const Tab = ({ children, tabActive, ...rest }: Props) => {\n  return (\n    <div\n      {...rest}\n      aria-hidden={!tabActive}\n      role=\"tabpanel\"\n      className={`${classes[\"tab\"]} ${tabActive ? classes[\"selected\"] : \"\"} ${\n        rest.className ?? \"\"\n      }`}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;AA2BO,MAAM,MAAM,CAAC,EAAE,UAAU,WAAW,GAAG,WAAkB;AAE5D,SAAA,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAa,CAAC;AAAA,MACd,MAAK;AAAA,MACL,WAAW,GAAG,QAAQ,KAAK,CAAC,IAAI,YAAY,QAAQ,UAAU,IAAI,EAAE,IAClE,KAAK,aAAa,EACpB;AAAA,IAAA;AAAA,IAEC;AAAA,EACH;AAEJ;"}

package/dist/components/Tabs/Tab.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('/*!\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 */.Tab_tab_E7GBT{display:none}.Tab_tab_E7GBT:focus-visible{outline-color:var(--color-focus)}.Tab_tab_E7GBT.Tab_selected_E7GBT{display:block}')),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="Tab_tab_E7GBT",t="Tab_selected_E7GBT",s={tab:e,selected:t};exports.default=s,exports.selected=t,exports.tab=e;
+//# sourceMappingURL=Tab.module.scss.cjs.js.map

package/dist/components/Tabs/Tab.module.scss.es.js

@@ -0,0 +1,13 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('/*!\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 */.Tab_tab_E7GBT{display:none}.Tab_tab_E7GBT:focus-visible{outline-color:var(--color-focus)}.Tab_tab_E7GBT.Tab_selected_E7GBT{display:block}')),document.head.appendChild(e)}}catch(n){console.error("vite-plugin-css-injected-by-js",n)}}();
+const tab = "Tab_tab_E7GBT";
+const selected = "Tab_selected_E7GBT";
+const classes = {
+  tab,
+  selected
+};
+export {
+  classes as default,
+  selected,
+  tab
+};
+//# sourceMappingURL=Tab.module.scss.es.js.map

package/dist/components/Tabs/Tab.module.scss.es.js.map

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

package/dist/components/Tabs/TabButton.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=require("./TabButton.module.scss.cjs.js"),u=e.forwardRef((({children:u,tabActive:r,focused:c,title:o,fluid:s,icon:n,iconPosition:a,className:l,...i},f)=>{const d=f||e.createRef();e.useEffect((()=>{c&&d.current&&d.current.focus()}),[d.current,c]);const b=[t.default.tabbutton];return r&&b.push(t.default.selected),s&&b.push(t.default.fluid),l&&b.push(l),n&&b.push(t.default["has-icon"],t.default[`${a}-icon`]),e.createElement("button",{...i,className:b.join(" "),ref:d,role:"tab",type:"button"},u,n&&e.createElement("i",null,n))}));exports.TabButton=u;
+//# sourceMappingURL=TabButton.cjs.js.map

package/dist/components/Tabs/TabButton.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabButton.cjs.js","sources":["../../../src/components/Tabs/TabButton.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, {\n  ForwardRefRenderFunction,\n  ComponentPropsWithRef,\n  createRef,\n  RefObject,\n  useEffect\n} from \"react\";\nimport classes from \"./TabButton.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"button\"> {\n  tabActive?: boolean;\n  focused?: boolean;\n  fluid?: boolean;\n  icon?: React.ReactNode;\n  iconPosition?: \"left\" | \"right\" | \"top\" | \"bottom\";\n}\n\nconst TabButtonComponent: ForwardRefRenderFunction<HTMLButtonElement, Props> = (\n  { children, tabActive, focused, title, fluid, icon, iconPosition, className, ...rest }: Props,\n  ref\n) => {\n  const buttonRef = (ref as RefObject<HTMLButtonElement>) || createRef<HTMLButtonElement>();\n\n  useEffect(() => {\n    if (focused && buttonRef.current) {\n      buttonRef.current.focus();\n    }\n  }, [buttonRef.current, focused]);\n\n  const tabButtonClasses = [classes[\"tabbutton\"]];\n  tabActive && tabButtonClasses.push(classes[\"selected\"]);\n  fluid && tabButtonClasses.push(classes[\"fluid\"]);\n  className && tabButtonClasses.push(className);\n  icon && tabButtonClasses.push(classes[\"has-icon\"], classes[`${iconPosition}-icon`]);\n\n  return (\n    <button\n      {...rest}\n      className={tabButtonClasses.join(\" \")}\n      ref={buttonRef}\n      role=\"tab\"\n      type=\"button\"\n    >\n      {children}\n      {icon && <i>{icon}</i>}\n    </button>\n  );\n};\n\nexport const TabButton = React.forwardRef(TabButtonComponent);\n"],"names":["TabButton","React","forwardRef","children","tabActive","focused","title","fluid","icon","iconPosition","className","rest","ref","buttonRef","createRef","useEffect","current","focus","tabButtonClasses","classes","push","default","createElement","join","role","type"],"mappings":"qJAiEaA,EAAYC,EAAMC,YAhCgD,EAC3EC,WAAUC,YAAWC,UAASC,QAAOC,QAAOC,OAAMC,eAAcC,eAAcC,GAChFC,KAEM,MAAAC,EAAaD,GAAwCE,cAE3DC,EAAAA,WAAU,KACJV,GAAWQ,EAAUG,SACvBH,EAAUG,QAAQC,OAAM,GAEzB,CAACJ,EAAUG,QAASX,IAEvB,MAAMa,EAAmB,CAACC,UAAmB,WAO3C,OANFf,GAAac,EAAiBE,KAAKD,EAAQE,QAAU,UACrDd,GAASW,EAAiBE,KAAKD,EAAQE,QAAO,OACjCX,GAAAQ,EAAiBE,KAAKV,GAC3BF,GAAAU,EAAiBE,KAAKD,EAAAA,QAAQ,YAAaA,EAAQE,QAAA,GAAGZ,WAG5DR,EAAAqB,cAAC,SAAA,IACKX,EACJD,UAAWQ,EAAiBK,KAAK,KACjCX,IAAKC,EACLW,KAAK,MACLC,KAAK,UAEJtB,EACAK,GAASP,EAAAqB,cAAA,IAAA,KAAGd,GACf"}

package/dist/components/Tabs/TabButton.es.js

@@ -0,0 +1,32 @@
+import React, { createRef, useEffect } from "react";
+import classes from "./TabButton.module.scss.es.js";
+const TabButtonComponent = ({ children, tabActive, focused, title, fluid, icon, iconPosition, className, ...rest }, ref) => {
+  const buttonRef = ref || createRef();
+  useEffect(() => {
+    if (focused && buttonRef.current) {
+      buttonRef.current.focus();
+    }
+  }, [buttonRef.current, focused]);
+  const tabButtonClasses = [classes["tabbutton"]];
+  tabActive && tabButtonClasses.push(classes["selected"]);
+  fluid && tabButtonClasses.push(classes["fluid"]);
+  className && tabButtonClasses.push(className);
+  icon && tabButtonClasses.push(classes["has-icon"], classes[`${iconPosition}-icon`]);
+  return /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      ...rest,
+      className: tabButtonClasses.join(" "),
+      ref: buttonRef,
+      role: "tab",
+      type: "button"
+    },
+    children,
+    icon && /* @__PURE__ */ React.createElement("i", null, icon)
+  );
+};
+const TabButton = React.forwardRef(TabButtonComponent);
+export {
+  TabButton
+};
+//# sourceMappingURL=TabButton.es.js.map

package/dist/components/Tabs/TabButton.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabButton.es.js","sources":["../../../src/components/Tabs/TabButton.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, {\n  ForwardRefRenderFunction,\n  ComponentPropsWithRef,\n  createRef,\n  RefObject,\n  useEffect\n} from \"react\";\nimport classes from \"./TabButton.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"button\"> {\n  tabActive?: boolean;\n  focused?: boolean;\n  fluid?: boolean;\n  icon?: React.ReactNode;\n  iconPosition?: \"left\" | \"right\" | \"top\" | \"bottom\";\n}\n\nconst TabButtonComponent: ForwardRefRenderFunction<HTMLButtonElement, Props> = (\n  { children, tabActive, focused, title, fluid, icon, iconPosition, className, ...rest }: Props,\n  ref\n) => {\n  const buttonRef = (ref as RefObject<HTMLButtonElement>) || createRef<HTMLButtonElement>();\n\n  useEffect(() => {\n    if (focused && buttonRef.current) {\n      buttonRef.current.focus();\n    }\n  }, [buttonRef.current, focused]);\n\n  const tabButtonClasses = [classes[\"tabbutton\"]];\n  tabActive && tabButtonClasses.push(classes[\"selected\"]);\n  fluid && tabButtonClasses.push(classes[\"fluid\"]);\n  className && tabButtonClasses.push(className);\n  icon && tabButtonClasses.push(classes[\"has-icon\"], classes[`${iconPosition}-icon`]);\n\n  return (\n    <button\n      {...rest}\n      className={tabButtonClasses.join(\" \")}\n      ref={buttonRef}\n      role=\"tab\"\n      type=\"button\"\n    >\n      {children}\n      {icon && <i>{icon}</i>}\n    </button>\n  );\n};\n\nexport const TabButton = React.forwardRef(TabButtonComponent);\n"],"names":[],"mappings":";;AAiCA,MAAM,qBAAyE,CAC7E,EAAE,UAAU,WAAW,SAAS,OAAO,OAAO,MAAM,cAAc,WAAW,GAAG,KAAA,GAChF,QACG;AACG,QAAA,YAAa,OAAwC,UAA6B;AAExF,YAAU,MAAM;AACV,QAAA,WAAW,UAAU,SAAS;AAChC,gBAAU,QAAQ,MAAM;AAAA,IAAA;AAAA,EAEzB,GAAA,CAAC,UAAU,SAAS,OAAO,CAAC;AAE/B,QAAM,mBAAmB,CAAC,QAAQ,WAAW,CAAC;AAC9C,eAAa,iBAAiB,KAAK,QAAQ,UAAU,CAAC;AACtD,WAAS,iBAAiB,KAAK,QAAQ,OAAO,CAAC;AAClC,eAAA,iBAAiB,KAAK,SAAS;AACpC,UAAA,iBAAiB,KAAK,QAAQ,UAAU,GAAG,QAAQ,GAAG,YAAY,OAAO,CAAC;AAGhF,SAAA,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW,iBAAiB,KAAK,GAAG;AAAA,MACpC,KAAK;AAAA,MACL,MAAK;AAAA,MACL,MAAK;AAAA,IAAA;AAAA,IAEJ;AAAA,IACA,QAAS,sBAAA,cAAA,KAAA,MAAG,IAAK;AAAA,EACpB;AAEJ;AAEa,MAAA,YAAY,MAAM,WAAW,kBAAkB;"}

package/dist/components/Tabs/TabButton.module.scss.cjs.js

@@ -0,0 +1,3 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var t=document.createElement("style");t.appendChild(document.createTextNode('.TabButton_sr-only_E7GBT{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.TabButton_hidden_E7GBT{display:none}.TabButton_slide-in_E7GBT{animation:TabButton_slide-in_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.TabButton_slide-in_E7GBT{animation-duration:.1ms}}.TabButton_slide-out_E7GBT{animation:TabButton_slide-out_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.TabButton_slide-out_E7GBT{animation-duration:.1ms}}@keyframes TabButton_slide-in_E7GBT{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes TabButton_slide-out_E7GBT{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 */.TabButton_tabbutton_E7GBT{color:var(--tab-text-color);border:0;border-radius:0;font-size:var(--font-size);line-height:var(--default-line-height);margin:0;padding:.5rem 1rem;cursor:pointer;font-family:var(--font-family);background-color:transparent;white-space:nowrap;position:relative;font-weight:400;border-bottom-style:var(--tablist-border-style);border-bottom-width:var(--tablist-border-width);border-bottom-color:var(--tablist-border-color)}.TabButton_tabbutton_E7GBT:focus-visible{outline:calc(.125 * var(--font-size)) solid var(--color-focus);outline-offset:0;border-radius:var(--focus-border-radius)}.TabButton_tabbutton_E7GBT:where(:focus-visible){z-index:1}.TabButton_tabbutton_E7GBT:hover{background-color:var(--tab-hover-color)}.TabButton_tabbutton_E7GBT:active{background-color:var(--tab-pressed-color)}.TabButton_tabbutton_E7GBT.TabButton_selected_E7GBT{color:var(--tab-active-text-color)}.TabButton_tabbutton_E7GBT.TabButton_fluid_E7GBT{flex:1}.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT{gap:calc(.25 * var(--font-size));display:inline-flex;align-items:center}.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT i{display:flex}.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT span[data-icon]{display:inline-block;font-size:var(--font-size-big);width:var(--font-size-big)}.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT.TabButton_top-icon_E7GBT,.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT.TabButton_bottom-icon_E7GBT{flex-direction:column}.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT.TabButton_left-icon_E7GBT i,.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT.TabButton_top-icon_E7GBT i{order:-1}')),document.head.appendChild(t)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}}();
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t="TabButton_hidden_E7GBT",o="TabButton_tabbutton_E7GBT",e="TabButton_selected_E7GBT",n="TabButton_fluid_E7GBT",u={"sr-only":"TabButton_sr-only_E7GBT",hidden:t,"slide-in":"TabButton_slide-in_E7GBT","slide-out":"TabButton_slide-out_E7GBT",tabbutton:o,selected:e,fluid:n,"has-icon":"TabButton_has-icon_E7GBT","top-icon":"TabButton_top-icon_E7GBT","bottom-icon":"TabButton_bottom-icon_E7GBT","left-icon":"TabButton_left-icon_E7GBT"};exports.default=u,exports.fluid=n,exports.hidden=t,exports.selected=e,exports.tabbutton=o;
+//# sourceMappingURL=TabButton.module.scss.cjs.js.map

package/dist/components/Tabs/TabButton.module.scss.es.js

@@ -0,0 +1,26 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var t=document.createElement("style");t.appendChild(document.createTextNode('.TabButton_sr-only_E7GBT{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.TabButton_hidden_E7GBT{display:none}.TabButton_slide-in_E7GBT{animation:TabButton_slide-in_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.TabButton_slide-in_E7GBT{animation-duration:.1ms}}.TabButton_slide-out_E7GBT{animation:TabButton_slide-out_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.TabButton_slide-out_E7GBT{animation-duration:.1ms}}@keyframes TabButton_slide-in_E7GBT{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes TabButton_slide-out_E7GBT{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 */.TabButton_tabbutton_E7GBT{color:var(--tab-text-color);border:0;border-radius:0;font-size:var(--font-size);line-height:var(--default-line-height);margin:0;padding:.5rem 1rem;cursor:pointer;font-family:var(--font-family);background-color:transparent;white-space:nowrap;position:relative;font-weight:400;border-bottom-style:var(--tablist-border-style);border-bottom-width:var(--tablist-border-width);border-bottom-color:var(--tablist-border-color)}.TabButton_tabbutton_E7GBT:focus-visible{outline:calc(.125 * var(--font-size)) solid var(--color-focus);outline-offset:0;border-radius:var(--focus-border-radius)}.TabButton_tabbutton_E7GBT:where(:focus-visible){z-index:1}.TabButton_tabbutton_E7GBT:hover{background-color:var(--tab-hover-color)}.TabButton_tabbutton_E7GBT:active{background-color:var(--tab-pressed-color)}.TabButton_tabbutton_E7GBT.TabButton_selected_E7GBT{color:var(--tab-active-text-color)}.TabButton_tabbutton_E7GBT.TabButton_fluid_E7GBT{flex:1}.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT{gap:calc(.25 * var(--font-size));display:inline-flex;align-items:center}.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT i{display:flex}.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT span[data-icon]{display:inline-block;font-size:var(--font-size-big);width:var(--font-size-big)}.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT.TabButton_top-icon_E7GBT,.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT.TabButton_bottom-icon_E7GBT{flex-direction:column}.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT.TabButton_left-icon_E7GBT i,.TabButton_tabbutton_E7GBT.TabButton_has-icon_E7GBT.TabButton_top-icon_E7GBT i{order:-1}')),document.head.appendChild(t)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}}();
+const hidden = "TabButton_hidden_E7GBT";
+const tabbutton = "TabButton_tabbutton_E7GBT";
+const selected = "TabButton_selected_E7GBT";
+const fluid = "TabButton_fluid_E7GBT";
+const classes = {
+  "sr-only": "TabButton_sr-only_E7GBT",
+  hidden,
+  "slide-in": "TabButton_slide-in_E7GBT",
+  "slide-out": "TabButton_slide-out_E7GBT",
+  tabbutton,
+  selected,
+  fluid,
+  "has-icon": "TabButton_has-icon_E7GBT",
+  "top-icon": "TabButton_top-icon_E7GBT",
+  "bottom-icon": "TabButton_bottom-icon_E7GBT",
+  "left-icon": "TabButton_left-icon_E7GBT"
+};
+export {
+  classes as default,
+  fluid,
+  hidden,
+  selected,
+  tabbutton
+};
+//# sourceMappingURL=TabButton.module.scss.es.js.map

package/dist/components/Tabs/TabButton.module.scss.es.js.map

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

package/dist/components/Tabs/Tabs.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=require("./TabButton.cjs.js"),r=require("./Tabs.module.scss.cjs.js"),a=e.forwardRef((({children:a,selected:o=0,onTabChange:l,className:s,fluid:n,tabListClassName:i,align:c,iconsPosition:u="left",tabChanging:d,...f},p)=>{const[b,h]=e.useState([]),[m,y]=e.useState([]),[w,g]=e.useState(o),[v,S]=e.useState(!1),[C,E]=e.useState({width:0,left:0,top:0}),j=p||e.createRef(),k=e.useRef(null),T=async e=>{var t,r;try{if("function"==typeof d&&!(await Promise.resolve(d(e,w)))){const e=null==(t=j.current)?void 0:t.querySelectorAll('button[role="tab"]');return void(null==(r=null==e?void 0:e[w])||r.focus())}g(e),null==l||l(e)}catch(a){}};e.useEffect((()=>{j.current&&b.length&&(()=>{if(j.current){const e=j.current.querySelectorAll('button[role="tab"]')[w];E({left:e.offsetLeft,top:e.offsetTop+e.offsetHeight-k.current.offsetHeight-parseInt(getComputedStyle(e).borderBottomWidth),width:e.offsetWidth})}})()}),[j.current,w,b]),e.useEffect((()=>{const r=e.Children.map(a,((r,a)=>Object.prototype.hasOwnProperty.call(r.props,"title")?e.createElement(t.TabButton,{key:`${r.props.title.toLowerCase().replace(/\s/,"_")}_button`,tabIndex:w===a?0:-1,"aria-selected":w===a,focused:v&&w===a,tabActive:w===a,"aria-controls":`tab_${a}`,onClick:()=>{T(a)},disabled:r.props.disabled,fluid:n,iconPosition:u,icon:r.props.icon},r.props.title):null)),o=e.Children.map(a,((t,r)=>Object.prototype.hasOwnProperty.call(t.props,"title")?e.cloneElement(t,{key:`${t.props.title.toLowerCase().replace(/\s/,"_")}_tab`,tabIndex:w===r?0:-1,tabActive:w===r,id:`tab_${r}`,children:t.props.children}):null));y(o),h(r)}),[w,n,c,u]);const A=[r.default.tablist];return c&&A.push(r.default[c]),i&&A.push(i),e.createElement("div",{...f,ref:j,className:`${r.default.tabs} ${s??""}`},e.createElement("div",{role:"tablist",className:A.join(" "),onKeyDown:e=>{const t=[a].flat().length;if(v||S(!0),1!==t)switch(e.key){case"ArrowRight":T(w+1>t-1?0:w+1);break;case"ArrowLeft":T(w-1<0?t-1:w-1);break;case"Home":T(0);break;case"End":T(t-1);break;default:return}}},b,e.createElement("div",{className:r.default.indicator,ref:k,"aria-hidden":"true",tabIndex:-1,style:{width:C.width,left:C.left,top:C.top}})),e.createElement("div",null,m))}));exports.Tabs=a;
+//# sourceMappingURL=Tabs.cjs.js.map

package/dist/components/Tabs/Tabs.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.cjs.js","sources":["../../../src/components/Tabs/Tabs.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, {\n  ComponentPropsWithRef,\n  createRef,\n  ForwardRefRenderFunction,\n  ReactElement,\n  RefObject,\n  useEffect,\n  useRef,\n  useState\n} from \"react\";\nimport { Props as TabProps } from \"./Tab\";\nimport { TabButton } from \"./TabButton\";\nimport classes from \"./Tabs.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  children: ReactElement<TabProps>[];\n  selected?: number;\n  onTabChange?: (index: number) => void;\n  tabChanging?: (newIndex: number, oldIndex: number) => Promise<boolean> | boolean;\n  fluid?: boolean;\n  align?: \"left\" | \"center\" | \"right\";\n  tabListClassName?: string;\n  iconsPosition?: \"left\" | \"right\" | \"top\" | \"bottom\";\n}\n\nconst TabsComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  {\n    children,\n    selected = 0,\n    onTabChange,\n    className,\n    fluid,\n    tabListClassName,\n    align,\n    iconsPosition = \"left\",\n    tabChanging,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const [renderedButtons, setRenderedButtons] = useState<ReactElement[]>([]);\n  const [renderedTabs, setRenderedTabs] = useState<ReactElement[]>([]);\n  const [activeTabIndex, setActiveTabIndex] = useState(selected);\n  const [usingKeyboardNavigation, setUsingKeyboardNavigation] = useState(false);\n  const [indicatorStyles, setIndicatorStyles] = useState<{\n    width: number;\n    left: number;\n    top: number;\n  }>({\n    width: 0,\n    left: 0,\n    top: 0\n  });\n  const tabsRef = (ref as RefObject<HTMLDivElement>) || createRef<HTMLDivElement>();\n  const indicatorRef = useRef<HTMLDivElement>(null);\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    const totalAmountOfTabs = [children].flat().length;\n    if (!usingKeyboardNavigation) {\n      setUsingKeyboardNavigation(true);\n    }\n    if (totalAmountOfTabs === 1) {\n      return;\n    }\n\n    switch (e.key) {\n      case \"ArrowRight\": {\n        const nextIndex = activeTabIndex + 1 > totalAmountOfTabs - 1 ? 0 : activeTabIndex + 1;\n        void handleTabClick(nextIndex);\n        break;\n      }\n      case \"ArrowLeft\": {\n        const prevIndex = activeTabIndex - 1 < 0 ? totalAmountOfTabs - 1 : activeTabIndex - 1;\n        void handleTabClick(prevIndex);\n        break;\n      }\n      case \"Home\":\n        void handleTabClick(0);\n        break;\n      case \"End\":\n        void handleTabClick(totalAmountOfTabs - 1);\n        break;\n      default:\n        return;\n    }\n  };\n\n  const calculateIndicatorPosition = () => {\n    if (tabsRef.current) {\n      const selectedButton = tabsRef.current.querySelectorAll('button[role=\"tab\"]')[\n        activeTabIndex\n      ] as HTMLElement;\n\n      setIndicatorStyles({\n        left: selectedButton.offsetLeft,\n        top:\n          selectedButton.offsetTop +\n          selectedButton.offsetHeight -\n          indicatorRef.current!.offsetHeight -\n          parseInt(getComputedStyle(selectedButton).borderBottomWidth),\n        width: selectedButton.offsetWidth\n      });\n    }\n  };\n\n  const handleTabClick = async (newIndex: number) => {\n    try {\n      const allowed =\n        typeof tabChanging === \"function\"\n          ? await Promise.resolve(tabChanging(newIndex, activeTabIndex))\n          : true;\n\n      if (!allowed) {\n        const buttons = tabsRef.current?.querySelectorAll<HTMLButtonElement>('button[role=\"tab\"]');\n        buttons?.[activeTabIndex]?.focus();\n        return;\n      }\n\n      setActiveTabIndex(newIndex);\n      onTabChange?.(newIndex);\n    } catch (error) {\n      console.error(\"handleTabClick failed: \", error);\n    }\n  };\n\n  useEffect(() => {\n    if (tabsRef.current && renderedButtons.length) {\n      calculateIndicatorPosition();\n    }\n  }, [tabsRef.current, activeTabIndex, renderedButtons]);\n\n  useEffect(() => {\n    const buttons = React.Children.map(children, (child, index) => {\n      if (Object.prototype.hasOwnProperty.call(child.props, \"title\")) {\n        return React.createElement(\n          TabButton,\n          {\n            key: `${child.props.title.toLowerCase().replace(/\\s/, \"_\")}_button`,\n            tabIndex: activeTabIndex === index ? 0 : -1,\n            \"aria-selected\": activeTabIndex === index,\n            focused: usingKeyboardNavigation && activeTabIndex === index,\n            tabActive: activeTabIndex === index,\n            \"aria-controls\": `tab_${index}`,\n            onClick: () => {\n              void handleTabClick(index);\n            },\n            disabled: child.props.disabled,\n            fluid: fluid,\n            iconPosition: iconsPosition,\n            icon: child.props.icon\n          },\n          child.props.title\n        );\n      }\n      return null;\n    });\n\n    const tabs = React.Children.map(children, (child, index) => {\n      if (Object.prototype.hasOwnProperty.call(child.props, \"title\")) {\n        return React.cloneElement(child, {\n          key: `${child.props.title.toLowerCase().replace(/\\s/, \"_\")}_tab`,\n          tabIndex: activeTabIndex === index ? 0 : -1,\n          tabActive: activeTabIndex === index,\n          id: `tab_${index}`,\n          children: child.props.children\n        });\n      }\n\n      return null;\n    });\n\n    setRenderedTabs(tabs);\n    setRenderedButtons(buttons);\n  }, [activeTabIndex, fluid, align, iconsPosition]);\n\n  const tabListClasses = [classes[\"tablist\"]];\n  align && tabListClasses.push(classes[align]);\n  tabListClassName && tabListClasses.push(tabListClassName);\n\n  return (\n    <div {...rest} ref={tabsRef} className={`${classes[\"tabs\"]} ${className ?? \"\"}`}>\n      <div role=\"tablist\" className={tabListClasses.join(\" \")} onKeyDown={handleKeyDown}>\n        {renderedButtons}\n        <div\n          className={classes[\"indicator\"]}\n          ref={indicatorRef}\n          aria-hidden=\"true\"\n          tabIndex={-1}\n          style={{\n            width: indicatorStyles.width,\n            left: indicatorStyles.left,\n            top: indicatorStyles.top\n          }}\n        />\n      </div>\n      <div>{renderedTabs}</div>\n    </div>\n  );\n};\n\nexport const Tabs = React.forwardRef(TabsComponent);\n"],"names":["Tabs","React","forwardRef","children","selected","onTabChange","className","fluid","tabListClassName","align","iconsPosition","tabChanging","rest","ref","renderedButtons","setRenderedButtons","useState","renderedTabs","setRenderedTabs","activeTabIndex","setActiveTabIndex","usingKeyboardNavigation","setUsingKeyboardNavigation","indicatorStyles","setIndicatorStyles","width","left","top","tabsRef","createRef","indicatorRef","useRef","handleTabClick","async","newIndex","Promise","resolve","buttons","_a","current","querySelectorAll","_b","focus","error","useEffect","length","selectedButton","offsetLeft","offsetTop","offsetHeight","parseInt","getComputedStyle","borderBottomWidth","offsetWidth","calculateIndicatorPosition","Children","map","child","index","Object","prototype","hasOwnProperty","call","props","createElement","TabButton","key","title","toLowerCase","replace","tabIndex","focused","tabActive","onClick","disabled","iconPosition","icon","tabs","cloneElement","id","tabListClasses","classes","push","default","role","join","onKeyDown","e","totalAmountOfTabs","flat","style"],"mappings":"gLAwNaA,EAAOC,EAAMC,YA/K6C,EAEnEC,WACAC,WAAW,EACXC,cACAC,YACAC,QACAC,mBACAC,QACAC,gBAAgB,OAChBC,iBACGC,GAELC,KAEA,MAAOC,EAAiBC,GAAsBC,EAAAA,SAAyB,KAChEC,EAAcC,GAAmBF,EAAAA,SAAyB,KAC1DG,EAAgBC,GAAqBJ,EAAAA,SAASZ,IAC9CiB,EAAyBC,GAA8BN,EAAAA,UAAS,IAChEO,EAAiBC,GAAsBR,WAI3C,CACDS,MAAO,EACPC,KAAM,EACNC,IAAK,IAEDC,EAAWf,GAAqCgB,cAChDC,EAAeC,SAAuB,MAmDtCC,EAAiBC,MAAOC,YACxB,IAMF,GAJyB,mBAAhBvB,WACGwB,QAAQC,QAAQzB,EAAYuB,EAAUf,KAGpC,CACZ,MAAMkB,EAAU,OAAAC,EAAAV,EAAQW,cAAR,EAAAD,EAAiBE,iBAAoC,sBAErE,YADU,OAAAC,EAAA,MAAAJ,OAAA,EAAAA,EAAAlB,KAAiBsB,EAAAC,QAC3B,CAGFtB,EAAkBc,GACJ,MAAA7B,GAAAA,EAAA6B,SACPS,GACuC,GAIlDC,EAAAA,WAAU,KACJhB,EAAQW,SAAWzB,EAAgB+B,QAvCN,MACjC,GAAIjB,EAAQW,QAAS,CACnB,MAAMO,EAAiBlB,EAAQW,QAAQC,iBAAiB,sBACtDrB,GAGiBK,EAAA,CACjBE,KAAMoB,EAAeC,WACrBpB,IACEmB,EAAeE,UACfF,EAAeG,aACfnB,EAAaS,QAASU,aACtBC,SAASC,iBAAiBL,GAAgBM,mBAC5C3B,MAAOqB,EAAeO,aACvB,GA0B0BC,EAAA,GAE5B,CAAC1B,EAAQW,QAASpB,EAAgBL,IAErC8B,EAAAA,WAAU,KACR,MAAMP,EAAUpC,EAAMsD,SAASC,IAAIrD,GAAU,CAACsD,EAAOC,IAC/CC,OAAOC,UAAUC,eAAeC,KAAKL,EAAMM,MAAO,SAC7C9D,EAAM+D,cACXC,EAAAA,UACA,CACEC,IAAK,GAAGT,EAAMM,MAAMI,MAAMC,cAAcC,QAAQ,KAAM,cACtDC,SAAUnD,IAAmBuC,EAAQ,GAAI,EACzC,gBAAiBvC,IAAmBuC,EACpCa,QAASlD,GAA2BF,IAAmBuC,EACvDc,UAAWrD,IAAmBuC,EAC9B,gBAAiB,OAAOA,IACxBe,QAAS,KACFzC,EAAe0B,EAAK,EAE3BgB,SAAUjB,EAAMM,MAAMW,SACtBnE,QACAoE,aAAcjE,EACdkE,KAAMnB,EAAMM,MAAMa,MAEpBnB,EAAMM,MAAMI,OAGT,OAGHU,EAAO5E,EAAMsD,SAASC,IAAIrD,GAAU,CAACsD,EAAOC,IAC5CC,OAAOC,UAAUC,eAAeC,KAAKL,EAAMM,MAAO,SAC7C9D,EAAM6E,aAAarB,EAAO,CAC/BS,IAAK,GAAGT,EAAMM,MAAMI,MAAMC,cAAcC,QAAQ,KAAM,WACtDC,SAAUnD,IAAmBuC,EAAQ,GAAI,EACzCc,UAAWrD,IAAmBuC,EAC9BqB,GAAI,OAAOrB,IACXvD,SAAUsD,EAAMM,MAAM5D,WAInB,OAGTe,EAAgB2D,GAChB9D,EAAmBsB,EAAO,GACzB,CAAClB,EAAgBZ,EAAOE,EAAOC,IAElC,MAAMsE,EAAiB,CAACC,UAAiB,SAKvC,OAJFxE,GAASuE,EAAeE,KAAKD,EAAQE,QAAA1E,IACjBD,GAAAwE,EAAeE,KAAK1E,GAGtCP,EAAA+D,cAAC,MAAK,IAAGpD,EAAMC,IAAKe,EAAStB,UAAW,GAAG2E,EAAAA,QAAc,QAAK3E,GAAa,MACzEL,EAAA+D,cAAC,MAAI,CAAAoB,KAAK,UAAU9E,UAAW0E,EAAeK,KAAK,KAAMC,UA7HtCC,IACrB,MAAMC,EAAoB,CAACrF,GAAUsF,OAAO5C,OAI5C,GAHKxB,GACHC,GAA2B,GAEH,IAAtBkE,EAIJ,OAAQD,EAAErB,KACR,IAAK,aAEElC,EADab,EAAiB,EAAIqE,EAAoB,EAAI,EAAIrE,EAAiB,GAEpF,MAEF,IAAK,YAEEa,EADab,EAAiB,EAAI,EAAIqE,EAAoB,EAAIrE,EAAiB,GAEpF,MAEF,IAAK,OACEa,EAAe,GACpB,MACF,IAAK,MACEA,EAAewD,EAAoB,GACxC,MACF,QACE,OAAA,GAmGC1E,EACDb,EAAA+D,cAAC,MAAA,CACC1D,UAAW2E,UAAmB,UAC9BpE,IAAKiB,EACL,cAAY,OACZwC,UAAU,EACVoB,MAAO,CACLjE,MAAOF,EAAgBE,MACvBC,KAAMH,EAAgBG,KACtBC,IAAKJ,EAAgBI,QAI1B1B,EAAA+D,cAAA,MAAA,KAAK/C,GACR"}

package/dist/components/Tabs/Tabs.es.js

@@ -0,0 +1,148 @@
+import React, { useState, createRef, useRef, useEffect } from "react";
+import { TabButton } from "./TabButton.es.js";
+import classes from "./Tabs.module.scss.es.js";
+const TabsComponent = ({
+  children,
+  selected = 0,
+  onTabChange,
+  className,
+  fluid,
+  tabListClassName,
+  align,
+  iconsPosition = "left",
+  tabChanging,
+  ...rest
+}, ref) => {
+  const [renderedButtons, setRenderedButtons] = useState([]);
+  const [renderedTabs, setRenderedTabs] = useState([]);
+  const [activeTabIndex, setActiveTabIndex] = useState(selected);
+  const [usingKeyboardNavigation, setUsingKeyboardNavigation] = useState(false);
+  const [indicatorStyles, setIndicatorStyles] = useState({
+    width: 0,
+    left: 0,
+    top: 0
+  });
+  const tabsRef = ref || createRef();
+  const indicatorRef = useRef(null);
+  const handleKeyDown = (e) => {
+    const totalAmountOfTabs = [children].flat().length;
+    if (!usingKeyboardNavigation) {
+      setUsingKeyboardNavigation(true);
+    }
+    if (totalAmountOfTabs === 1) {
+      return;
+    }
+    switch (e.key) {
+      case "ArrowRight": {
+        const nextIndex = activeTabIndex + 1 > totalAmountOfTabs - 1 ? 0 : activeTabIndex + 1;
+        void handleTabClick(nextIndex);
+        break;
+      }
+      case "ArrowLeft": {
+        const prevIndex = activeTabIndex - 1 < 0 ? totalAmountOfTabs - 1 : activeTabIndex - 1;
+        void handleTabClick(prevIndex);
+        break;
+      }
+      case "Home":
+        void handleTabClick(0);
+        break;
+      case "End":
+        void handleTabClick(totalAmountOfTabs - 1);
+        break;
+      default:
+        return;
+    }
+  };
+  const calculateIndicatorPosition = () => {
+    if (tabsRef.current) {
+      const selectedButton = tabsRef.current.querySelectorAll('button[role="tab"]')[activeTabIndex];
+      setIndicatorStyles({
+        left: selectedButton.offsetLeft,
+        top: selectedButton.offsetTop + selectedButton.offsetHeight - indicatorRef.current.offsetHeight - parseInt(getComputedStyle(selectedButton).borderBottomWidth),
+        width: selectedButton.offsetWidth
+      });
+    }
+  };
+  const handleTabClick = async (newIndex) => {
+    var _a, _b;
+    try {
+      const allowed = typeof tabChanging === "function" ? await Promise.resolve(tabChanging(newIndex, activeTabIndex)) : true;
+      if (!allowed) {
+        const buttons = (_a = tabsRef.current) == null ? void 0 : _a.querySelectorAll('button[role="tab"]');
+        (_b = buttons == null ? void 0 : buttons[activeTabIndex]) == null ? void 0 : _b.focus();
+        return;
+      }
+      setActiveTabIndex(newIndex);
+      onTabChange == null ? void 0 : onTabChange(newIndex);
+    } catch (error) {
+      console.error("handleTabClick failed: ", error);
+    }
+  };
+  useEffect(() => {
+    if (tabsRef.current && renderedButtons.length) {
+      calculateIndicatorPosition();
+    }
+  }, [tabsRef.current, activeTabIndex, renderedButtons]);
+  useEffect(() => {
+    const buttons = React.Children.map(children, (child, index) => {
+      if (Object.prototype.hasOwnProperty.call(child.props, "title")) {
+        return React.createElement(
+          TabButton,
+          {
+            key: `${child.props.title.toLowerCase().replace(/\s/, "_")}_button`,
+            tabIndex: activeTabIndex === index ? 0 : -1,
+            "aria-selected": activeTabIndex === index,
+            focused: usingKeyboardNavigation && activeTabIndex === index,
+            tabActive: activeTabIndex === index,
+            "aria-controls": `tab_${index}`,
+            onClick: () => {
+              void handleTabClick(index);
+            },
+            disabled: child.props.disabled,
+            fluid,
+            iconPosition: iconsPosition,
+            icon: child.props.icon
+          },
+          child.props.title
+        );
+      }
+      return null;
+    });
+    const tabs = React.Children.map(children, (child, index) => {
+      if (Object.prototype.hasOwnProperty.call(child.props, "title")) {
+        return React.cloneElement(child, {
+          key: `${child.props.title.toLowerCase().replace(/\s/, "_")}_tab`,
+          tabIndex: activeTabIndex === index ? 0 : -1,
+          tabActive: activeTabIndex === index,
+          id: `tab_${index}`,
+          children: child.props.children
+        });
+      }
+      return null;
+    });
+    setRenderedTabs(tabs);
+    setRenderedButtons(buttons);
+  }, [activeTabIndex, fluid, align, iconsPosition]);
+  const tabListClasses = [classes["tablist"]];
+  align && tabListClasses.push(classes[align]);
+  tabListClassName && tabListClasses.push(tabListClassName);
+  return /* @__PURE__ */ React.createElement("div", { ...rest, ref: tabsRef, className: `${classes["tabs"]} ${className ?? ""}` }, /* @__PURE__ */ React.createElement("div", { role: "tablist", className: tabListClasses.join(" "), onKeyDown: handleKeyDown }, renderedButtons, /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: classes["indicator"],
+      ref: indicatorRef,
+      "aria-hidden": "true",
+      tabIndex: -1,
+      style: {
+        width: indicatorStyles.width,
+        left: indicatorStyles.left,
+        top: indicatorStyles.top
+      }
+    }
+  )), /* @__PURE__ */ React.createElement("div", null, renderedTabs));
+};
+const Tabs = React.forwardRef(TabsComponent);
+export {
+  Tabs
+};
+//# sourceMappingURL=Tabs.es.js.map

package/dist/components/Tabs/Tabs.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.es.js","sources":["../../../src/components/Tabs/Tabs.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, {\n  ComponentPropsWithRef,\n  createRef,\n  ForwardRefRenderFunction,\n  ReactElement,\n  RefObject,\n  useEffect,\n  useRef,\n  useState\n} from \"react\";\nimport { Props as TabProps } from \"./Tab\";\nimport { TabButton } from \"./TabButton\";\nimport classes from \"./Tabs.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  children: ReactElement<TabProps>[];\n  selected?: number;\n  onTabChange?: (index: number) => void;\n  tabChanging?: (newIndex: number, oldIndex: number) => Promise<boolean> | boolean;\n  fluid?: boolean;\n  align?: \"left\" | \"center\" | \"right\";\n  tabListClassName?: string;\n  iconsPosition?: \"left\" | \"right\" | \"top\" | \"bottom\";\n}\n\nconst TabsComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  {\n    children,\n    selected = 0,\n    onTabChange,\n    className,\n    fluid,\n    tabListClassName,\n    align,\n    iconsPosition = \"left\",\n    tabChanging,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const [renderedButtons, setRenderedButtons] = useState<ReactElement[]>([]);\n  const [renderedTabs, setRenderedTabs] = useState<ReactElement[]>([]);\n  const [activeTabIndex, setActiveTabIndex] = useState(selected);\n  const [usingKeyboardNavigation, setUsingKeyboardNavigation] = useState(false);\n  const [indicatorStyles, setIndicatorStyles] = useState<{\n    width: number;\n    left: number;\n    top: number;\n  }>({\n    width: 0,\n    left: 0,\n    top: 0\n  });\n  const tabsRef = (ref as RefObject<HTMLDivElement>) || createRef<HTMLDivElement>();\n  const indicatorRef = useRef<HTMLDivElement>(null);\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    const totalAmountOfTabs = [children].flat().length;\n    if (!usingKeyboardNavigation) {\n      setUsingKeyboardNavigation(true);\n    }\n    if (totalAmountOfTabs === 1) {\n      return;\n    }\n\n    switch (e.key) {\n      case \"ArrowRight\": {\n        const nextIndex = activeTabIndex + 1 > totalAmountOfTabs - 1 ? 0 : activeTabIndex + 1;\n        void handleTabClick(nextIndex);\n        break;\n      }\n      case \"ArrowLeft\": {\n        const prevIndex = activeTabIndex - 1 < 0 ? totalAmountOfTabs - 1 : activeTabIndex - 1;\n        void handleTabClick(prevIndex);\n        break;\n      }\n      case \"Home\":\n        void handleTabClick(0);\n        break;\n      case \"End\":\n        void handleTabClick(totalAmountOfTabs - 1);\n        break;\n      default:\n        return;\n    }\n  };\n\n  const calculateIndicatorPosition = () => {\n    if (tabsRef.current) {\n      const selectedButton = tabsRef.current.querySelectorAll('button[role=\"tab\"]')[\n        activeTabIndex\n      ] as HTMLElement;\n\n      setIndicatorStyles({\n        left: selectedButton.offsetLeft,\n        top:\n          selectedButton.offsetTop +\n          selectedButton.offsetHeight -\n          indicatorRef.current!.offsetHeight -\n          parseInt(getComputedStyle(selectedButton).borderBottomWidth),\n        width: selectedButton.offsetWidth\n      });\n    }\n  };\n\n  const handleTabClick = async (newIndex: number) => {\n    try {\n      const allowed =\n        typeof tabChanging === \"function\"\n          ? await Promise.resolve(tabChanging(newIndex, activeTabIndex))\n          : true;\n\n      if (!allowed) {\n        const buttons = tabsRef.current?.querySelectorAll<HTMLButtonElement>('button[role=\"tab\"]');\n        buttons?.[activeTabIndex]?.focus();\n        return;\n      }\n\n      setActiveTabIndex(newIndex);\n      onTabChange?.(newIndex);\n    } catch (error) {\n      console.error(\"handleTabClick failed: \", error);\n    }\n  };\n\n  useEffect(() => {\n    if (tabsRef.current && renderedButtons.length) {\n      calculateIndicatorPosition();\n    }\n  }, [tabsRef.current, activeTabIndex, renderedButtons]);\n\n  useEffect(() => {\n    const buttons = React.Children.map(children, (child, index) => {\n      if (Object.prototype.hasOwnProperty.call(child.props, \"title\")) {\n        return React.createElement(\n          TabButton,\n          {\n            key: `${child.props.title.toLowerCase().replace(/\\s/, \"_\")}_button`,\n            tabIndex: activeTabIndex === index ? 0 : -1,\n            \"aria-selected\": activeTabIndex === index,\n            focused: usingKeyboardNavigation && activeTabIndex === index,\n            tabActive: activeTabIndex === index,\n            \"aria-controls\": `tab_${index}`,\n            onClick: () => {\n              void handleTabClick(index);\n            },\n            disabled: child.props.disabled,\n            fluid: fluid,\n            iconPosition: iconsPosition,\n            icon: child.props.icon\n          },\n          child.props.title\n        );\n      }\n      return null;\n    });\n\n    const tabs = React.Children.map(children, (child, index) => {\n      if (Object.prototype.hasOwnProperty.call(child.props, \"title\")) {\n        return React.cloneElement(child, {\n          key: `${child.props.title.toLowerCase().replace(/\\s/, \"_\")}_tab`,\n          tabIndex: activeTabIndex === index ? 0 : -1,\n          tabActive: activeTabIndex === index,\n          id: `tab_${index}`,\n          children: child.props.children\n        });\n      }\n\n      return null;\n    });\n\n    setRenderedTabs(tabs);\n    setRenderedButtons(buttons);\n  }, [activeTabIndex, fluid, align, iconsPosition]);\n\n  const tabListClasses = [classes[\"tablist\"]];\n  align && tabListClasses.push(classes[align]);\n  tabListClassName && tabListClasses.push(tabListClassName);\n\n  return (\n    <div {...rest} ref={tabsRef} className={`${classes[\"tabs\"]} ${className ?? \"\"}`}>\n      <div role=\"tablist\" className={tabListClasses.join(\" \")} onKeyDown={handleKeyDown}>\n        {renderedButtons}\n        <div\n          className={classes[\"indicator\"]}\n          ref={indicatorRef}\n          aria-hidden=\"true\"\n          tabIndex={-1}\n          style={{\n            width: indicatorStyles.width,\n            left: indicatorStyles.left,\n            top: indicatorStyles.top\n          }}\n        />\n      </div>\n      <div>{renderedTabs}</div>\n    </div>\n  );\n};\n\nexport const Tabs = React.forwardRef(TabsComponent);\n"],"names":[],"mappings":";;;AAyCA,MAAM,gBAAiE,CACrE;AAAA,EACE;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB;AAAA,EACA,GAAG;AACL,GACA,QACG;AACH,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAyB,CAAA,CAAE;AACzE,QAAM,CAAC,cAAc,eAAe,IAAI,SAAyB,CAAA,CAAE;AACnE,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,QAAQ;AAC7D,QAAM,CAAC,yBAAyB,0BAA0B,IAAI,SAAS,KAAK;AAC5E,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAI3C;AAAA,IACD,OAAO;AAAA,IACP,MAAM;AAAA,IACN,KAAK;AAAA,EAAA,CACN;AACK,QAAA,UAAW,OAAqC,UAA0B;AAC1E,QAAA,eAAe,OAAuB,IAAI;AAE1C,QAAA,gBAAgB,CAAC,MAA2B;AAChD,UAAM,oBAAoB,CAAC,QAAQ,EAAE,KAAO,EAAA;AAC5C,QAAI,CAAC,yBAAyB;AAC5B,iCAA2B,IAAI;AAAA,IAAA;AAEjC,QAAI,sBAAsB,GAAG;AAC3B;AAAA,IAAA;AAGF,YAAQ,EAAE,KAAK;AAAA,MACb,KAAK,cAAc;AACjB,cAAM,YAAY,iBAAiB,IAAI,oBAAoB,IAAI,IAAI,iBAAiB;AACpF,aAAK,eAAe,SAAS;AAC7B;AAAA,MAAA;AAAA,MAEF,KAAK,aAAa;AAChB,cAAM,YAAY,iBAAiB,IAAI,IAAI,oBAAoB,IAAI,iBAAiB;AACpF,aAAK,eAAe,SAAS;AAC7B;AAAA,MAAA;AAAA,MAEF,KAAK;AACH,aAAK,eAAe,CAAC;AACrB;AAAA,MACF,KAAK;AACE,aAAA,eAAe,oBAAoB,CAAC;AACzC;AAAA,MACF;AACE;AAAA,IAAA;AAAA,EAEN;AAEA,QAAM,6BAA6B,MAAM;AACvC,QAAI,QAAQ,SAAS;AACnB,YAAM,iBAAiB,QAAQ,QAAQ,iBAAiB,oBAAoB,EAC1E,cACF;AAEmB,yBAAA;AAAA,QACjB,MAAM,eAAe;AAAA,QACrB,KACE,eAAe,YACf,eAAe,eACf,aAAa,QAAS,eACtB,SAAS,iBAAiB,cAAc,EAAE,iBAAiB;AAAA,QAC7D,OAAO,eAAe;AAAA,MAAA,CACvB;AAAA,IAAA;AAAA,EAEL;AAEM,QAAA,iBAAiB,OAAO,aAAqB;;AAC7C,QAAA;AACI,YAAA,UACJ,OAAO,gBAAgB,aACnB,MAAM,QAAQ,QAAQ,YAAY,UAAU,cAAc,CAAC,IAC3D;AAEN,UAAI,CAAC,SAAS;AACZ,cAAM,WAAU,aAAQ,YAAR,mBAAiB,iBAAoC;AAC3D,iDAAA,oBAAA,mBAAiB;AAC3B;AAAA,MAAA;AAGF,wBAAkB,QAAQ;AAC1B,iDAAc;AAAA,aACP,OAAO;AACN,cAAA,MAAM,2BAA2B,KAAK;AAAA,IAAA;AAAA,EAElD;AAEA,YAAU,MAAM;AACV,QAAA,QAAQ,WAAW,gBAAgB,QAAQ;AAClB,iCAAA;AAAA,IAAA;AAAA,KAE5B,CAAC,QAAQ,SAAS,gBAAgB,eAAe,CAAC;AAErD,YAAU,MAAM;AACd,UAAM,UAAU,MAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AAC7D,UAAI,OAAO,UAAU,eAAe,KAAK,MAAM,OAAO,OAAO,GAAG;AAC9D,eAAO,MAAM;AAAA,UACX;AAAA,UACA;AAAA,YACE,KAAK,GAAG,MAAM,MAAM,MAAM,YAAc,EAAA,QAAQ,MAAM,GAAG,CAAC;AAAA,YAC1D,UAAU,mBAAmB,QAAQ,IAAI;AAAA,YACzC,iBAAiB,mBAAmB;AAAA,YACpC,SAAS,2BAA2B,mBAAmB;AAAA,YACvD,WAAW,mBAAmB;AAAA,YAC9B,iBAAiB,OAAO,KAAK;AAAA,YAC7B,SAAS,MAAM;AACb,mBAAK,eAAe,KAAK;AAAA,YAC3B;AAAA,YACA,UAAU,MAAM,MAAM;AAAA,YACtB;AAAA,YACA,cAAc;AAAA,YACd,MAAM,MAAM,MAAM;AAAA,UACpB;AAAA,UACA,MAAM,MAAM;AAAA,QACd;AAAA,MAAA;AAEK,aAAA;AAAA,IAAA,CACR;AAED,UAAM,OAAO,MAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AAC1D,UAAI,OAAO,UAAU,eAAe,KAAK,MAAM,OAAO,OAAO,GAAG;AACvD,eAAA,MAAM,aAAa,OAAO;AAAA,UAC/B,KAAK,GAAG,MAAM,MAAM,MAAM,YAAc,EAAA,QAAQ,MAAM,GAAG,CAAC;AAAA,UAC1D,UAAU,mBAAmB,QAAQ,IAAI;AAAA,UACzC,WAAW,mBAAmB;AAAA,UAC9B,IAAI,OAAO,KAAK;AAAA,UAChB,UAAU,MAAM,MAAM;AAAA,QAAA,CACvB;AAAA,MAAA;AAGI,aAAA;AAAA,IAAA,CACR;AAED,oBAAgB,IAAI;AACpB,uBAAmB,OAAO;AAAA,KACzB,CAAC,gBAAgB,OAAO,OAAO,aAAa,CAAC;AAEhD,QAAM,iBAAiB,CAAC,QAAQ,SAAS,CAAC;AAC1C,WAAS,eAAe,KAAK,QAAQ,KAAK,CAAC;AACvB,sBAAA,eAAe,KAAK,gBAAgB;AAGtD,SAAA,sBAAA,cAAC,OAAK,EAAA,GAAG,MAAM,KAAK,SAAS,WAAW,GAAG,QAAQ,MAAM,CAAC,IAAI,aAAa,EAAE,GAC3E,GAAA,sBAAA,cAAC,OAAI,EAAA,MAAK,WAAU,WAAW,eAAe,KAAK,GAAG,GAAG,WAAW,cAAA,GACjE,iBACD,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,QAAQ,WAAW;AAAA,MAC9B,KAAK;AAAA,MACL,eAAY;AAAA,MACZ,UAAU;AAAA,MACV,OAAO;AAAA,QACL,OAAO,gBAAgB;AAAA,QACvB,MAAM,gBAAgB;AAAA,QACtB,KAAK,gBAAgB;AAAA,MAAA;AAAA,IACvB;AAAA,EAAA,CAEJ,GACC,sBAAA,cAAA,OAAA,MAAK,YAAa,CACrB;AAEJ;AAEa,MAAA,OAAO,MAAM,WAAW,aAAa;"}

package/dist/components/Tabs/Tabs.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('.Tabs_sr-only_E7GBT{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.Tabs_hidden_E7GBT{display:none}.Tabs_slide-in_E7GBT{animation:Tabs_slide-in_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.Tabs_slide-in_E7GBT{animation-duration:.1ms}}.Tabs_slide-out_E7GBT{animation:Tabs_slide-out_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.Tabs_slide-out_E7GBT{animation-duration:.1ms}}@keyframes Tabs_slide-in_E7GBT{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes Tabs_slide-out_E7GBT{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 */.Tabs_tabs_E7GBT{background-color:var(--tabs-background-color);padding:1rem 1.25rem;border-radius:.5rem;display:flex;flex-direction:column;gap:1rem}.Tabs_tablist_E7GBT{display:flex;flex-wrap:nowrap;overflow-x:auto;position:relative;margin:-5px;padding:5px;z-index:0}.Tabs_tablist_E7GBT.Tabs_center_E7GBT{justify-content:center}.Tabs_tablist_E7GBT.Tabs_right_E7GBT{justify-content:flex-end}.Tabs_indicator_E7GBT{position:absolute;height:calc(var(--tab-active-border-height) - var(--tablist-border-width));border-radius:.125rem .125rem 0 0;background-color:var(--tab-active-border-color);z-index:2;transition-property:left,width;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.Tabs_indicator_E7GBT{transition-duration:.1ms}}')),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}}();
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t="Tabs_hidden_E7GBT",s="Tabs_tabs_E7GBT",e="Tabs_tablist_E7GBT",i="Tabs_center_E7GBT",r="Tabs_right_E7GBT",a="Tabs_indicator_E7GBT",o={"sr-only":"Tabs_sr-only_E7GBT",hidden:t,"slide-in":"Tabs_slide-in_E7GBT","slide-out":"Tabs_slide-out_E7GBT",tabs:s,tablist:e,center:i,right:r,indicator:a};exports.center=i,exports.default=o,exports.hidden=t,exports.indicator=a,exports.right=r,exports.tablist=e,exports.tabs=s;
+//# sourceMappingURL=Tabs.module.scss.cjs.js.map

package/dist/components/Tabs/Tabs.module.scss.es.js

@@ -0,0 +1,28 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.Tabs_sr-only_E7GBT{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.Tabs_hidden_E7GBT{display:none}.Tabs_slide-in_E7GBT{animation:Tabs_slide-in_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.Tabs_slide-in_E7GBT{animation-duration:.1ms}}.Tabs_slide-out_E7GBT{animation:Tabs_slide-out_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.Tabs_slide-out_E7GBT{animation-duration:.1ms}}@keyframes Tabs_slide-in_E7GBT{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes Tabs_slide-out_E7GBT{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 */.Tabs_tabs_E7GBT{background-color:var(--tabs-background-color);padding:1rem 1.25rem;border-radius:.5rem;display:flex;flex-direction:column;gap:1rem}.Tabs_tablist_E7GBT{display:flex;flex-wrap:nowrap;overflow-x:auto;position:relative;margin:-5px;padding:5px;z-index:0}.Tabs_tablist_E7GBT.Tabs_center_E7GBT{justify-content:center}.Tabs_tablist_E7GBT.Tabs_right_E7GBT{justify-content:flex-end}.Tabs_indicator_E7GBT{position:absolute;height:calc(var(--tab-active-border-height) - var(--tablist-border-width));border-radius:.125rem .125rem 0 0;background-color:var(--tab-active-border-color);z-index:2;transition-property:left,width;transition-duration:.2s;transition-timing-function:ease-in-out}@media (prefers-reduced-motion: reduce){.Tabs_indicator_E7GBT{transition-duration:.1ms}}')),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}}();
+const hidden = "Tabs_hidden_E7GBT";
+const tabs = "Tabs_tabs_E7GBT";
+const tablist = "Tabs_tablist_E7GBT";
+const center = "Tabs_center_E7GBT";
+const right = "Tabs_right_E7GBT";
+const indicator = "Tabs_indicator_E7GBT";
+const classes = {
+  "sr-only": "Tabs_sr-only_E7GBT",
+  hidden,
+  "slide-in": "Tabs_slide-in_E7GBT",
+  "slide-out": "Tabs_slide-out_E7GBT",
+  tabs,
+  tablist,
+  center,
+  right,
+  indicator
+};
+export {
+  center,
+  classes as default,
+  hidden,
+  indicator,
+  right,
+  tablist,
+  tabs
+};
+//# sourceMappingURL=Tabs.module.scss.es.js.map

package/dist/components/Tabs/Tabs.module.scss.es.js.map

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

package/dist/components/Tag/RemoveButton.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),s=require("../Icon/Icon.cjs.js"),t=require("../../readyclasses.module.scss.cjs.js"),o=require("./RemoveButton.module.scss.cjs.js"),r=e.forwardRef((({removeLabel:r="Remove",label:c,onRemove:a,...l},n)=>a&&e.createElement("button",{title:"",type:"button",...l,ref:n,className:`${o.default.remove} ${l.className??""}`,onClick:a},e.createElement(s.Icon,{icon:s.Icons.Times,className:o.default.icon}),e.createElement("span",{className:t.default["sr-only"]},r,c?" "+c:""))));exports.RemoveButton=r;
+//# sourceMappingURL=RemoveButton.cjs.js.map

package/dist/components/Tag/RemoveButton.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemoveButton.cjs.js","sources":["../../../src/components/Tag/RemoveButton.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, HTMLAttributes, forwardRef } from \"react\";\nimport { Icon, Icons } from \"../Icon/Icon\";\n\nimport readyclasses from \"../../readyclasses.module.scss\";\nimport classes from \"./RemoveButton.module.scss\";\n\nexport interface Props extends HTMLAttributes<HTMLButtonElement> {\n  removeLabel?: string;\n  label?: string;\n  onRemove?: (e: React.MouseEvent<HTMLButtonElement>) => void;\n}\n\nconst RemoveButtonComponent: ForwardRefRenderFunction<HTMLButtonElement, Props> = (\n  { removeLabel = \"Remove\", label, onRemove, ...rest }: Props,\n  ref\n) => {\n  return (\n    onRemove && (\n      <button\n        title=\"\"\n        type=\"button\"\n        {...rest}\n        ref={ref}\n        className={`${classes[\"remove\"]} ${rest.className ?? \"\"}`}\n        onClick={onRemove}\n      >\n        <Icon icon={Icons.Times} className={classes[\"icon\"]} />\n        <span className={readyclasses[\"sr-only\"]}>\n          {removeLabel}\n          {label ? \" \" + label : \"\"}\n        </span>\n      </button>\n    )\n  );\n};\n\nexport const RemoveButton = forwardRef(RemoveButtonComponent);\n"],"names":["RemoveButton","forwardRef","removeLabel","label","onRemove","rest","ref","React","createElement","title","type","className","classes","onClick","Icon","icon","Icons","Times","readyclasses","default"],"mappings":"4OAoDaA,EAAeC,cAxBsD,EAC9EC,cAAc,SAAUC,QAAOC,cAAaC,GAC9CC,IAGEF,GACEG,EAAAC,cAAC,SAAA,CACCC,MAAM,GACNC,KAAK,YACDL,EACJC,MACAK,UAAW,GAAGC,EAAAA,QAAgB,UAAKP,EAAKM,WAAa,KACrDE,QAAST,GAETG,EAAAC,cAACM,QAAKC,KAAMC,EAAAA,MAAMC,MAAON,UAAWC,EAAAA,QAAc,OAClDL,EAAAC,cAAC,OAAK,CAAAG,UAAWO,EAAaC,QAAA,YAC3BjB,EACAC,EAAQ,IAAMA,EAAQ"}

package/dist/components/Tag/RemoveButton.es.js

@@ -0,0 +1,24 @@
+import React, { forwardRef } from "react";
+import { Icon, Icons } from "../Icon/Icon.es.js";
+import readyclasses from "../../readyclasses.module.scss.es.js";
+import classes from "./RemoveButton.module.scss.es.js";
+const RemoveButtonComponent = ({ removeLabel = "Remove", label, onRemove, ...rest }, ref) => {
+  return onRemove && /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      title: "",
+      type: "button",
+      ...rest,
+      ref,
+      className: `${classes["remove"]} ${rest.className ?? ""}`,
+      onClick: onRemove
+    },
+    /* @__PURE__ */ React.createElement(Icon, { icon: Icons.Times, className: classes["icon"] }),
+    /* @__PURE__ */ React.createElement("span", { className: readyclasses["sr-only"] }, removeLabel, label ? " " + label : "")
+  );
+};
+const RemoveButton = forwardRef(RemoveButtonComponent);
+export {
+  RemoveButton
+};
+//# sourceMappingURL=RemoveButton.es.js.map

package/dist/components/Tag/RemoveButton.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemoveButton.es.js","sources":["../../../src/components/Tag/RemoveButton.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, HTMLAttributes, forwardRef } from \"react\";\nimport { Icon, Icons } from \"../Icon/Icon\";\n\nimport readyclasses from \"../../readyclasses.module.scss\";\nimport classes from \"./RemoveButton.module.scss\";\n\nexport interface Props extends HTMLAttributes<HTMLButtonElement> {\n  removeLabel?: string;\n  label?: string;\n  onRemove?: (e: React.MouseEvent<HTMLButtonElement>) => void;\n}\n\nconst RemoveButtonComponent: ForwardRefRenderFunction<HTMLButtonElement, Props> = (\n  { removeLabel = \"Remove\", label, onRemove, ...rest }: Props,\n  ref\n) => {\n  return (\n    onRemove && (\n      <button\n        title=\"\"\n        type=\"button\"\n        {...rest}\n        ref={ref}\n        className={`${classes[\"remove\"]} ${rest.className ?? \"\"}`}\n        onClick={onRemove}\n      >\n        <Icon icon={Icons.Times} className={classes[\"icon\"]} />\n        <span className={readyclasses[\"sr-only\"]}>\n          {removeLabel}\n          {label ? \" \" + label : \"\"}\n        </span>\n      </button>\n    )\n  );\n};\n\nexport const RemoveButton = forwardRef(RemoveButtonComponent);\n"],"names":[],"mappings":";;;;AA4BA,MAAM,wBAA4E,CAChF,EAAE,cAAc,UAAU,OAAO,UAAU,GAAG,KAAK,GACnD,QACG;AACH,SACE,YACE,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,MAAK;AAAA,MACJ,GAAG;AAAA,MACJ;AAAA,MACA,WAAW,GAAG,QAAQ,QAAQ,CAAC,IAAI,KAAK,aAAa,EAAE;AAAA,MACvD,SAAS;AAAA,IAAA;AAAA,IAET,sBAAA,cAAC,QAAK,MAAM,MAAM,OAAO,WAAW,QAAQ,MAAM,GAAG;AAAA,IACrD,sBAAA,cAAC,QAAK,EAAA,WAAW,aAAa,SAAS,KACpC,aACA,QAAQ,MAAM,QAAQ,EACzB;AAAA,EACF;AAGN;AAEa,MAAA,eAAe,WAAW,qBAAqB;"}

package/dist/components/Tag/RemoveButton.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('.RemoveButton_sr-only_E7GBT{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.RemoveButton_hidden_E7GBT{display:none}.RemoveButton_slide-in_E7GBT{animation:RemoveButton_slide-in_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.RemoveButton_slide-in_E7GBT{animation-duration:.1ms}}.RemoveButton_slide-out_E7GBT{animation:RemoveButton_slide-out_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.RemoveButton_slide-out_E7GBT{animation-duration:.1ms}}@keyframes RemoveButton_slide-in_E7GBT{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes RemoveButton_slide-out_E7GBT{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 */.RemoveButton_remove_E7GBT{width:1.25rem;height:1.25rem;background:none;border:none;padding:0;margin-right:-.375rem;cursor:pointer}.RemoveButton_remove_E7GBT:hover{border-radius:.125rem;background-color:var(--color-black10)}.RemoveButton_remove_E7GBT:active{background-color:var(--color-blue-grey400)}.RemoveButton_remove_E7GBT:focus-visible{outline:calc(.125 * var(--font-size)) solid var(--color-focus);outline-offset:0;border-radius:var(--focus-border-radius)}.RemoveButton_remove_E7GBT .RemoveButton_icon_E7GBT{font-size:var(--font-size-small)}')),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="RemoveButton_remove_E7GBT",o="RemoveButton_icon_E7GBT",t={remove:e,icon:o};exports.default=t,exports.icon=o,exports.remove=e;
+//# sourceMappingURL=RemoveButton.module.scss.cjs.js.map

package/dist/components/Tag/RemoveButton.module.scss.es.js

@@ -0,0 +1,13 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode('.RemoveButton_sr-only_E7GBT{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.RemoveButton_hidden_E7GBT{display:none}.RemoveButton_slide-in_E7GBT{animation:RemoveButton_slide-in_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.RemoveButton_slide-in_E7GBT{animation-duration:.1ms}}.RemoveButton_slide-out_E7GBT{animation:RemoveButton_slide-out_E7GBT .5s forwards}@media (prefers-reduced-motion: reduce){.RemoveButton_slide-out_E7GBT{animation-duration:.1ms}}@keyframes RemoveButton_slide-in_E7GBT{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes RemoveButton_slide-out_E7GBT{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 */.RemoveButton_remove_E7GBT{width:1.25rem;height:1.25rem;background:none;border:none;padding:0;margin-right:-.375rem;cursor:pointer}.RemoveButton_remove_E7GBT:hover{border-radius:.125rem;background-color:var(--color-black10)}.RemoveButton_remove_E7GBT:active{background-color:var(--color-blue-grey400)}.RemoveButton_remove_E7GBT:focus-visible{outline:calc(.125 * var(--font-size)) solid var(--color-focus);outline-offset:0;border-radius:var(--focus-border-radius)}.RemoveButton_remove_E7GBT .RemoveButton_icon_E7GBT{font-size:var(--font-size-small)}')),document.head.appendChild(e)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}}();
+const remove = "RemoveButton_remove_E7GBT";
+const icon = "RemoveButton_icon_E7GBT";
+const classes = {
+  remove,
+  icon
+};
+export {
+  classes as default,
+  icon,
+  remove
+};
+//# sourceMappingURL=RemoveButton.module.scss.es.js.map

package/dist/components/Tag/RemoveButton.module.scss.es.js.map

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

package/dist/components/Tag/Tag.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),r=require("../Icon/Icon.cjs.js"),a=require("./Tag.module.scss.cjs.js"),o=require("../Typography/Typography.cjs.js"),t=require("./RemoveButton.cjs.js"),n=e.forwardRef((({children:n,variant:s,icon:c,backgroundColor:l,color:i,shape:d="rounded",removeButton:u={},...m},p)=>{const b=[a.default.tag];return"enabled"===s&&b.push(a.default["tag-enabled"]),"disabled"===s&&b.push(a.default["tag-disabled"]),"sharp"===d&&b.push(a.default.sharp),e.createElement("div",{...m,ref:p,className:`${b.join(" ")} ${m.className??""}`,style:{backgroundColor:l,color:i}},c?e.createElement(r.Icon,{size:"inherit",icon:c}):"enabled"===s?e.createElement(r.Icon,{size:"inherit",icon:r.Icons.CheckmarkCircleAlt}):"disabled"===s?e.createElement(r.Icon,{size:"inherit",icon:r.Icons.Forbidden}):void 0,e.createElement(o.Typography,{spacing:{marginBottom:0},variant:"body",className:a.default.label},n),e.createElement(t.RemoveButton,{...u,label:n}))}));exports.Tag=n;
+//# sourceMappingURL=Tag.cjs.js.map

package/dist/components/Tag/Tag.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.cjs.js","sources":["../../../src/components/Tag/Tag.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, HTMLAttributes, forwardRef } from \"react\";\nimport { Icon, Icons } from \"../Icon/Icon\";\nimport classes from \"./Tag.module.scss\";\nimport { Typography } from \"../Typography/Typography\";\nimport { RemoveButton, Props as RemoveButtonProps } from \"./RemoveButton\";\n\nexport interface Props extends HTMLAttributes<HTMLDivElement> {\n  variant?: \"enabled\" | \"disabled\";\n  icon?: Icons;\n  backgroundColor?: string;\n  color?: string;\n  children?: string;\n  shape?: \"rounded\" | \"sharp\";\n  removeButton?: RemoveButtonProps;\n}\n\nconst TagComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  {\n    children,\n    variant,\n    icon,\n    backgroundColor,\n    color,\n    shape = \"rounded\",\n    removeButton = {},\n    ...rest\n  }: Props,\n  ref\n) => {\n  const determineIcon = () => {\n    if (icon) {\n      return <Icon size=\"inherit\" icon={icon} />;\n    }\n\n    if (variant === \"enabled\") {\n      return <Icon size=\"inherit\" icon={Icons.CheckmarkCircleAlt} />;\n    } else if (variant === \"disabled\") {\n      return <Icon size=\"inherit\" icon={Icons.Forbidden} />;\n    }\n  };\n\n  const tagClasses = [classes[\"tag\"]];\n  variant === \"enabled\" && tagClasses.push(classes[\"tag-enabled\"]);\n  variant === \"disabled\" && tagClasses.push(classes[\"tag-disabled\"]);\n  shape === \"sharp\" && tagClasses.push(classes[\"sharp\"]);\n\n  return (\n    <div\n      {...rest}\n      ref={ref}\n      className={`${tagClasses.join(\" \")} ${rest.className ?? \"\"}`}\n      style={{ backgroundColor, color }}\n    >\n      {determineIcon()}\n      <Typography spacing={{ marginBottom: 0 }} variant=\"body\" className={classes[\"label\"]}>\n        {children}\n      </Typography>\n      <RemoveButton {...removeButton} label={children} />\n    </div>\n  );\n};\n\nexport const Tag = forwardRef(TagComponent);\n"],"names":["Tag","forwardRef","children","variant","icon","backgroundColor","color","shape","removeButton","rest","ref","tagClasses","classes","push","default","React","createElement","className","join","style","Icon","size","Icons","CheckmarkCircleAlt","Forbidden","Typography","spacing","marginBottom","RemoveButton","label"],"mappings":"gQA8EaA,EAAMC,cA9CmD,EAElEC,WACAC,UACAC,OACAC,kBACAC,QACAC,QAAQ,UACRC,eAAe,CAAC,KACbC,GAELC,KAEA,MAYMC,EAAa,CAACC,UAAa,KAM/B,MALU,YAAZT,GAAyBQ,EAAWE,KAAKD,EAAAE,QAAQ,gBACrC,aAAZX,GAA0BQ,EAAWE,KAAKD,EAAAE,QAAQ,iBACxC,UAAVP,GAAqBI,EAAWE,KAAKD,EAAAE,QAAe,OAGlDC,EAAAC,cAAC,MAAA,IACKP,EACJC,MACAO,UAAW,GAAGN,EAAWO,KAAK,QAAQT,EAAKQ,WAAa,KACxDE,MAAO,CAAEd,kBAAiBC,UArBxBF,EACMW,EAAAC,cAAAI,EAAAA,KAAA,CAAKC,KAAK,UAAUjB,SAGd,YAAZD,kBACMiB,EAAAA,KAAK,CAAAC,KAAK,UAAUjB,KAAMkB,QAAMC,qBACnB,aAAZpB,kBACDiB,EAAAA,KAAK,CAAAC,KAAK,UAAUjB,KAAMkB,QAAME,iBAFoB,IAmB3DR,cAAAS,EAAAA,WAAA,CAAWC,QAAS,CAAEC,aAAc,GAAKxB,QAAQ,OAAOc,UAAWL,EAAAA,QAAe,OAChFV,GAEFa,EAAAC,cAAAY,EAAAA,aAAA,IAAiBpB,EAAcqB,MAAO3B,IACzC"}