@onewelcome/react-lib-components 7.0.0 → 7.1.0

package/dist/esm/Tabs/TabButton.module.scss.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*!\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/*!\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/*!\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-module_sr-only__u7d0B{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.TabButton-module_hidden__ySTlz{display:none}.TabButton-module_slide-in__HGlpj{animation:TabButton-module_slide-in__HGlpj .5s forwards}@media (prefers-reduced-motion:reduce){.TabButton-module_slide-in__HGlpj{animation-duration:.1ms}}.TabButton-module_slide-out__th9eU{animation:TabButton-module_slide-out__th9eU .5s forwards}@media (prefers-reduced-motion:reduce){.TabButton-module_slide-out__th9eU{animation-duration:.1ms}}@keyframes TabButton-module_slide-in__HGlpj{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes TabButton-module_slide-out__th9eU{0%{transform:translateY(0)}to{transform:translateY(100vh)}}.TabButton-module_tabbutton__lr71S{background-color:initial;border:0;border-bottom:var(--tablist-border-width) var(--tablist-border-style) var(--tablist-border-color);border-radius:0;color:var(--tab-text-color);cursor:pointer;font-family:var(--font-family);font-size:var(--font-size);font-weight:400;line-height:var(--default-line-height);margin:0;padding:.5rem 1rem;position:relative;white-space:nowrap}.TabButton-module_tabbutton__lr71S:focus-visible{border-radius:var(--focus-border-radius);outline:.125rem solid var(--color-focus);outline-offset:0}.TabButton-module_tabbutton__lr71S:where(:focus-visible){z-index:1}.TabButton-module_tabbutton__lr71S:hover{background-color:var(--tab-hover-color)}.TabButton-module_tabbutton__lr71S:active{background-color:var(--tab-pressed-color)}.TabButton-module_tabbutton__lr71S.TabButton-module_selected__n9OVC{color:var(--tab-active-text-color)}.TabButton-module_tabbutton__lr71S.TabButton-module_fluid__UhXgH{flex:1}.TabButton-module_tabbutton__lr71S.TabButton-module_has-icon__b44fU{align-items:center;display:inline-flex;gap:.25rem}.TabButton-module_tabbutton__lr71S.TabButton-module_has-icon__b44fU i{display:flex}.TabButton-module_tabbutton__lr71S.TabButton-module_has-icon__b44fU span[data-icon]{display:inline-block;font-size:1.25rem;width:1.25rem}.TabButton-module_tabbutton__lr71S.TabButton-module_has-icon__b44fU.TabButton-module_bottom-icon__Qf1BT,.TabButton-module_tabbutton__lr71S.TabButton-module_has-icon__b44fU.TabButton-module_top-icon__mYHQu{flex-direction:column}.TabButton-module_tabbutton__lr71S.TabButton-module_has-icon__b44fU.TabButton-module_left-icon__yksCg i,.TabButton-module_tabbutton__lr71S.TabButton-module_has-icon__b44fU.TabButton-module_top-icon__mYHQu i{order:-1}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhYkJ1dHRvbi5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRTtBQUNGOzs7Ozs7Ozs7Ozs7OztFQWNFO0FBQ0Y7Ozs7Ozs7Ozs7Ozs7O0VBY0UsQ0FDRixpQ0FPRSxrQkFBc0IsQ0FDdEIsUUFBUyxDQUxULFVBQVcsQ0FFWCxXQUFZLENBQ1osZUFBZ0IsQ0FGaEIsU0FBVSxDQUhWLGlCQUFrQixDQUNsQixTQU9GLENBRUEsZ0NBQ0UsWUFDRixDQUVBLGtDQUNFLHVEQUNGLENBQ0EsdUNBQ0Usa0NBQ0UsdUJBQ0YsQ0FDRixDQUVBLG1DQUNFLHdEQUNGLENBQ0EsdUNBQ0UsbUNBQ0UsdUJBQ0YsQ0FDRixDQUVBLDRDQUNFLEdBQ0UsMkJBQ0YsQ0FDQSxHQUNFLHVCQUNGLENBQ0YsQ0FDQSw2Q0FDRSxHQUNFLHVCQUNGLENBQ0EsR0FDRSwyQkFDRixDQUNGLENBQ0EsbUNBVUUsd0JBQTZCLENBUjdCLFFBQVMsQ0FjVCxpR0FBZ0QsQ0FiaEQsZUFBZ0IsQ0FGaEIsMkJBQTRCLENBTzVCLGNBQWUsQ0FDZiw4QkFBK0IsQ0FML0IsMEJBQTJCLENBUzNCLGVBQW1CLENBUm5CLHNDQUF1QyxDQUN2QyxRQUFTLENBQ1Qsa0JBQW9CLENBS3BCLGlCQUFrQixDQURsQixrQkFNRixDQUNBLGlEQUdFLHdDQUF5QyxDQUZ6Qyx3Q0FBMEMsQ0FDMUMsZ0JBRUYsQ0FDQSx5REFDRSxTQUNGLENBQ0EseUNBQ0UsdUNBQ0YsQ0FDQSwwQ0FDRSx5Q0FDRixDQUNBLG9FQUNFLGtDQUNGLENBQ0EsaUVBQ0UsTUFDRixDQUNBLG9FQUdFLGtCQUFtQixDQURuQixtQkFBb0IsQ0FEcEIsVUFHRixDQUNBLHNFQUNFLFlBQ0YsQ0FDQSxvRkFDRSxvQkFBcUIsQ0FDckIsaUJBQWtCLENBQ2xCLGFBQ0YsQ0FDQSw2TUFDRSxxQkFDRixDQUlBLCtNQUNFLFFBQ0YiLCJmaWxlIjoiVGFiQnV0dG9uLm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4vKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLnNyLW9ubHkge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHdpZHRoOiAxcHg7XG4gIGhlaWdodDogMXB4O1xuICBwYWRkaW5nOiAwO1xuICBtYXJnaW46IC0xcHg7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIGNsaXA6IHJlY3QoMCwgMCwgMCwgMCk7XG4gIGJvcmRlcjogMDtcbn1cblxuLmhpZGRlbiB7XG4gIGRpc3BsYXk6IG5vbmU7XG59XG5cbi5zbGlkZS1pbiB7XG4gIGFuaW1hdGlvbjogc2xpZGUtaW4gMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1pbiB7XG4gICAgYW5pbWF0aW9uLWR1cmF0aW9uOiAwLjFtcztcbiAgfVxufVxuXG4uc2xpZGUtb3V0IHtcbiAgYW5pbWF0aW9uOiBzbGlkZS1vdXQgMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1vdXQge1xuICAgIGFuaW1hdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cblxuQGtleWZyYW1lcyBzbGlkZS1pbiB7XG4gIDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTAwdmgpO1xuICB9XG4gIDEwMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbn1cbkBrZXlmcmFtZXMgc2xpZGUtb3V0IHtcbiAgMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbiAgMTAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMHZoKTtcbiAgfVxufVxuLnRhYmJ1dHRvbiB7XG4gIGNvbG9yOiB2YXIoLS10YWItdGV4dC1jb2xvcik7XG4gIGJvcmRlcjogMDtcbiAgYm9yZGVyLXJhZGl1czogMDtcbiAgZm9udC1zaXplOiB2YXIoLS1mb250LXNpemUpO1xuICBsaW5lLWhlaWdodDogdmFyKC0tZGVmYXVsdC1saW5lLWhlaWdodCk7XG4gIG1hcmdpbjogMDtcbiAgcGFkZGluZzogMC41cmVtIDFyZW07XG4gIGN1cnNvcjogcG9pbnRlcjtcbiAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5KTtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgZm9udC13ZWlnaHQ6IG5vcm1hbDtcbiAgYm9yZGVyLWJvdHRvbS1zdHlsZTogdmFyKC0tdGFibGlzdC1ib3JkZXItc3R5bGUpO1xuICBib3JkZXItYm90dG9tLXdpZHRoOiB2YXIoLS10YWJsaXN0LWJvcmRlci13aWR0aCk7XG4gIGJvcmRlci1ib3R0b20tY29sb3I6IHZhcigtLXRhYmxpc3QtYm9yZGVyLWNvbG9yKTtcbn1cbi50YWJidXR0b246Zm9jdXMtdmlzaWJsZSB7XG4gIG91dGxpbmU6IDAuMTI1cmVtIHNvbGlkIHZhcigtLWNvbG9yLWZvY3VzKTtcbiAgb3V0bGluZS1vZmZzZXQ6IDA7XG4gIGJvcmRlci1yYWRpdXM6IHZhcigtLWZvY3VzLWJvcmRlci1yYWRpdXMpO1xufVxuLnRhYmJ1dHRvbjp3aGVyZSg6Zm9jdXMtdmlzaWJsZSkge1xuICB6LWluZGV4OiAxO1xufVxuLnRhYmJ1dHRvbjpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXRhYi1ob3Zlci1jb2xvcik7XG59XG4udGFiYnV0dG9uOmFjdGl2ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXRhYi1wcmVzc2VkLWNvbG9yKTtcbn1cbi50YWJidXR0b24uc2VsZWN0ZWQge1xuICBjb2xvcjogdmFyKC0tdGFiLWFjdGl2ZS10ZXh0LWNvbG9yKTtcbn1cbi50YWJidXR0b24uZmx1aWQge1xuICBmbGV4OiAxO1xufVxuLnRhYmJ1dHRvbi5oYXMtaWNvbiB7XG4gIGdhcDogMC4yNXJlbTtcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG59XG4udGFiYnV0dG9uLmhhcy1pY29uIGkge1xuICBkaXNwbGF5OiBmbGV4O1xufVxuLnRhYmJ1dHRvbi5oYXMtaWNvbiBzcGFuW2RhdGEtaWNvbl0ge1xuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIGZvbnQtc2l6ZTogMS4yNXJlbTtcbiAgd2lkdGg6IDEuMjVyZW07XG59XG4udGFiYnV0dG9uLmhhcy1pY29uLnRvcC1pY29uLCAudGFiYnV0dG9uLmhhcy1pY29uLmJvdHRvbS1pY29uIHtcbiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbn1cbi50YWJidXR0b24uaGFzLWljb24ubGVmdC1pY29uIGkge1xuICBvcmRlcjogLTE7XG59XG4udGFiYnV0dG9uLmhhcy1pY29uLnRvcC1pY29uIGkge1xuICBvcmRlcjogLTE7XG59Il19 */";
+var classes = {"sr-only":"TabButton-module_sr-only__u7d0B","hidden":"TabButton-module_hidden__ySTlz","slide-in":"TabButton-module_slide-in__HGlpj","slide-out":"TabButton-module_slide-out__th9eU","tabbutton":"TabButton-module_tabbutton__lr71S","selected":"TabButton-module_selected__n9OVC","fluid":"TabButton-module_fluid__UhXgH","has-icon":"TabButton-module_has-icon__b44fU","top-icon":"TabButton-module_top-icon__mYHQu","bottom-icon":"TabButton-module_bottom-icon__Qf1BT","left-icon":"TabButton-module_left-icon__yksCg"};
+styleInject(css_248z);
+
+export { classes as default };
+//# sourceMappingURL=TabButton.module.scss.esm.js.map

package/dist/esm/Tabs/TabButton.module.scss.esm.js.map

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

package/dist/esm/Tabs/Tabs.esm.js

@@ -1,2 +1,130 @@
-import t,{useState as e,createRef as o,useRef as r,useEffect as n}from"react";import{TabButton as s}from"./TabButton.esm.js";import l from"./Tabs.module.esm.js";const a=({children:a,selected:i=0,onTabChange:c,className:d,fluid:p,tabListClassName:f,align:u,iconsPosition:b="left",...m},h)=>{const[w,y]=e([]);const[v,g]=e([]);const[k,C]=e(i);const[E,$]=e(false);const[_,j]=e({width:0,left:0,top:0});const A=h||o();const L=r(null);const N=t=>{const e=[a].flat().length;if(!E)$(true);if(e===1)return;switch(t.key){case"ArrowRight":C((t=>t+1>e-1?0:t+1));break;case"ArrowLeft":C((t=>t-1<0?e-1:t-1));break;case"Home":C(0);break;case"End":C(e-1);break;default:return}};const x=()=>{if(A.current){const t=A.current.querySelectorAll('button[role="tab"]')[k];j({left:t.offsetLeft,top:t.offsetTop+t.offsetHeight-L.current.offsetHeight-parseInt(getComputedStyle(t).borderBottomWidth),width:t.offsetWidth})}};n((()=>{if(A.current&&w.length)x()}),[A.current,k,w]);n((()=>{c===null||c===void 0?void 0:c(k)}),[k]);n((()=>{const e=t.Children.map(a,((e,o)=>{if(Object.prototype.hasOwnProperty.call(e.props,"title"))return t.createElement(s,{key:`${e.props.title.toLowerCase().replace(/\s/,"_")}_button`,tabIndex:k===o?0:-1,"aria-selected":k===o,focused:E&&k===o,tabActive:k===o,"aria-controls":`tab_${o}`,onClick:()=>C(o),disabled:e.props.disabled,fluid:p,iconPosition:b,icon:e.props.icon},e.props.title);return null}));const o=t.Children.map(a,((e,o)=>{if(Object.prototype.hasOwnProperty.call(e.props,"title"))return t.cloneElement(e,{key:`${e.props.title.toLowerCase().replace(/\s/,"_")}_tab`,tabIndex:k===o?0:-1,tabActive:k===o,id:`tab_${o}`,children:e.props.children});return null}));g(o);y(e)}),[k,p,u,b]);const I=[l["tablist"]];u&&I.push(l[u]);f&&I.push(f);return t.createElement("div",{...m,ref:A,className:`${l["tabs"]} ${d!==null&&d!==void 0?d:""}`},t.createElement("div",{role:"tablist",className:I.join(" "),onKeyDown:N},w,t.createElement("div",{className:l["indicator"],ref:L,"aria-hidden":"true",tabIndex:-1,style:{width:_.width,left:_.left,top:_.top}})),t.createElement("div",null,v))};const i=t.forwardRef(a);export{i as Tabs};
+import React, { useState, createRef, useRef, useEffect } from 'react';
+import { TabButton } from './TabButton.esm.js';
+import classes from './Tabs.module.scss.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 TabsComponent = ({ children, selected = 0, onTabChange, className, fluid, tabListClassName, align, iconsPosition = "left", ...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":
+                setActiveTabIndex(currentIndex => {
+                    return currentIndex + 1 > totalAmountOfTabs - 1 ? 0 : currentIndex + 1;
+                });
+                break;
+            case "ArrowLeft":
+                setActiveTabIndex(currentIndex => {
+                    return currentIndex - 1 < 0 ? totalAmountOfTabs - 1 : currentIndex - 1;
+                });
+                break;
+            case "Home":
+                setActiveTabIndex(0);
+                break;
+            case "End":
+                setActiveTabIndex(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
+            });
+        }
+    };
+    useEffect(() => {
+        if (tabsRef.current && renderedButtons.length) {
+            calculateIndicatorPosition();
+        }
+    }, [tabsRef.current, activeTabIndex, renderedButtons]);
+    useEffect(() => {
+        onTabChange === null || onTabChange === void 0 ? void 0 : onTabChange(activeTabIndex);
+    }, [activeTabIndex]);
+    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: () => setActiveTabIndex(index),
+                    disabled: child.props.disabled,
+                    fluid: 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 (React.createElement("div", { ...rest, ref: tabsRef, className: `${classes["tabs"]} ${className !== null && className !== void 0 ? className : ""}` },
+        React.createElement("div", { role: "tablist", className: tabListClasses.join(" "), onKeyDown: handleKeyDown },
+            renderedButtons,
+            React.createElement("div", { className: classes["indicator"], ref: indicatorRef, "aria-hidden": "true", tabIndex: -1, style: {
+                    width: indicatorStyles.width,
+                    left: indicatorStyles.left,
+                    top: indicatorStyles.top
+                } })),
+        React.createElement("div", null, renderedTabs)));
+};
+const Tabs = React.forwardRef(TabsComponent);
+
+export { Tabs };
 //# sourceMappingURL=Tabs.esm.js.map

package/dist/esm/Tabs/Tabs.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.esm.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  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    ...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) setUsingKeyboardNavigation(true);\n    if (totalAmountOfTabs === 1) return;\n\n    switch (e.key) {\n      case \"ArrowRight\":\n        setActiveTabIndex(currentIndex => {\n          return currentIndex + 1 > totalAmountOfTabs - 1 ? 0 : currentIndex + 1;\n        });\n        break;\n      case \"ArrowLeft\":\n        setActiveTabIndex(currentIndex => {\n          return currentIndex - 1 < 0 ? totalAmountOfTabs - 1 : currentIndex - 1;\n        });\n        break;\n      case \"Home\":\n        setActiveTabIndex(0);\n        break;\n      case \"End\":\n        setActiveTabIndex(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  useEffect(() => {\n    if (tabsRef.current && renderedButtons.length) {\n      calculateIndicatorPosition();\n    }\n  }, [tabsRef.current, activeTabIndex, renderedButtons]);\n\n  useEffect(() => {\n    onTabChange?.(activeTabIndex);\n  }, [activeTabIndex]);\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: () => setActiveTabIndex(index),\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":["TabsComponent","children","selected","onTabChange","className","fluid","tabListClassName","align","iconsPosition","rest","ref","renderedButtons","setRenderedButtons","useState","renderedTabs","setRenderedTabs","activeTabIndex","setActiveTabIndex","usingKeyboardNavigation","setUsingKeyboardNavigation","indicatorStyles","setIndicatorStyles","width","left","top","tabsRef","createRef","indicatorRef","useRef","handleKeyDown","e","totalAmountOfTabs","flat","length","key","currentIndex","calculateIndicatorPosition","current","selectedButton","querySelectorAll","offsetLeft","offsetTop","offsetHeight","parseInt","getComputedStyle","borderBottomWidth","offsetWidth","useEffect","buttons","React","Children","map","child","index","Object","prototype","hasOwnProperty","call","props","createElement","TabButton","title","toLowerCase","replace","tabIndex","focused","tabActive","onClick","disabled","iconPosition","icon","tabs","cloneElement","id","tabListClasses","classes","push","role","join","onKeyDown","style","Tabs","forwardRef"],"mappings":"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"}
+{"version":3,"file":"Tabs.esm.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  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    ...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) setUsingKeyboardNavigation(true);\n    if (totalAmountOfTabs === 1) return;\n\n    switch (e.key) {\n      case \"ArrowRight\":\n        setActiveTabIndex(currentIndex => {\n          return currentIndex + 1 > totalAmountOfTabs - 1 ? 0 : currentIndex + 1;\n        });\n        break;\n      case \"ArrowLeft\":\n        setActiveTabIndex(currentIndex => {\n          return currentIndex - 1 < 0 ? totalAmountOfTabs - 1 : currentIndex - 1;\n        });\n        break;\n      case \"Home\":\n        setActiveTabIndex(0);\n        break;\n      case \"End\":\n        setActiveTabIndex(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  useEffect(() => {\n    if (tabsRef.current && renderedButtons.length) {\n      calculateIndicatorPosition();\n    }\n  }, [tabsRef.current, activeTabIndex, renderedButtons]);\n\n  useEffect(() => {\n    onTabChange?.(activeTabIndex);\n  }, [activeTabIndex]);\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: () => setActiveTabIndex(index),\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":"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"}

package/dist/esm/Tabs/Tabs.module.scss.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*!\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/*!\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/*!\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-module_sr-only__XnAVz{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.Tabs-module_hidden__lvN6c{display:none}.Tabs-module_slide-in__mbWej{animation:Tabs-module_slide-in__mbWej .5s forwards}@media (prefers-reduced-motion:reduce){.Tabs-module_slide-in__mbWej{animation-duration:.1ms}}.Tabs-module_slide-out__ep10Q{animation:Tabs-module_slide-out__ep10Q .5s forwards}@media (prefers-reduced-motion:reduce){.Tabs-module_slide-out__ep10Q{animation-duration:.1ms}}@keyframes Tabs-module_slide-in__mbWej{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes Tabs-module_slide-out__ep10Q{0%{transform:translateY(0)}to{transform:translateY(100vh)}}.Tabs-module_tabs__z-Cun{background-color:var(--tabs-background-color);border-radius:.5rem;display:flex;flex-direction:column;gap:1rem;padding:1rem 1.25rem}.Tabs-module_tablist__QY6qv{display:flex;flex-wrap:nowrap;margin:-5px;overflow-x:auto;padding:5px;position:relative;z-index:0}.Tabs-module_tablist__QY6qv.Tabs-module_center__m4ZMa{justify-content:center}.Tabs-module_tablist__QY6qv.Tabs-module_right__Dvfbh{justify-content:flex-end}.Tabs-module_indicator__b8TYY{background-color:var(--tab-active-border-color);border-radius:.125rem .125rem 0 0;height:calc(var(--tab-active-border-height) - var(--tablist-border-width));position:absolute;transition-duration:.2s;transition-property:left,width;transition-timing-function:ease-in-out;z-index:2}@media (prefers-reduced-motion:reduce){.Tabs-module_indicator__b8TYY{transition-duration:.1ms}}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhYnMubW9kdWxlLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7Ozs7Ozs7Ozs7Ozs7O0VBY0U7QUFDRjs7Ozs7Ozs7Ozs7Ozs7RUFjRTtBQUNGOzs7Ozs7Ozs7Ozs7OztFQWNFLENBQ0YsNEJBT0Usa0JBQXNCLENBQ3RCLFFBQVMsQ0FMVCxVQUFXLENBRVgsV0FBWSxDQUNaLGVBQWdCLENBRmhCLFNBQVUsQ0FIVixpQkFBa0IsQ0FDbEIsU0FPRixDQUVBLDJCQUNFLFlBQ0YsQ0FFQSw2QkFDRSxrREFDRixDQUNBLHVDQUNFLDZCQUNFLHVCQUNGLENBQ0YsQ0FFQSw4QkFDRSxtREFDRixDQUNBLHVDQUNFLDhCQUNFLHVCQUNGLENBQ0YsQ0FFQSx1Q0FDRSxHQUNFLDJCQUNGLENBQ0EsR0FDRSx1QkFDRixDQUNGLENBQ0Esd0NBQ0UsR0FDRSx1QkFDRixDQUNBLEdBQ0UsMkJBQ0YsQ0FDRixDQUNBLHlCQUNFLDZDQUE4QyxDQUU5QyxtQkFBcUIsQ0FDckIsWUFBYSxDQUNiLHFCQUFzQixDQUN0QixRQUFTLENBSlQsb0JBS0YsQ0FFQSw0QkFDRSxZQUFhLENBQ2IsZ0JBQWlCLENBR2pCLFdBQVksQ0FGWixlQUFnQixDQUdoQixXQUFZLENBRlosaUJBQWtCLENBR2xCLFNBQ0YsQ0FDQSxzREFDRSxzQkFDRixDQUNBLHFEQUNFLHdCQUNGLENBRUEsOEJBSUUsK0NBQWdELENBRGhELGlDQUFvQyxDQURwQywwRUFBMkUsQ0FEM0UsaUJBQWtCLENBTWxCLHVCQUF5QixDQUR6Qiw4QkFBZ0MsQ0FFaEMsc0NBQXVDLENBSHZDLFNBSUYsQ0FDQSx1Q0FDRSw4QkFDRSx3QkFDRixDQUNGIiwiZmlsZSI6IlRhYnMubW9kdWxlLnNjc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4uc3Itb25seSB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgd2lkdGg6IDFweDtcbiAgaGVpZ2h0OiAxcHg7XG4gIHBhZGRpbmc6IDA7XG4gIG1hcmdpbjogLTFweDtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgY2xpcDogcmVjdCgwLCAwLCAwLCAwKTtcbiAgYm9yZGVyOiAwO1xufVxuXG4uaGlkZGVuIHtcbiAgZGlzcGxheTogbm9uZTtcbn1cblxuLnNsaWRlLWluIHtcbiAgYW5pbWF0aW9uOiBzbGlkZS1pbiAwLjVzIGZvcndhcmRzO1xufVxuQG1lZGlhIChwcmVmZXJzLXJlZHVjZWQtbW90aW9uOiByZWR1Y2UpIHtcbiAgLnNsaWRlLWluIHtcbiAgICBhbmltYXRpb24tZHVyYXRpb246IDAuMW1zO1xuICB9XG59XG5cbi5zbGlkZS1vdXQge1xuICBhbmltYXRpb246IHNsaWRlLW91dCAwLjVzIGZvcndhcmRzO1xufVxuQG1lZGlhIChwcmVmZXJzLXJlZHVjZWQtbW90aW9uOiByZWR1Y2UpIHtcbiAgLnNsaWRlLW91dCB7XG4gICAgYW5pbWF0aW9uLWR1cmF0aW9uOiAwLjFtcztcbiAgfVxufVxuXG5Aa2V5ZnJhbWVzIHNsaWRlLWluIHtcbiAgMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgxMDB2aCk7XG4gIH1cbiAgMTAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDAlKTtcbiAgfVxufVxuQGtleWZyYW1lcyBzbGlkZS1vdXQge1xuICAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDAlKTtcbiAgfVxuICAxMDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTAwdmgpO1xuICB9XG59XG4udGFicyB7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXRhYnMtYmFja2dyb3VuZC1jb2xvcik7XG4gIHBhZGRpbmc6IDFyZW0gMS4yNXJlbTtcbiAgYm9yZGVyLXJhZGl1czogMC41cmVtO1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBnYXA6IDFyZW07XG59XG5cbi50YWJsaXN0IHtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC13cmFwOiBub3dyYXA7XG4gIG92ZXJmbG93LXg6IGF1dG87XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgbWFyZ2luOiAtNXB4O1xuICBwYWRkaW5nOiA1cHg7XG4gIHotaW5kZXg6IDA7XG59XG4udGFibGlzdC5jZW50ZXIge1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbn1cbi50YWJsaXN0LnJpZ2h0IHtcbiAganVzdGlmeS1jb250ZW50OiBmbGV4LWVuZDtcbn1cblxuLmluZGljYXRvciB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgaGVpZ2h0OiBjYWxjKHZhcigtLXRhYi1hY3RpdmUtYm9yZGVyLWhlaWdodCkgLSB2YXIoLS10YWJsaXN0LWJvcmRlci13aWR0aCkpO1xuICBib3JkZXItcmFkaXVzOiAwLjEyNXJlbSAwLjEyNXJlbSAwIDA7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXRhYi1hY3RpdmUtYm9yZGVyLWNvbG9yKTtcbiAgei1pbmRleDogMjtcbiAgdHJhbnNpdGlvbi1wcm9wZXJ0eTogbGVmdCwgd2lkdGg7XG4gIHRyYW5zaXRpb24tZHVyYXRpb246IDAuMnM7XG4gIHRyYW5zaXRpb24tdGltaW5nLWZ1bmN0aW9uOiBlYXNlLWluLW91dDtcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5pbmRpY2F0b3Ige1xuICAgIHRyYW5zaXRpb24tZHVyYXRpb246IDAuMW1zO1xuICB9XG59Il19 */";
+var classes = {"sr-only":"Tabs-module_sr-only__XnAVz","hidden":"Tabs-module_hidden__lvN6c","slide-in":"Tabs-module_slide-in__mbWej","slide-out":"Tabs-module_slide-out__ep10Q","tabs":"Tabs-module_tabs__z-Cun","tablist":"Tabs-module_tablist__QY6qv","center":"Tabs-module_center__m4ZMa","right":"Tabs-module_right__Dvfbh","indicator":"Tabs-module_indicator__b8TYY"};
+styleInject(css_248z);
+
+export { classes as default };
+//# sourceMappingURL=Tabs.module.scss.esm.js.map

package/dist/esm/Tabs/Tabs.module.scss.esm.js.map

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

package/dist/esm/Tag/RemoveButton.esm.js

@@ -1,2 +1,32 @@
-import e,{forwardRef as o}from"react";import{Icon as m,Icons as t}from"../Icon/Icon.esm.js";import s from"../src/readyclasses.module.esm.js";import r from"./RemoveButton.module.esm.js";const a=({removeLabel:o="Remove",label:a,onRemove:l,...n},c)=>{var i;return l&&e.createElement("button",{title:"",type:"button",...n,ref:c,className:`${r["remove"]} ${(i=n.className)!==null&&i!==void 0?i:""}`,onClick:l},e.createElement(m,{icon:t.Times,className:r["icon"]}),e.createElement("span",{className:s["sr-only"]},o,a?" "+a:""))};const l=o(a);export{l as RemoveButton};
+import React, { forwardRef } from 'react';
+import { Icon, Icons } from '../Icon/Icon.esm.js';
+import readyclasses from '../src/readyclasses.module.scss.esm.js';
+import classes from './RemoveButton.module.scss.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 RemoveButtonComponent = ({ removeLabel = "Remove", label, onRemove, ...rest }, ref) => {
+    var _a;
+    return (onRemove && (React.createElement("button", { title: "", type: "button", ...rest, ref: ref, className: `${classes["remove"]} ${(_a = rest.className) !== null && _a !== void 0 ? _a : ""}`, onClick: onRemove },
+        React.createElement(Icon, { icon: Icons.Times, className: classes["icon"] }),
+        React.createElement("span", { className: readyclasses["sr-only"] },
+            removeLabel,
+            label ? " " + label : ""))));
+};
+const RemoveButton = forwardRef(RemoveButtonComponent);
+
+export { RemoveButton };
 //# sourceMappingURL=RemoveButton.esm.js.map

package/dist/esm/Tag/RemoveButton.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"RemoveButton.esm.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":["RemoveButtonComponent","removeLabel","label","onRemove","rest","ref","React","createElement","title","type","className","classes","_a","onClick","Icon","icon","Icons","Times","readyclasses","RemoveButton","forwardRef"],"mappings":"yLA4BA,MAAMA,EAA4E,EAC9EC,cAAc,SAAUC,QAAOC,cAAaC,GAC9CC,WAEA,OACEF,GACEG,EAAAC,cAAA,SAAA,CACEC,MAAM,GACNC,KAAK,YACDL,EACJC,IAAKA,EACLK,UAAW,GAAGC,EAAQ,cAAaC,EAAAR,EAAKM,aAAa,MAAAE,SAAA,EAAAA,EAAA,KACrDC,QAASV,GAETG,EAAAC,cAACO,EAAI,CAACC,KAAMC,EAAMC,MAAOP,UAAWC,EAAQ,UAC5CL,EAAAC,cAAA,OAAA,CAAMG,UAAWQ,EAAa,YAC3BjB,EACAC,EAAQ,IAAMA,EAAQ,IAI7B,QAGSiB,EAAeC,EAAWpB"}
+{"version":3,"file":"RemoveButton.esm.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":";;;;;AAAA;;;;;;;;;;;;;;AAcG;AAcH,MAAM,qBAAqB,GAAuD,CAChF,EAAE,WAAW,GAAG,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAS,EAC3D,GAAG,KACD;;AACF,IAAA,QACE,QAAQ,KACN,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAC,EAAE,EACR,IAAI,EAAC,QAAQ,EAAA,GACT,IAAI,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,CAAG,EAAA,OAAO,CAAC,QAAQ,CAAC,CAAI,CAAA,EAAA,CAAA,EAAA,GAAA,IAAI,CAAC,SAAS,MAAI,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAA,EAAE,EAAE,EACzD,OAAO,EAAE,QAAQ,EAAA;AAEjB,QAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAE,KAAK,CAAC,KAAK,EAAE,SAAS,EAAE,OAAO,CAAC,MAAM,CAAC,EAAI,CAAA;AACvD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,YAAY,CAAC,SAAS,CAAC,EAAA;YACrC,WAAW;AACX,YAAA,KAAK,GAAG,GAAG,GAAG,KAAK,GAAG,EAAE,CACpB,CACA,CACV,EACD;AACJ,CAAC,CAAC;MAEW,YAAY,GAAG,UAAU,CAAC,qBAAqB;;;;"}

package/dist/esm/Tag/RemoveButton.module.scss.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*!\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/*!\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/*!\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-module_sr-only__395Xl{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.RemoveButton-module_hidden__eKGPT{display:none}.RemoveButton-module_slide-in__ZVj2V{animation:RemoveButton-module_slide-in__ZVj2V .5s forwards}@media (prefers-reduced-motion:reduce){.RemoveButton-module_slide-in__ZVj2V{animation-duration:.1ms}}.RemoveButton-module_slide-out__2S-4s{animation:RemoveButton-module_slide-out__2S-4s .5s forwards}@media (prefers-reduced-motion:reduce){.RemoveButton-module_slide-out__2S-4s{animation-duration:.1ms}}@keyframes RemoveButton-module_slide-in__ZVj2V{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes RemoveButton-module_slide-out__2S-4s{0%{transform:translateY(0)}to{transform:translateY(100vh)}}.RemoveButton-module_remove__Q60E1{background:none;border:none;cursor:pointer;height:1.25rem;margin-right:-.375rem;padding:0;width:1.25rem}.RemoveButton-module_remove__Q60E1:hover{background-color:var(--color-black10);border-radius:.125rem}.RemoveButton-module_remove__Q60E1:active{background-color:var(--color-blue-grey400)}.RemoveButton-module_remove__Q60E1:focus-visible{border-radius:var(--focus-border-radius);outline:.125rem solid var(--color-focus);outline-offset:0}.RemoveButton-module_remove__Q60E1 .RemoveButton-module_icon__4KpuX{font-size:.625rem}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlJlbW92ZUJ1dHRvbi5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRTtBQUNGOzs7Ozs7Ozs7Ozs7OztFQWNFO0FBQ0Y7Ozs7Ozs7Ozs7Ozs7O0VBY0UsQ0FDRixvQ0FPRSxrQkFBc0IsQ0FDdEIsUUFBUyxDQUxULFVBQVcsQ0FFWCxXQUFZLENBQ1osZUFBZ0IsQ0FGaEIsU0FBVSxDQUhWLGlCQUFrQixDQUNsQixTQU9GLENBRUEsbUNBQ0UsWUFDRixDQUVBLHFDQUNFLDBEQUNGLENBQ0EsdUNBQ0UscUNBQ0UsdUJBQ0YsQ0FDRixDQUVBLHNDQUNFLDJEQUNGLENBQ0EsdUNBQ0Usc0NBQ0UsdUJBQ0YsQ0FDRixDQUVBLCtDQUNFLEdBQ0UsMkJBQ0YsQ0FDQSxHQUNFLHVCQUNGLENBQ0YsQ0FDQSxnREFDRSxHQUNFLHVCQUNGLENBQ0EsR0FDRSwyQkFDRixDQUNGLENBQ0EsbUNBR0UsZUFBZ0IsQ0FDaEIsV0FBWSxDQUdaLGNBQWUsQ0FMZixjQUFlLENBSWYscUJBQXVCLENBRHZCLFNBQVUsQ0FKVixhQU9GLENBQ0EseUNBRUUscUNBQXNDLENBRHRDLHFCQUVGLENBQ0EsMENBQ0UsMENBQ0YsQ0FDQSxpREFHRSx3Q0FBeUMsQ0FGekMsd0NBQTBDLENBQzFDLGdCQUVGLENBQ0Esb0VBQ0UsaUJBQ0YiLCJmaWxlIjoiUmVtb3ZlQnV0dG9uLm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4vKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLnNyLW9ubHkge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHdpZHRoOiAxcHg7XG4gIGhlaWdodDogMXB4O1xuICBwYWRkaW5nOiAwO1xuICBtYXJnaW46IC0xcHg7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIGNsaXA6IHJlY3QoMCwgMCwgMCwgMCk7XG4gIGJvcmRlcjogMDtcbn1cblxuLmhpZGRlbiB7XG4gIGRpc3BsYXk6IG5vbmU7XG59XG5cbi5zbGlkZS1pbiB7XG4gIGFuaW1hdGlvbjogc2xpZGUtaW4gMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1pbiB7XG4gICAgYW5pbWF0aW9uLWR1cmF0aW9uOiAwLjFtcztcbiAgfVxufVxuXG4uc2xpZGUtb3V0IHtcbiAgYW5pbWF0aW9uOiBzbGlkZS1vdXQgMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1vdXQge1xuICAgIGFuaW1hdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cblxuQGtleWZyYW1lcyBzbGlkZS1pbiB7XG4gIDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTAwdmgpO1xuICB9XG4gIDEwMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbn1cbkBrZXlmcmFtZXMgc2xpZGUtb3V0IHtcbiAgMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbiAgMTAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMHZoKTtcbiAgfVxufVxuLnJlbW92ZSB7XG4gIHdpZHRoOiAxLjI1cmVtO1xuICBoZWlnaHQ6IDEuMjVyZW07XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIGJvcmRlcjogbm9uZTtcbiAgcGFkZGluZzogMDtcbiAgbWFyZ2luLXJpZ2h0OiAtMC4zNzVyZW07XG4gIGN1cnNvcjogcG9pbnRlcjtcbn1cbi5yZW1vdmU6aG92ZXIge1xuICBib3JkZXItcmFkaXVzOiAwLjEyNXJlbTtcbiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tY29sb3ItYmxhY2sxMCk7XG59XG4ucmVtb3ZlOmFjdGl2ZSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWNvbG9yLWJsdWUtZ3JleTQwMCk7XG59XG4ucmVtb3ZlOmZvY3VzLXZpc2libGUge1xuICBvdXRsaW5lOiAwLjEyNXJlbSBzb2xpZCB2YXIoLS1jb2xvci1mb2N1cyk7XG4gIG91dGxpbmUtb2Zmc2V0OiAwO1xuICBib3JkZXItcmFkaXVzOiB2YXIoLS1mb2N1cy1ib3JkZXItcmFkaXVzKTtcbn1cbi5yZW1vdmUgLmljb24ge1xuICBmb250LXNpemU6IDAuNjI1cmVtO1xufSJdfQ== */";
+var classes = {"sr-only":"RemoveButton-module_sr-only__395Xl","hidden":"RemoveButton-module_hidden__eKGPT","slide-in":"RemoveButton-module_slide-in__ZVj2V","slide-out":"RemoveButton-module_slide-out__2S-4s","remove":"RemoveButton-module_remove__Q60E1","icon":"RemoveButton-module_icon__4KpuX"};
+styleInject(css_248z);
+
+export { classes as default };
+//# sourceMappingURL=RemoveButton.module.scss.esm.js.map

package/dist/esm/Tag/RemoveButton.module.scss.esm.js.map

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

package/dist/esm/Tag/Tag.esm.js

@@ -1,2 +1,47 @@
-import e,{forwardRef as r}from"react";import{Icon as o,Icons as t}from"../Icon/Icon.esm.js";import a from"./Tag.module.esm.js";import{Typography as n}from"../Typography/Typography.esm.js";import{RemoveButton as i}from"./RemoveButton.esm.js";const s=({children:r,variant:s,icon:l,backgroundColor:m,color:c,shape:d="rounded",removeButton:p={},...u},h)=>{var b;const g=()=>{if(l)return e.createElement(o,{size:"inherit",icon:l});if(s==="enabled")return e.createElement(o,{size:"inherit",icon:t.CheckmarkCircleAlt});else if(s==="disabled")return e.createElement(o,{size:"inherit",icon:t.Forbidden})};const f=[a["tag"]];s==="enabled"&&f.push(a["tag-enabled"]);s==="disabled"&&f.push(a["tag-disabled"]);d==="sharp"&&f.push(a["sharp"]);return e.createElement("div",{...u,ref:h,className:`${f.join(" ")} ${(b=u.className)!==null&&b!==void 0?b:""}`,style:{backgroundColor:m,color:c}},g(),e.createElement(n,{spacing:{marginBottom:0},variant:"body",className:a["label"]},r),e.createElement(i,{...p,label:r}))};const l=r(s);export{l as Tag};
+import React, { forwardRef } from 'react';
+import { Icon, Icons } from '../Icon/Icon.esm.js';
+import classes from './Tag.module.scss.esm.js';
+import { Typography } from '../Typography/Typography.esm.js';
+import { RemoveButton } from './RemoveButton.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 TagComponent = ({ children, variant, icon, backgroundColor, color, shape = "rounded", removeButton = {}, ...rest }, ref) => {
+    var _a;
+    const determineIcon = () => {
+        if (icon) {
+            return React.createElement(Icon, { size: "inherit", icon: icon });
+        }
+        if (variant === "enabled") {
+            return React.createElement(Icon, { size: "inherit", icon: Icons.CheckmarkCircleAlt });
+        }
+        else if (variant === "disabled") {
+            return React.createElement(Icon, { size: "inherit", icon: Icons.Forbidden });
+        }
+    };
+    const tagClasses = [classes["tag"]];
+    variant === "enabled" && tagClasses.push(classes["tag-enabled"]);
+    variant === "disabled" && tagClasses.push(classes["tag-disabled"]);
+    shape === "sharp" && tagClasses.push(classes["sharp"]);
+    return (React.createElement("div", { ...rest, ref: ref, className: `${tagClasses.join(" ")} ${(_a = rest.className) !== null && _a !== void 0 ? _a : ""}`, style: { backgroundColor, color } },
+        determineIcon(),
+        React.createElement(Typography, { spacing: { marginBottom: 0 }, variant: "body", className: classes["label"] }, children),
+        React.createElement(RemoveButton, { ...removeButton, label: children })));
+};
+const Tag = forwardRef(TagComponent);
+
+export { Tag };
 //# sourceMappingURL=Tag.esm.js.map

package/dist/esm/Tag/Tag.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.esm.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 as any}\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":["TagComponent","children","variant","icon","backgroundColor","color","shape","removeButton","rest","ref","determineIcon","React","createElement","Icon","size","Icons","CheckmarkCircleAlt","Forbidden","tagClasses","classes","push","className","join","_a","style","Typography","spacing","marginBottom","RemoveButton","label","Tag","forwardRef"],"mappings":"iPAgCA,MAAMA,EAAgE,EAElEC,WACAC,UACAC,OACAC,kBACAC,QACAC,QAAQ,UACRC,eAAe,CAAA,KACZC,GAELC,WAEA,MAAMC,EAAgB,KACpB,GAAIP,EACF,OAAOQ,EAAAC,cAACC,EAAI,CAACC,KAAK,UAAUX,KAAMA,IAGpC,GAAID,IAAY,UACd,OAAOS,EAACC,cAAAC,EAAK,CAAAC,KAAK,UAAUX,KAAMY,EAAMC,0BACnC,GAAId,IAAY,WACrB,OAAOS,EAACC,cAAAC,EAAK,CAAAC,KAAK,UAAUX,KAAMY,EAAME,WACzC,EAGH,MAAMC,EAAa,CAACC,EAAQ,QAC5BjB,IAAY,WAAagB,EAAWE,KAAKD,EAAQ,gBACjDjB,IAAY,YAAcgB,EAAWE,KAAKD,EAAQ,iBAClDb,IAAU,SAAWY,EAAWE,KAAKD,EAAQ,UAE7C,OACER,EAAAC,cAAA,MAAA,IACMJ,EACJC,IAAKA,EACLY,UAAW,GAAGH,EAAWI,KAAK,SAAQC,EAAAf,EAAKa,gCAAa,KACxDG,MAAO,CAAEpB,kBAAiBC,UAEzBK,IACDC,EAACC,cAAAa,GAAWC,QAAS,CAAEC,aAAc,GAAKzB,QAAQ,OAAOmB,UAAWF,EAAQ,UACzElB,GAEHU,EAACC,cAAAgB,EAAiB,IAAArB,EAAcsB,MAAO5B,IAEzC,QAGS6B,EAAMC,EAAW/B"}
+{"version":3,"file":"Tag.esm.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 as any}\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":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;AAkBH,MAAM,YAAY,GAAoD,CACpE,EACE,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,eAAe,EACf,KAAK,EACL,KAAK,GAAG,SAAS,EACjB,YAAY,GAAG,EAAE,EACjB,GAAG,IAAI,EACD,EACR,GAAG,KACD;;IACF,MAAM,aAAa,GAAG,MAAK;QACzB,IAAI,IAAI,EAAE;YACR,OAAO,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAC,SAAS,EAAC,IAAI,EAAE,IAAI,EAAA,CAAI,CAAC;SAC5C;AAED,QAAA,IAAI,OAAO,KAAK,SAAS,EAAE;AACzB,YAAA,OAAO,KAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,IAAI,EAAC,SAAS,EAAC,IAAI,EAAE,KAAK,CAAC,kBAAkB,GAAI,CAAC;SAChE;AAAM,aAAA,IAAI,OAAO,KAAK,UAAU,EAAE;AACjC,YAAA,OAAO,KAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,IAAI,EAAC,SAAS,EAAC,IAAI,EAAE,KAAK,CAAC,SAAS,GAAI,CAAC;SACvD;AACH,KAAC,CAAC;IAEF,MAAM,UAAU,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC;AACpC,IAAA,OAAO,KAAK,SAAS,IAAI,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC;AACjE,IAAA,OAAO,KAAK,UAAU,IAAI,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC;AACnE,IAAA,KAAK,KAAK,OAAO,IAAI,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;AAEvD,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GACM,IAAI,EACR,GAAG,EAAE,GAAU,EACf,SAAS,EAAE,CAAA,EAAG,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA,CAAA,EAAI,CAAA,EAAA,GAAA,IAAI,CAAC,SAAS,mCAAI,EAAE,CAAA,CAAE,EAC5D,KAAK,EAAE,EAAE,eAAe,EAAE,KAAK,EAAE,EAAA;AAEhC,QAAA,aAAa,EAAE;QAChB,KAAC,CAAA,aAAA,CAAA,UAAU,IAAC,OAAO,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,EAAE,OAAO,EAAC,MAAM,EAAC,SAAS,EAAE,OAAO,CAAC,OAAO,CAAC,EACjF,EAAA,QAAQ,CACE;QACb,KAAC,CAAA,aAAA,CAAA,YAAY,EAAK,EAAA,GAAA,YAAY,EAAE,KAAK,EAAE,QAAQ,EAAA,CAAI,CAC/C,EACN;AACJ,CAAC,CAAC;MAEW,GAAG,GAAG,UAAU,CAAC,YAAY;;;;"}

package/dist/esm/Tag/Tag.module.scss.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*!\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 */.Tag-module_tag__0Cfjz{align-items:center;border:none;border-radius:3.125rem;display:inline-flex;font-size:.75rem;gap:.25rem;padding:.25rem .75rem}.Tag-module_tag__0Cfjz.Tag-module_tag-enabled__EsuwO{background-color:var(--color-green100)}.Tag-module_tag__0Cfjz.Tag-module_tag-disabled__VDbWz{background-color:var(--color-blue-grey100)}.Tag-module_tag__0Cfjz.Tag-module_sharp__fTYmZ{border-radius:.125rem}.Tag-module_tag__0Cfjz .Tag-module_label__aGRya{color:inherit;font-size:inherit;line-height:2}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRSxDQUNGLHVCQU1FLGtCQUFtQixDQUhuQixXQUFZLENBQ1osc0JBQXVCLENBQ3ZCLG1CQUFvQixDQUpwQixnQkFBa0IsQ0FNbEIsVUFBWSxDQUxaLHFCQU1GLENBQ0EscURBQ0Usc0NBQ0YsQ0FDQSxzREFDRSwwQ0FDRixDQUNBLCtDQUNFLHFCQUNGLENBQ0EsZ0RBR0UsYUFBYyxDQURkLGlCQUFrQixDQURsQixhQUdGIiwiZmlsZSI6IlRhZy5tb2R1bGUuc2NzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4udGFnIHtcbiAgZm9udC1zaXplOiAwLjc1cmVtO1xuICBwYWRkaW5nOiAwLjI1cmVtIDAuNzVyZW07XG4gIGJvcmRlcjogbm9uZTtcbiAgYm9yZGVyLXJhZGl1czogMy4xMjVyZW07XG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBnYXA6IDAuMjVyZW07XG59XG4udGFnLnRhZy1lbmFibGVkIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tY29sb3ItZ3JlZW4xMDApO1xufVxuLnRhZy50YWctZGlzYWJsZWQge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1jb2xvci1ibHVlLWdyZXkxMDApO1xufVxuLnRhZy5zaGFycCB7XG4gIGJvcmRlci1yYWRpdXM6IDAuMTI1cmVtO1xufVxuLnRhZyAubGFiZWwge1xuICBsaW5lLWhlaWdodDogMjtcbiAgZm9udC1zaXplOiBpbmhlcml0O1xuICBjb2xvcjogaW5oZXJpdDtcbn0iXX0= */";
+var classes = {"tag":"Tag-module_tag__0Cfjz","tag-enabled":"Tag-module_tag-enabled__EsuwO","tag-disabled":"Tag-module_tag-disabled__VDbWz","sharp":"Tag-module_sharp__fTYmZ","label":"Tag-module_label__aGRya"};
+styleInject(css_248z);
+
+export { classes as default };
+//# sourceMappingURL=Tag.module.scss.esm.js.map

package/dist/esm/Tag/Tag.module.scss.esm.js.map

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

package/dist/esm/TextEllipsis/TextEllipsis.esm.js

@@ -1,2 +1,43 @@
-import e,{useState as o,useRef as r}from"react";import{Popover as t}from"../Popover/Popover.esm.js";import s from"./TextEllipsis.module.esm.js";const l=({children:l,popoverClassName:n,className:a,...c},i)=>{const[u,m]=o(false);const d=r(null);const p=()=>{if(d.current&&d.current.offsetWidth<d.current.scrollWidth)return true;return false};const f=()=>{p()&&m(true)};const v=()=>{p()&&m(false)};return e.createElement("div",{...c,onMouseEnter:f,onMouseLeave:v,className:`${s["text-ellipsis"]} ${a!==null&&a!==void 0?a:""}`,ref:i!==null&&i!==void 0?i:d},l,e.createElement(t,{"aria-hidden":true,"data-hidden":!u,show:u,role:"tooltip",anchorEl:d,className:`${s.popover} ${n!==null&&n!==void 0?n:""}`},l))};const n=e.forwardRef(l);export{n as TextEllipsis};
+import React, { useState, useRef } from 'react';
+import { Popover } from '../Popover/Popover.esm.js';
+import classes from './TextEllipsis.module.scss.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 TextEllipsisComponent = ({ children, popoverClassName, className, ...rest }, ref) => {
+    const [showPopover, setShowPopover] = useState(false);
+    const textContainer = useRef(null);
+    const ellipsisVisible = () => {
+        if (textContainer.current &&
+            textContainer.current.offsetWidth < textContainer.current.scrollWidth) {
+            return true;
+        }
+        return false;
+    };
+    const onMouseEnter = () => {
+        ellipsisVisible() && setShowPopover(true);
+    };
+    const onMouseLeave = () => {
+        ellipsisVisible() && setShowPopover(false);
+    };
+    return (React.createElement("div", { ...rest, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, className: `${classes["text-ellipsis"]} ${className !== null && className !== void 0 ? className : ""}`, ref: ref !== null && ref !== void 0 ? ref : textContainer },
+        children,
+        React.createElement(Popover, { "aria-hidden": true, "data-hidden": !showPopover, show: showPopover, role: "tooltip", anchorEl: textContainer, className: `${classes.popover} ${popoverClassName !== null && popoverClassName !== void 0 ? popoverClassName : ""}` }, children)));
+};
+const TextEllipsis = React.forwardRef(TextEllipsisComponent);
+
+export { TextEllipsis };
 //# sourceMappingURL=TextEllipsis.esm.js.map

package/dist/esm/TextEllipsis/TextEllipsis.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextEllipsis.esm.js","sources":["../../../../../src/components/TextEllipsis/TextEllipsis.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  useRef,\n  MouseEventHandler,\n  useState,\n  ComponentPropsWithRef\n} from \"react\";\nimport { Popover } from \"../Popover/Popover\";\nimport classes from \"./TextEllipsis.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  children?: string;\n  popoverClassName?: string;\n}\n\nconst TextEllipsisComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  { children, popoverClassName, className, ...rest }: Props,\n  ref\n) => {\n  const [showPopover, setShowPopover] = useState(false);\n  const textContainer = useRef<HTMLDivElement>(null);\n\n  const ellipsisVisible = () => {\n    if (\n      textContainer.current &&\n      textContainer.current.offsetWidth < textContainer.current.scrollWidth\n    ) {\n      return true;\n    }\n    return false;\n  };\n\n  const onMouseEnter: MouseEventHandler<HTMLDivElement> = () => {\n    ellipsisVisible() && setShowPopover(true);\n  };\n\n  const onMouseLeave: MouseEventHandler<HTMLDivElement> = () => {\n    ellipsisVisible() && setShowPopover(false);\n  };\n\n  return (\n    <div\n      {...rest}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      className={`${classes[\"text-ellipsis\"]} ${className ?? \"\"}`}\n      ref={ref ?? textContainer}\n    >\n      {children}\n      <Popover\n        aria-hidden={true}\n        data-hidden={!showPopover}\n        show={showPopover}\n        role=\"tooltip\"\n        anchorEl={textContainer}\n        className={`${classes.popover} ${popoverClassName ?? \"\"}`}\n      >\n        {children}\n      </Popover>\n    </div>\n  );\n};\n\nexport const TextEllipsis = React.forwardRef(TextEllipsisComponent);\n"],"names":["TextEllipsisComponent","children","popoverClassName","className","rest","ref","showPopover","setShowPopover","useState","textContainer","useRef","ellipsisVisible","current","offsetWidth","scrollWidth","onMouseEnter","onMouseLeave","React","createElement","classes","Popover","show","role","anchorEl","popover","TextEllipsis","forwardRef"],"mappings":"gJA+BA,MAAMA,EAAyE,EAC3EC,WAAUC,mBAAkBC,eAAcC,GAC5CC,KAEA,MAAOC,EAAaC,GAAkBC,EAAS,OAC/C,MAAMC,EAAgBC,EAAuB,MAE7C,MAAMC,EAAkB,KACtB,GACEF,EAAcG,SACdH,EAAcG,QAAQC,YAAcJ,EAAcG,QAAQE,YAE1D,OAAO,KAET,OAAO,KAAK,EAGd,MAAMC,EAAkD,KACtDJ,KAAqBJ,EAAe,KAAK,EAG3C,MAAMS,EAAkD,KACtDL,KAAqBJ,EAAe,MAAM,EAG5C,OACEU,EACMC,cAAA,MAAA,IAAAd,EACJW,aAAcA,EACdC,aAAcA,EACdb,UAAW,GAAGgB,EAAQ,oBAAoBhB,IAAA,MAAAA,SAAA,EAAAA,EAAa,KACvDE,IAAKA,IAAG,MAAHA,SAAA,EAAAA,EAAOI,GAEXR,EACDgB,EAAAC,cAACE,EACc,CAAA,cAAA,KACA,eAACd,EACde,KAAMf,EACNgB,KAAK,UACLC,SAAUd,EACVN,UAAW,GAAGgB,EAAQK,WAAWtB,UAAAA,SAAgB,EAAhBA,EAAoB,MAEpDD,GAGL,EAGS,MAAAwB,EAAeR,EAAMS,WAAW1B"}
+{"version":3,"file":"TextEllipsis.esm.js","sources":["../../../../../src/components/TextEllipsis/TextEllipsis.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  useRef,\n  MouseEventHandler,\n  useState,\n  ComponentPropsWithRef\n} from \"react\";\nimport { Popover } from \"../Popover/Popover\";\nimport classes from \"./TextEllipsis.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  children?: string;\n  popoverClassName?: string;\n}\n\nconst TextEllipsisComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  { children, popoverClassName, className, ...rest }: Props,\n  ref\n) => {\n  const [showPopover, setShowPopover] = useState(false);\n  const textContainer = useRef<HTMLDivElement>(null);\n\n  const ellipsisVisible = () => {\n    if (\n      textContainer.current &&\n      textContainer.current.offsetWidth < textContainer.current.scrollWidth\n    ) {\n      return true;\n    }\n    return false;\n  };\n\n  const onMouseEnter: MouseEventHandler<HTMLDivElement> = () => {\n    ellipsisVisible() && setShowPopover(true);\n  };\n\n  const onMouseLeave: MouseEventHandler<HTMLDivElement> = () => {\n    ellipsisVisible() && setShowPopover(false);\n  };\n\n  return (\n    <div\n      {...rest}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      className={`${classes[\"text-ellipsis\"]} ${className ?? \"\"}`}\n      ref={ref ?? textContainer}\n    >\n      {children}\n      <Popover\n        aria-hidden={true}\n        data-hidden={!showPopover}\n        show={showPopover}\n        role=\"tooltip\"\n        anchorEl={textContainer}\n        className={`${classes.popover} ${popoverClassName ?? \"\"}`}\n      >\n        {children}\n      </Popover>\n    </div>\n  );\n};\n\nexport const TextEllipsis = React.forwardRef(TextEllipsisComponent);\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAiBH,MAAM,qBAAqB,GAAoD,CAC7E,EAAE,QAAQ,EAAE,gBAAgB,EAAE,SAAS,EAAE,GAAG,IAAI,EAAS,EACzD,GAAG,KACD;IACF,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AACtD,IAAA,MAAM,aAAa,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEnD,MAAM,eAAe,GAAG,MAAK;QAC3B,IACE,aAAa,CAAC,OAAO;YACrB,aAAa,CAAC,OAAO,CAAC,WAAW,GAAG,aAAa,CAAC,OAAO,CAAC,WAAW,EACrE;AACA,YAAA,OAAO,IAAI,CAAC;SACb;AACD,QAAA,OAAO,KAAK,CAAC;AACf,KAAC,CAAC;IAEF,MAAM,YAAY,GAAsC,MAAK;AAC3D,QAAA,eAAe,EAAE,IAAI,cAAc,CAAC,IAAI,CAAC,CAAC;AAC5C,KAAC,CAAC;IAEF,MAAM,YAAY,GAAsC,MAAK;AAC3D,QAAA,eAAe,EAAE,IAAI,cAAc,CAAC,KAAK,CAAC,CAAC;AAC7C,KAAC,CAAC;AAEF,IAAA,QACE,KACM,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAA,IAAI,EACR,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,CAAA,EAAG,OAAO,CAAC,eAAe,CAAC,CAAA,CAAA,EAAI,SAAS,KAAT,IAAA,IAAA,SAAS,KAAT,KAAA,CAAA,GAAA,SAAS,GAAI,EAAE,CAAA,CAAE,EAC3D,GAAG,EAAE,GAAG,KAAA,IAAA,IAAH,GAAG,KAAH,KAAA,CAAA,GAAA,GAAG,GAAI,aAAa,EAAA;QAExB,QAAQ;AACT,QAAA,KAAA,CAAA,aAAA,CAAC,OAAO,EACO,EAAA,aAAA,EAAA,IAAI,EACJ,aAAA,EAAA,CAAC,WAAW,EACzB,IAAI,EAAE,WAAW,EACjB,IAAI,EAAC,SAAS,EACd,QAAQ,EAAE,aAAa,EACvB,SAAS,EAAE,GAAG,OAAO,CAAC,OAAO,CAAI,CAAA,EAAA,gBAAgB,aAAhB,gBAAgB,KAAA,KAAA,CAAA,GAAhB,gBAAgB,GAAI,EAAE,CAAE,CAAA,EAAA,EAExD,QAAQ,CACD,CACN,EACN;AACJ,CAAC,CAAC;AAEW,MAAA,YAAY,GAAG,KAAK,CAAC,UAAU,CAAC,qBAAqB;;;;"}

package/dist/esm/TextEllipsis/TextEllipsis.module.scss.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../node_modules/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*!\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 */.TextEllipsis-module_text-ellipsis__qcPly{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.TextEllipsis-module_popover__cfEFR{border-radius:.25rem;box-shadow:0 .1875rem .375rem #0000004a;max-width:min(75ch,90%);padding:.6875rem .6875rem .6875rem .875rem;transform:scale(1);transition-property:opacity;white-space:pre-wrap;z-index:1}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRleHRFbGxpcHNpcy5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRSxDQUNGLDBDQUNFLGVBQWdCLENBQ2hCLHNCQUF1QixDQUN2QixrQkFDRixDQUVBLG9DQUdFLG9CQUFzQixDQUN0Qix1Q0FBb0QsQ0FIcEQsdUJBQXlCLENBQ3pCLDBDQUErQyxDQUsvQyxrQkFBbUIsQ0FEbkIsMkJBQTRCLENBRDVCLG9CQUFxQixDQUdyQixTQUNGIiwiZmlsZSI6IlRleHRFbGxpcHNpcy5tb2R1bGUuc2NzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4udGV4dC1lbGxpcHNpcyB7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xufVxuXG4ucG9wb3ZlciB7XG4gIG1heC13aWR0aDogbWluKDc1Y2gsIDkwJSk7XG4gIHBhZGRpbmc6IDAuNjg3NXJlbSAwLjY4NzVyZW0gMC42ODc1cmVtIDAuODc1cmVtO1xuICBib3JkZXItcmFkaXVzOiAwLjI1cmVtO1xuICBib3gtc2hhZG93OiAwIDAuMTg3NXJlbSAwLjM3NXJlbSByZ2JhKDAsIDAsIDAsIDAuMjkpO1xuICB3aGl0ZS1zcGFjZTogcHJlLXdyYXA7XG4gIHRyYW5zaXRpb24tcHJvcGVydHk6IG9wYWNpdHk7XG4gIHRyYW5zZm9ybTogc2NhbGUoMSk7XG4gIHotaW5kZXg6IDE7XG59Il19 */";
+var classes = {"text-ellipsis":"TextEllipsis-module_text-ellipsis__qcPly","popover":"TextEllipsis-module_popover__cfEFR"};
+styleInject(css_248z);
+
+export { classes as default };
+//# sourceMappingURL=TextEllipsis.module.scss.esm.js.map

package/dist/esm/TextEllipsis/TextEllipsis.module.scss.esm.js.map

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

package/dist/esm/Tiles/Tile.esm.js

@@ -1,2 +1,46 @@
-import e,{useState as t}from"react";import{Icon as a,Icons as l}from"../Icon/Icon.esm.js";import r from"./Tile.module.esm.js";import s from"../src/readyclasses.module.esm.js";import{generateID as o}from"../src/util/helper.esm.js";const n=({title:n,imageProps:c,enabled:m,className:i,loading:d,tileAction:u,...p},f)=>{const[E]=t(o(20));if(!n)throw new Error("Please make sure to pass a title prop to your Tile component.");const g=()=>{if(m)return"Status: enabled";return"Status: disabled"};return e.createElement("article",{...p,tabIndex:0,"aria-labelledby":E,ref:f,className:`${r["tile"]} ${d?r["loading"]:""}`},e.createElement("header",{style:{justifyContent:m===void 0?"flex-end":"space-between"}},m===true&&e.createElement(a,{color:"var(--success)",icon:l.Checkmark,className:`${r["icon"]} ${i!==null&&i!==void 0?i:""}`}),m===false&&e.createElement(a,{color:"var(--greyed-out)",icon:l.Forbidden,className:`${r["icon"]} ${i!==null&&i!==void 0?i:""}`}),m!==void 0&&e.createElement("span",{id:E,className:s["sr-only"]},`${n}. ${g()}`),u!==null&&u!==void 0?u:null),e.createElement("div",{className:r["content"]},c&&c.src.length>0&&e.createElement("figure",{className:r["image"]},!d&&e.createElement("img",{...c,alt:""})),(!c||c.src.length===0)&&e.createElement(a,{className:r["placeholder"],icon:l.Image}),e.createElement("span",{className:r["title"]},n)))};const c=e.forwardRef(n);export{c as Tile};
+import React, { useState } from 'react';
+import { Icon, Icons } from '../Icon/Icon.esm.js';
+import classes from './Tile.module.scss.esm.js';
+import readyclasses from '../src/readyclasses.module.scss.esm.js';
+import { generateID } from '../src/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 TileComponent = ({ title, imageProps, enabled, className, loading, tileAction, ...rest }, ref) => {
+    const [tileDescriptionID] = useState(generateID(20));
+    if (!title) {
+        throw new Error("Please make sure to pass a title prop to your Tile component.");
+    }
+    const statusMessage = () => {
+        if (enabled) {
+            return "Status: enabled";
+        }
+        return "Status: disabled";
+    };
+    return (React.createElement("article", { ...rest, tabIndex: 0, "aria-labelledby": tileDescriptionID, ref: ref, className: `${classes["tile"]} ${loading ? classes["loading"] : ""}` },
+        React.createElement("header", { style: { justifyContent: enabled === undefined ? "flex-end" : "space-between" } },
+            enabled === true && (React.createElement(Icon, { color: "var(--success)", icon: Icons.Checkmark, className: `${classes["icon"]} ${className !== null && className !== void 0 ? className : ""}` })),
+            enabled === false && (React.createElement(Icon, { color: "var(--greyed-out)", icon: Icons.Forbidden, className: `${classes["icon"]} ${className !== null && className !== void 0 ? className : ""}` })),
+            enabled !== undefined && (React.createElement("span", { id: tileDescriptionID, className: readyclasses["sr-only"] }, `${title}. ${statusMessage()}`)), tileAction !== null && tileAction !== void 0 ? tileAction : null),
+        React.createElement("div", { className: classes["content"] },
+            imageProps && imageProps.src.length > 0 && (React.createElement("figure", { className: classes["image"] }, !loading && React.createElement("img", { ...imageProps, alt: "" }))),
+            (!imageProps || imageProps.src.length === 0) && (React.createElement(Icon, { className: classes["placeholder"], icon: Icons.Image })),
+            React.createElement("span", { className: classes["title"] }, title))));
+};
+const Tile = React.forwardRef(TileComponent);
+
+export { Tile };
 //# sourceMappingURL=Tile.esm.js.map