@e1011/es-kit 1.4.0 → 1.5.2

package/dist/ui/esm/src/core/ui/components/atoms/text/anchor-link/anchorLink.module.scss.js

@@ -1,2 +1,10 @@
-var a={anchorLink:"anchorLink-module_anchorLink__-WJV4",disabled:"anchorLink-module_disabled__N9Qfv"};export{a as default};
+const n = "_anchorLink_1x8yn_17", s = "_disabled_1x8yn_22", a = {
+  anchorLink: n,
+  disabled: s
+};
+export {
+  n as anchorLink,
+  a as default,
+  s as disabled
+};
 //# sourceMappingURL=anchorLink.module.scss.js.map

package/dist/ui/esm/src/core/ui/components/atoms/text/anchor-link/anchorLink.module.scss.js.map

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

package/dist/ui/esm/src/core/ui/components/atoms/text/typography.module.scss.js

@@ -1,2 +1,22 @@
-var a={headline:"typography-module_headline__b0XlP",headlineSecondary:"typography-module_headlineSecondary__IDnhT",headlineTertiary:"typography-module_headlineTertiary__mlG-v",paragraph:"typography-module_paragraph__tgBAx",paragraphBold:"typography-module_paragraphBold__PmcZU",paragraphBoldSmall:"typography-module_paragraphBoldSmall__qExmY",paragraphSmall:"typography-module_paragraphSmall__vTMiI",link:"typography-module_link__DWurf"};export{a as default};
+const a = "_headline_4rzb0_17", r = "_headlineSecondary_4rzb0_22", l = "_headlineTertiary_4rzb0_27", e = "_paragraph_4rzb0_32", p = "_paragraphBold_4rzb0_32", n = "_paragraphBoldSmall_4rzb0_32", _ = "_paragraphSmall_4rzb0_32", h = "_link_4rzb0_46", d = {
+  headline: a,
+  headlineSecondary: r,
+  headlineTertiary: l,
+  paragraph: e,
+  paragraphBold: p,
+  paragraphBoldSmall: n,
+  paragraphSmall: _,
+  link: h
+};
+export {
+  d as default,
+  a as headline,
+  r as headlineSecondary,
+  l as headlineTertiary,
+  h as link,
+  e as paragraph,
+  p as paragraphBold,
+  n as paragraphBoldSmall,
+  _ as paragraphSmall
+};
 //# sourceMappingURL=typography.module.scss.js.map

package/dist/ui/esm/src/core/ui/components/atoms/text/typography.module.scss.js.map

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

package/dist/ui/esm/src/core/ui/components/atoms/textAndContent/TextAndContent.js

@@ -1,2 +1,76 @@
-import{extends as t}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as e,useMemo as o}from"react";import{PropsValidationError as n}from"../../error/propsValidationError.js";import{Text as r}from"../text/Text.js";import c from"./textAndContent.module.scss.js";import{LayoutBox as i}from"../../container/layoutBox/LayoutBox.js";import{IconBase as l}from"../../icon/IconBase.js";const a=e((e=>{let{text:o,children:l,components:a,leftContent:s,rightContent:m,textProps:x={},className:p="",...d}=e;if(null==o&&!l)throw new n("Missing `text or children` property!");const f=a?.TextComponent||r;return React.createElement(i,t({className:`${c.textAndContent} ${p}`},d),s&&s,React.createElement(f,t({className:"text-truncate"},x,{"data-testid":"text-content-text-component"}),o||l),m&&m)}));a.displayName="TextAndContent";const s=e((e=>{let{iconSize:n,iconColor:r,iconLeft:c,iconRight:i,iconLeftUrl:s,iconRightUrl:m,onLeftIconClick:x,onRightIconClick:p,...d}=e;const[f,u]=o((()=>{let e,o;if(c||s){const o=x?{onClick:x,onKeyDown:x,role:"button",tabIndex:-1,"data-testid":"text-content-icon-left"}:{};e=React.createElement(l,t({iconUrl:s,size:n,color:r},o),c&&c)}if(i||m){const e=p?{onClick:p,onKeyDown:p,role:"button",tabIndex:-1,"data-testid":"text-content-icon-right"}:{};o=React.createElement(l,t({iconUrl:m,size:n,color:r},e),i&&i)}return[e,o]}),[r,c,s,i,m,n,x,p]);return React.createElement(a,t({leftContent:f,rightContent:u},d))}));s.displayName="TextAndIcons";export{a as TextAndContent,s as TextAndIcons};
+import { jsxs as A, jsx as m } from "react/jsx-runtime";
+import { memo as u, useMemo as C } from "react";
+import { PropsValidationError as P } from "../../error/propsValidationError.js";
+import { Text as b } from "../text/Text.js";
+import w from "./textAndContent.module.scss.js";
+import { LayoutBox as N } from "../../container/layoutBox/LayoutBox.js";
+import { IconBase as i } from "../../icon/IconBase.js";
+const c = u(({
+  text: e,
+  children: r,
+  components: t,
+  leftContent: o,
+  rightContent: n,
+  textProps: d = {},
+  className: s = "",
+  ...a
+}) => {
+  if (e == null && !r)
+    throw new P("Missing `text or children` property!");
+  const x = (t == null ? void 0 : t.TextComponent) || b;
+  return /* @__PURE__ */ A(
+    N,
+    {
+      className: `${w.textAndContent} ${s}`,
+      ...a,
+      children: [
+        o && o,
+        /* @__PURE__ */ m(x, { className: "text-truncate", ...d, "data-testid": "text-content-text-component", children: e || r }),
+        n && n
+      ]
+    }
+  );
+});
+c.displayName = "TextAndContent";
+const I = u(({
+  iconSize: e,
+  iconColor: r,
+  iconLeft: t,
+  iconRight: o,
+  iconLeftUrl: n,
+  iconRightUrl: d,
+  onLeftIconClick: s,
+  onRightIconClick: a,
+  ...x
+}) => {
+  const [T, f] = C(() => {
+    let l, p;
+    return (t || n) && (l = /* @__PURE__ */ m(i, { iconUrl: n, size: e, color: r, ...s ? {
+      onClick: s,
+      onKeyDown: s,
+      role: "button",
+      tabIndex: -1,
+      "data-testid": "text-content-icon-left"
+    } : {}, children: t && t })), (o || d) && (p = /* @__PURE__ */ m(i, { iconUrl: d, size: e, color: r, ...a ? {
+      onClick: a,
+      onKeyDown: a,
+      role: "button",
+      tabIndex: -1,
+      "data-testid": "text-content-icon-right"
+    } : {}, children: o && o })), [l, p];
+  }, [r, t, n, o, d, e, s, a]);
+  return /* @__PURE__ */ m(
+    c,
+    {
+      leftContent: T,
+      rightContent: f,
+      ...x
+    }
+  );
+});
+I.displayName = "TextAndIcons";
+export {
+  c as TextAndContent,
+  I as TextAndIcons
+};
 //# sourceMappingURL=TextAndContent.js.map

package/dist/ui/esm/src/core/ui/components/atoms/textAndContent/TextAndContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextAndContent.js","sources":["../../../../../../../../../src/core/ui/components/atoms/textAndContent/TextAndContent.tsx"],"sourcesContent":["import { memo, FC, useMemo } from 'react'\n\nimport { PropsValidationError } from '../../error/propsValidationError'\nimport { IconBase } from '../../icon'\nimport { LayoutBox } from '../../container'\nimport { Text as BodyText } from '../text/Text'\n\nimport type { TextAndContentProps, TextAndIconsProps } from './textAndContent.types'\nimport classes from './textAndContent.module.scss'\n\n\n/**\n * TextAndContent component.\n *\n * @type {React.FC<TextAndContentProps>}\n * @returns {React.ReactElement} The TextAndContent.\n */\nexport const TextAndContent: FC<TextAndContentProps> = memo<TextAndContentProps>(({\n  text,\n  children,\n  components,\n  leftContent,\n  rightContent,\n  textProps = {},\n  className = '',\n  ...props\n}: TextAndContentProps) => {\n  if ((text === undefined || text === null) && !children) {\n    throw new PropsValidationError('Missing `text or children` property!')\n  }\n\n  const TextComponent = components?.TextComponent || BodyText\n\n  return (\n    <LayoutBox\n      className={`${classes.textAndContent} ${className}`}\n      {...props}\n    >\n      {leftContent && leftContent}\n      <TextComponent className='text-truncate' {...textProps} data-testid='text-content-text-component'>{text || children}</TextComponent>\n      {rightContent && rightContent}\n    </LayoutBox>\n  )\n})\n\nTextAndContent.displayName = 'TextAndContent'\n\n\n/**\n * TextAndIcons component.\n *\n * @type {React.FC<TextAndIconsProps>}\n * @returns {React.ReactElement} The TextAndIcons.\n */\nexport const TextAndIcons: FC<TextAndIconsProps> = memo<TextAndIconsProps>(({\n  iconSize,\n  iconColor,\n  iconLeft,\n  iconRight,\n  iconLeftUrl,\n  iconRightUrl,\n  onLeftIconClick,\n  onRightIconClick,\n  ...props\n}: TextAndIconsProps) => {\n  const [leftContent, rightContent] = useMemo(() => {\n    let leftContent\n    let rightContent\n\n    if (iconLeft || iconLeftUrl) {\n      const onLeftIconClickProps = onLeftIconClick ? ({\n        onClick: onLeftIconClick,\n        onKeyDown: onLeftIconClick,\n        role: 'button',\n        tabIndex: -1,\n        'data-testid': 'text-content-icon-left',\n      }) : {}\n\n      leftContent = (\n        <IconBase iconUrl={iconLeftUrl} size={iconSize} color={iconColor} {...onLeftIconClickProps}>\n          {iconLeft && iconLeft}\n        </IconBase>)\n    }\n    if (iconRight || iconRightUrl) {\n      const onRightIconClickProps = onRightIconClick ? ({\n        onClick: onRightIconClick,\n        onKeyDown: onRightIconClick,\n        role: 'button',\n        tabIndex: -1,\n        'data-testid': 'text-content-icon-right',\n      }) : {}\n\n      rightContent = (\n        <IconBase iconUrl={iconRightUrl} size={iconSize} color={iconColor} {...onRightIconClickProps}>\n          {iconRight && iconRight}\n        </IconBase>)\n    }\n    return [leftContent, rightContent]\n  }, [iconColor, iconLeft, iconLeftUrl, iconRight, iconRightUrl, iconSize, onLeftIconClick, onRightIconClick])\n\n\n  return (\n    <TextAndContent\n      leftContent={leftContent}\n      rightContent={rightContent}\n      {...props}\n    />\n  )\n})\n\nTextAndIcons.displayName = 'TextAndIcons'\n"],"names":["TextAndContent","memo","_ref","text","children","components","leftContent","rightContent","textProps","className","props","PropsValidationError","TextComponent","BodyText","React","createElement","LayoutBox","_extends","classes","textAndContent","displayName","TextAndIcons","_ref2","iconSize","iconColor","iconLeft","iconRight","iconLeftUrl","iconRightUrl","onLeftIconClick","onRightIconClick","useMemo","onLeftIconClickProps","onClick","onKeyDown","role","tabIndex","IconBase","iconUrl","size","color","onRightIconClickProps"],"mappings":"wZAiBaA,EAA0CC,GAA0BC,IAStD,IATuDC,KAChFA,EAAIC,SACJA,EAAQC,WACRA,EAAUC,YACVA,EAAWC,aACXA,EAAYC,UACZA,EAAY,CAAA,EAAEC,UACdA,EAAY,MACTC,GACiBR,EACpB,GAAI,MAACC,IAAyCC,EAC5C,MAAM,IAAIO,EAAqB,wCAGjC,MAAMC,EAAgBP,GAAYO,eAAiBC,EAEnD,OACEC,MAAAC,cAACC,EAASC,EAAA,CACRR,UAAW,GAAGS,EAAQC,kBAAkBV,KACpCC,GAEHJ,GAAeA,EAChBQ,MAAAC,cAACH,EAAaK,EAAA,CAACR,UAAU,iBAAoBD,EAAS,CAAE,cAAY,gCAA+BL,GAAQC,GAC1GG,GAAgBA,EACP,IAIhBP,EAAeoB,YAAc,uBAShBC,EAAsCpB,GAAwBqB,IAUlD,IAVmDC,SAC1EA,EAAQC,UACRA,EAASC,SACTA,EAAQC,UACRA,EAASC,YACTA,EAAWC,aACXA,EAAYC,gBACZA,EAAeC,iBACfA,KACGpB,GACeY,EAClB,MAAOhB,EAAaC,GAAgBwB,GAAQ,KAC1C,IAAIzB,EACAC,EAEJ,GAAIkB,GAAYE,EAAa,CAC3B,MAAMK,EAAuBH,EAAmB,CAC9CI,QAASJ,EACTK,UAAWL,EACXM,KAAM,SACNC,UAAU,EACV,cAAe,0BACZ,CAAA,EAEL9B,EACEQ,MAAAC,cAACsB,EAAQpB,EAAA,CAACqB,QAASX,EAAaY,KAAMhB,EAAUiB,MAAOhB,GAAeQ,GACnEP,GAAYA,EAEnB,CACA,GAAIC,GAAaE,EAAc,CAC7B,MAAMa,EAAwBX,EAAoB,CAChDG,QAASH,EACTI,UAAWJ,EACXK,KAAM,SACNC,UAAU,EACV,cAAe,2BACZ,CAAA,EAEL7B,EACEO,MAAAC,cAACsB,EAAQpB,EAAA,CAACqB,QAASV,EAAcW,KAAMhB,EAAUiB,MAAOhB,GAAeiB,GACpEf,GAAaA,EAEpB,CACA,MAAO,CAACpB,EAAaC,EAAa,GACjC,CAACiB,EAAWC,EAAUE,EAAaD,EAAWE,EAAcL,EAAUM,EAAiBC,IAG1F,OACEhB,MAAAC,cAACf,EAAciB,EAAA,CACbX,YAAaA,EACbC,aAAcA,GACVG,GACJ,IAINW,EAAaD,YAAc"}
+{"version":3,"file":"TextAndContent.js","sources":["../../../../../../../../../src/core/ui/components/atoms/textAndContent/TextAndContent.tsx"],"sourcesContent":["import { memo, FC, useMemo } from 'react'\n\nimport { PropsValidationError } from '../../error/propsValidationError'\nimport { IconBase } from '../../icon'\nimport { LayoutBox } from '../../container'\nimport { Text as BodyText } from '../text/Text'\n\nimport type { TextAndContentProps, TextAndIconsProps } from './textAndContent.types'\nimport classes from './textAndContent.module.scss'\n\n\n/**\n * TextAndContent component.\n *\n * @type {React.FC<TextAndContentProps>}\n * @returns {React.ReactElement} The TextAndContent.\n */\nexport const TextAndContent: FC<TextAndContentProps> = memo<TextAndContentProps>(({\n  text,\n  children,\n  components,\n  leftContent,\n  rightContent,\n  textProps = {},\n  className = '',\n  ...props\n}: TextAndContentProps) => {\n  if ((text === undefined || text === null) && !children) {\n    throw new PropsValidationError('Missing `text or children` property!')\n  }\n\n  const TextComponent = components?.TextComponent || BodyText\n\n  return (\n    <LayoutBox\n      className={`${classes.textAndContent} ${className}`}\n      {...props}\n    >\n      {leftContent && leftContent}\n      <TextComponent className='text-truncate' {...textProps} data-testid='text-content-text-component'>{text || children}</TextComponent>\n      {rightContent && rightContent}\n    </LayoutBox>\n  )\n})\n\nTextAndContent.displayName = 'TextAndContent'\n\n\n/**\n * TextAndIcons component.\n *\n * @type {React.FC<TextAndIconsProps>}\n * @returns {React.ReactElement} The TextAndIcons.\n */\nexport const TextAndIcons: FC<TextAndIconsProps> = memo<TextAndIconsProps>(({\n  iconSize,\n  iconColor,\n  iconLeft,\n  iconRight,\n  iconLeftUrl,\n  iconRightUrl,\n  onLeftIconClick,\n  onRightIconClick,\n  ...props\n}: TextAndIconsProps) => {\n  const [leftContent, rightContent] = useMemo(() => {\n    let leftContent\n    let rightContent\n\n    if (iconLeft || iconLeftUrl) {\n      const onLeftIconClickProps = onLeftIconClick ? ({\n        onClick: onLeftIconClick,\n        onKeyDown: onLeftIconClick,\n        role: 'button',\n        tabIndex: -1,\n        'data-testid': 'text-content-icon-left',\n      }) : {}\n\n      leftContent = (\n        <IconBase iconUrl={iconLeftUrl} size={iconSize} color={iconColor} {...onLeftIconClickProps}>\n          {iconLeft && iconLeft}\n        </IconBase>)\n    }\n    if (iconRight || iconRightUrl) {\n      const onRightIconClickProps = onRightIconClick ? ({\n        onClick: onRightIconClick,\n        onKeyDown: onRightIconClick,\n        role: 'button',\n        tabIndex: -1,\n        'data-testid': 'text-content-icon-right',\n      }) : {}\n\n      rightContent = (\n        <IconBase iconUrl={iconRightUrl} size={iconSize} color={iconColor} {...onRightIconClickProps}>\n          {iconRight && iconRight}\n        </IconBase>)\n    }\n    return [leftContent, rightContent]\n  }, [iconColor, iconLeft, iconLeftUrl, iconRight, iconRightUrl, iconSize, onLeftIconClick, onRightIconClick])\n\n\n  return (\n    <TextAndContent\n      leftContent={leftContent}\n      rightContent={rightContent}\n      {...props}\n    />\n  )\n})\n\nTextAndIcons.displayName = 'TextAndIcons'\n"],"names":["TextAndContent","memo","text","children","components","leftContent","rightContent","textProps","className","props","PropsValidationError","TextComponent","BodyText","jsxs","LayoutBox","classes","jsx","TextAndIcons","iconSize","iconColor","iconLeft","iconRight","iconLeftUrl","iconRightUrl","onLeftIconClick","onRightIconClick","useMemo","IconBase"],"mappings":";;;;;;;AAiBO,MAAMA,IAA0CC,EAA0B,CAAC;AAAA,EAChF,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC,IAAY,CAAA;AAAA,EACZ,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAA2B;AACzB,MAA2BP,KAAS,QAAS,CAACC;AAC5C,UAAM,IAAIO,EAAqB,sCAAsC;AAGvE,QAAMC,KAAgBP,KAAA,gBAAAA,EAAY,kBAAiBQ;AAEnD,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAW,GAAGC,EAAQ,cAAc,IAAIP,CAAS;AAAA,MAChD,GAAGC;AAAA,MAEH,UAAA;AAAA,QAAAJ,KAAeA;AAAA,QAChB,gBAAAW,EAACL,KAAc,WAAU,iBAAiB,GAAGJ,GAAW,eAAY,+BAA+B,UAAAL,KAAQC,EAAA,CAAS;AAAA,QACnHG,KAAgBA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGvB,CAAC;AAEDN,EAAe,cAAc;AAStB,MAAMiB,IAAsChB,EAAwB,CAAC;AAAA,EAC1E,UAAAiB;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,GAAGhB;AACL,MAAyB;AACvB,QAAM,CAACJ,GAAaC,CAAY,IAAIoB,EAAQ,MAAM;AAChD,QAAIrB,GACAC;AAEJ,YAAIc,KAAYE,OASdjB,IACE,gBAAAW,EAACW,GAAA,EAAS,SAASL,GAAa,MAAMJ,GAAU,OAAOC,GAAY,GATxCK,IAAmB;AAAA,MAC9C,SAASA;AAAA,MACT,WAAWA;AAAA,MACX,MAAM;AAAA,MACN,UAAU;AAAA,MACV,eAAe;AAAA,IAAA,IACZ,CAAA,GAIA,UAAAJ,KAAYA,EAAA,CACf,KAEAC,KAAaE,OASfjB,IACE,gBAAAU,EAACW,GAAA,EAAS,SAASJ,GAAc,MAAML,GAAU,OAAOC,GAAY,GATxCM,IAAoB;AAAA,MAChD,SAASA;AAAA,MACT,WAAWA;AAAA,MACX,MAAM;AAAA,MACN,UAAU;AAAA,MACV,eAAe;AAAA,IAAA,IACZ,CAAA,GAIA,UAAAJ,KAAaA,EAAA,CAChB,IAEG,CAAChB,GAAaC,CAAY;AAAA,EACnC,GAAG,CAACa,GAAWC,GAAUE,GAAaD,GAAWE,GAAcL,GAAUM,GAAiBC,CAAgB,CAAC;AAG3G,SACE,gBAAAT;AAAA,IAAChB;AAAA,IAAA;AAAA,MACC,aAAAK;AAAA,MACA,cAAAC;AAAA,MACC,GAAGG;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;AAEDQ,EAAa,cAAc;"}

package/dist/ui/esm/src/core/ui/components/atoms/textAndContent/textAndContent.module.scss.js

@@ -1,2 +1,8 @@
-var t={textAndContent:"textAndContent-module_textAndContent__X5P1n"};export{t as default};
+const t = "_textAndContent_g8kx0_1", n = {
+  textAndContent: t
+};
+export {
+  n as default,
+  t as textAndContent
+};
 //# sourceMappingURL=textAndContent.module.scss.js.map

package/dist/ui/esm/src/core/ui/components/atoms/textAndContent/textAndContent.module.scss.js.map

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

package/dist/ui/esm/src/core/ui/components/atoms/toggle/Toggle.js

@@ -1,2 +1,48 @@
-import{extends as e}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as s,forwardRef as t,useId as a,useMemo as l}from"react";import r from"./toggle.module.scss.js";import{useParseProps as o}from"../../../../hooks/useParseProps.js";import{classNames as c}from"../../../../utils/helpers/ui.js";const i=t(((s,t)=>{let{id:i,checked:m=!1,disabled:d=!1,className:p="",invalid:n,onChange:g,...h}=s;const u=a(),b=l((()=>c(r.toggle,d&&r.disabled,p)),[d,p]),{dataProps:f,restProps:N}=o(h);return React.createElement("label",e({htmlFor:i??u,className:b},f,{style:N}),React.createElement("input",e({},h,{id:i??u,ref:t,role:"switch",type:"checkbox",disabled:d,checked:m,onChange:g})),React.createElement("span",{className:r.slider}))}));i.displayName="ToggleForwarded";const m=s(i);m.displayName="Toggle";export{m as Toggle};
+import { jsxs as f, jsx as l } from "react/jsx-runtime";
+import { memo as h, forwardRef as u, useId as w, useMemo as y } from "react";
+import o from "./toggle.module.scss.js";
+import { useParseProps as x } from "../../../../hooks/useParseProps.js";
+import { classNames as N } from "../../../../utils/helpers/ui.js";
+const m = u(({
+  id: e,
+  checked: c = !1,
+  disabled: s = !1,
+  className: r = "",
+  // TODO add eror styling for invalid
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  invalid: T,
+  onChange: d,
+  ...t
+}, i) => {
+  const a = w(), p = y(
+    () => N(
+      o.toggle,
+      s && o.disabled,
+      r
+    ),
+    [s, r]
+  ), { dataProps: g, restProps: n } = x(t);
+  return /* @__PURE__ */ f("label", { htmlFor: e ?? a, className: p, ...g, style: n, children: [
+    /* @__PURE__ */ l(
+      "input",
+      {
+        ...t,
+        id: e ?? a,
+        ref: i,
+        role: "switch",
+        type: "checkbox",
+        disabled: s,
+        checked: c,
+        onChange: d
+      }
+    ),
+    /* @__PURE__ */ l("span", { className: o.slider })
+  ] });
+});
+m.displayName = "ToggleForwarded";
+const P = h(m);
+P.displayName = "Toggle";
+export {
+  P as Toggle
+};
 //# sourceMappingURL=Toggle.js.map

package/dist/ui/esm/src/core/ui/components/atoms/toggle/Toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toggle.js","sources":["../../../../../../../../../src/core/ui/components/atoms/toggle/Toggle.tsx"],"sourcesContent":["import {\n  useId,\n  forwardRef, LegacyRef, memo, useMemo, FC, PropsWithChildren,\n  ChangeEvent,\n} from 'react'\n\nimport { CommonProps } from '../../../types'\nimport { useParseProps } from '../../../../hooks'\nimport { classNames } from '../../../../utils'\nimport { FieldProps } from '../../field'\n\nimport classes from './toggle.module.scss'\n\n\nexport type ToggleProps = CommonProps & PropsWithChildren & {\n  onChange?: (event: ChangeEvent) => void\n  checked?: FieldProps['checked']\n  disabled?: FieldProps['disabled']\n  invalid?: FieldProps['invalid']\n}\n\n/**\n * Toggle component.\n *\n * @type {React.FC<ToggleProps>}\n * @returns {React.ReactElement} The Toggle.\n */\n\n\nconst ToggleForwarded = forwardRef(({\n  id,\n  checked = false,\n  disabled = false,\n  className = '',\n  // TODO add eror styling for invalid\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  invalid,\n  onChange,\n  ...props\n}: ToggleProps, ref: LegacyRef<HTMLInputElement>) => {\n  const shadowId = useId()\n\n  const styles = useMemo(\n    () => classNames(\n      classes.toggle,\n      disabled && classes.disabled,\n      className,\n    ),\n    [disabled, className],\n  )\n\n  const { dataProps, restProps } = useParseProps(props)\n\n  return (\n    <label htmlFor={id ?? shadowId} className={styles} {...dataProps} style={restProps}>\n      <input\n        {...props}\n        id={id ?? shadowId}\n        ref={ref}\n        role='switch'\n        type='checkbox'\n        disabled={disabled}\n        checked={checked}\n        onChange={onChange}\n      />\n      <span className={classes.slider} />\n    </label>\n  )\n})\n\nToggleForwarded.displayName = 'ToggleForwarded'\n\nexport const Toggle: FC<ToggleProps> = memo<ToggleProps>(ToggleForwarded)\n\nexport type ToggleType = typeof Toggle;\n\nToggle.displayName = 'Toggle'\n"],"names":["ToggleForwarded","forwardRef","_ref","ref","id","checked","disabled","className","invalid","onChange","props","shadowId","useId","styles","useMemo","classNames","classes","toggle","dataProps","restProps","useParseProps","React","createElement","_extends","htmlFor","style","role","type","slider","displayName","Toggle","memo"],"mappings":"8TA6BA,MAAMA,EAAkBC,GAAW,CAAAC,EAUnBC,KAAqC,IAVjBC,GAClCA,EAAEC,QACFA,GAAU,EAAKC,SACfA,GAAW,EAAKC,UAChBA,EAAY,GAAEC,QAGdA,EAAOC,SACPA,KACGC,GACSR,EACZ,MAAMS,EAAWC,IAEXC,EAASC,GACb,IAAMC,EACJC,EAAQC,OACRX,GAAYU,EAAQV,SACpBC,IAEF,CAACD,EAAUC,KAGPW,UAAEA,EAASC,UAAEA,GAAcC,EAAcV,GAE/C,OACEW,MAAAC,cAAA,QAAAC,EAAA,CAAOC,QAASpB,GAAMO,EAAUJ,UAAWM,GAAYK,EAAS,CAAEO,MAAON,IACvEE,MAAAC,cAAA,QAAAC,KACMb,EAAK,CACTN,GAAIA,GAAMO,EACVR,IAAKA,EACLuB,KAAK,SACLC,KAAK,WACLrB,SAAUA,EACVD,QAASA,EACTI,SAAUA,KAEZY,MAAAC,cAAA,OAAA,CAAMf,UAAWS,EAAQY,SACnB,IAIZ5B,EAAgB6B,YAAc,wBAEjBC,EAA0BC,EAAkB/B,GAIzD8B,EAAOD,YAAc"}
+{"version":3,"file":"Toggle.js","sources":["../../../../../../../../../src/core/ui/components/atoms/toggle/Toggle.tsx"],"sourcesContent":["import {\n  useId,\n  forwardRef, LegacyRef, memo, useMemo, FC, PropsWithChildren,\n  ChangeEvent,\n} from 'react'\n\nimport { CommonProps } from '../../../types'\nimport { useParseProps } from '../../../../hooks'\nimport { classNames } from '../../../../utils'\nimport { FieldProps } from '../../field'\n\nimport classes from './toggle.module.scss'\n\n\nexport type ToggleProps = CommonProps & PropsWithChildren & {\n  onChange?: (event: ChangeEvent) => void\n  checked?: FieldProps['checked']\n  disabled?: FieldProps['disabled']\n  invalid?: FieldProps['invalid']\n}\n\n/**\n * Toggle component.\n *\n * @type {React.FC<ToggleProps>}\n * @returns {React.ReactElement} The Toggle.\n */\n\n\nconst ToggleForwarded = forwardRef(({\n  id,\n  checked = false,\n  disabled = false,\n  className = '',\n  // TODO add eror styling for invalid\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  invalid,\n  onChange,\n  ...props\n}: ToggleProps, ref: LegacyRef<HTMLInputElement>) => {\n  const shadowId = useId()\n\n  const styles = useMemo(\n    () => classNames(\n      classes.toggle,\n      disabled && classes.disabled,\n      className,\n    ),\n    [disabled, className],\n  )\n\n  const { dataProps, restProps } = useParseProps(props)\n\n  return (\n    <label htmlFor={id ?? shadowId} className={styles} {...dataProps} style={restProps}>\n      <input\n        {...props}\n        id={id ?? shadowId}\n        ref={ref}\n        role='switch'\n        type='checkbox'\n        disabled={disabled}\n        checked={checked}\n        onChange={onChange}\n      />\n      <span className={classes.slider} />\n    </label>\n  )\n})\n\nToggleForwarded.displayName = 'ToggleForwarded'\n\nexport const Toggle: FC<ToggleProps> = memo<ToggleProps>(ToggleForwarded)\n\nexport type ToggleType = typeof Toggle;\n\nToggle.displayName = 'Toggle'\n"],"names":["ToggleForwarded","forwardRef","id","checked","disabled","className","invalid","onChange","props","ref","shadowId","useId","styles","useMemo","classNames","classes","dataProps","restProps","useParseProps","jsxs","jsx","Toggle","memo"],"mappings":";;;;;AA6BA,MAAMA,IAAkBC,EAAW,CAAC;AAAA,EAClC,IAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA;AAAA;AAAA,EAGZ,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GAAgBC,MAAqC;AACnD,QAAMC,IAAWC,EAAA,GAEXC,IAASC;AAAA,IACb,MAAMC;AAAA,MACJC,EAAQ;AAAA,MACRX,KAAYW,EAAQ;AAAA,MACpBV;AAAA,IAAA;AAAA,IAEF,CAACD,GAAUC,CAAS;AAAA,EAAA,GAGhB,EAAE,WAAAW,GAAW,WAAAC,MAAcC,EAAcV,CAAK;AAEpD,SACE,gBAAAW,EAAC,SAAA,EAAM,SAASjB,KAAMQ,GAAU,WAAWE,GAAS,GAAGI,GAAW,OAAOC,GACvE,UAAA;AAAA,IAAA,gBAAAG;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAGZ;AAAA,QACJ,IAAIN,KAAMQ;AAAA,QACV,KAAAD;AAAA,QACA,MAAK;AAAA,QACL,MAAK;AAAA,QACL,UAAAL;AAAA,QACA,SAAAD;AAAA,QACA,UAAAI;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,gBAAAa,EAAC,QAAA,EAAK,WAAWL,EAAQ,OAAA,CAAQ;AAAA,EAAA,GACnC;AAEJ,CAAC;AAEDf,EAAgB,cAAc;AAEvB,MAAMqB,IAA0BC,EAAkBtB,CAAe;AAIxEqB,EAAO,cAAc;"}

package/dist/ui/esm/src/core/ui/components/atoms/toggle/toggle.module.scss.js

@@ -1,2 +1,12 @@
-var e={toggle:"toggle-module_toggle__p1Ep4",slider:"toggle-module_slider__2IVaG",disabled:"toggle-module_disabled__0nElH"};export{e as default};
+const s = "_toggle_10kjs_17", e = "_slider_10kjs_31", l = "_disabled_10kjs_67", d = {
+  toggle: s,
+  slider: e,
+  disabled: l
+};
+export {
+  d as default,
+  l as disabled,
+  e as slider,
+  s as toggle
+};
 //# sourceMappingURL=toggle.module.scss.js.map

package/dist/ui/esm/src/core/ui/components/atoms/toggle/toggle.module.scss.js.map

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

package/dist/ui/esm/src/core/ui/components/container/CollapsibleContainer.js

@@ -1,2 +1,54 @@
-import{extends as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as t,useRef as l,useState as r,useEffect as o,useLayoutEffect as a,useMemo as s}from"react";import{useParseProps as i}from"../../../hooks/useParseProps.js";import n from"./CollapsibleContainer.module.scss.js";const p={width:"scrollWidth",height:"scrollHeight"},d=t((t=>{let{collapsed:d=!1,collapseHandler:c,children:h,horizontal:m=!1,className:u="",id:x,...f}=t;const g=l(null),[v,P]=r(0),{dataProps:$,restProps:b}=i(f),j=!m;o((()=>{c?.(d)}),[c,d]),a((()=>{if(g?.current){const e=j?"height":"width";setTimeout((()=>{g?.current&&P(g.current[p[e]])}),100)}}),[g,j]);const w=s((()=>({"--prop-name":j?"height":"width","--prop-max-name":j?"max-height":"max-width","--prop-value":`${v}px`,...b})),[j,b,v]),C=s((()=>{const e=[j?n.vertical:n.horizontal];return d&&v&&null!=v&&e.push(n.collapsed),!d&&v&&null!=v&&e.push(n.expanded),e.join(" ")}),[d,v,j]);return React.createElement("div",e({id:`${void 0!==x&&x||x}`,className:`${n["collapsible-container"]} ${C} ${u} `,ref:g,style:w},$,{"data-testid":$.dataTestId||$["data-testid"]||x}),h)}));d.displayName="CollapsibleContainer";export{d as CollapsibleContainer};
+import { jsx as v } from "react/jsx-runtime";
+import { memo as y, useRef as N, useState as g, useEffect as C, useLayoutEffect as $, useMemo as u } from "react";
+import { useParseProps as w } from "../../../hooks/useParseProps.js";
+import i from "./CollapsibleContainer.module.scss.js";
+const b = {
+  width: "scrollWidth",
+  height: "scrollHeight"
+}, j = y(({
+  collapsed: o = !1,
+  collapseHandler: a,
+  children: h,
+  horizontal: c = !1,
+  className: f = "",
+  id: n,
+  ...l
+}) => {
+  const t = N(null), [e, d] = g(0), { dataProps: m, restProps: p } = w(l), s = !c;
+  C(() => {
+    a == null || a(o);
+  }, [a, o]), $(() => {
+    if (t != null && t.current) {
+      const r = s ? "height" : "width";
+      setTimeout(() => {
+        t != null && t.current && d(t.current[b[r]]);
+      }, 100);
+    }
+  }, [t, s]);
+  const P = u(() => ({
+    "--prop-name": s ? "height" : "width",
+    "--prop-max-name": s ? "max-height" : "max-width",
+    "--prop-value": `${e}px`,
+    ...p
+  }), [s, p, e]), x = u(() => {
+    const r = [s ? i.vertical : i.horizontal];
+    return o && e && e !== void 0 && e !== null && r.push(i.collapsed), !o && e && e !== void 0 && e !== null && r.push(i.expanded), r.join(" ");
+  }, [o, e, s]);
+  return /* @__PURE__ */ v(
+    "div",
+    {
+      id: `${typeof n < "u" && n || n}`,
+      className: `${i["collapsible-container"]} ${x} ${f} `,
+      ref: t,
+      style: P,
+      ...m,
+      "data-testid": m.dataTestId || m["data-testid"] || n,
+      children: h
+    }
+  );
+});
+j.displayName = "CollapsibleContainer";
+export {
+  j as CollapsibleContainer
+};
 //# sourceMappingURL=CollapsibleContainer.js.map

package/dist/ui/esm/src/core/ui/components/container/CollapsibleContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"CollapsibleContainer.js","sources":["../../../../../../../../src/core/ui/components/container/CollapsibleContainer.tsx"],"sourcesContent":["import { FC, useRef, useState, memo, ReactNode,\n  useEffect, useLayoutEffect, useMemo, CSSProperties, PropsWithChildren } from 'react'\n\nimport { useParseProps } from '../../../hooks/useParseProps'\n\nimport classes from './CollapsibleContainer.module.scss'\nimport { LayoutBoxProps } from './layoutBox/layoutBox.types'\n\n\n/**\n * Mapping of element property names for calculating dimensions.\n */\nconst elementPropNameMap: Record<string, string> = {\n  width: 'scrollWidth',\n  height: 'scrollHeight',\n}\n\n/**\n * Props for the CollapsibleContainer component.\n */\nexport type CollapsibleContainerProps = PropsWithChildren & Omit<LayoutBoxProps, 'ref'> & {\n  collapsed?: boolean\n  collapseHandler?: (collapsed: boolean) => void\n  children?: ReactNode\n  className?: string\n  horizontal?: boolean\n} & CSSProperties\n\n/**\n * CollapsibleContainer component.\n *\n * @type {React.FC<CollapsibleContainerProps>}\n * @returns {React.ReactElement} The CollapsibleContainer.\n */\nexport const CollapsibleContainer: FC<CollapsibleContainerProps> = memo(({\n  collapsed = false, collapseHandler, children, horizontal = false, className = '', id, ...props\n}: CollapsibleContainerProps) => {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const [contentProp, setContentProp] = useState(0)\n\n  const { dataProps, restProps: style } = useParseProps(props)\n\n  const vertical = !horizontal\n\n  useEffect(() => {\n    collapseHandler?.(collapsed)\n  }, [collapseHandler, collapsed])\n\n  useLayoutEffect(() => {\n    if (containerRef?.current) {\n      const propName = vertical ? 'height' : 'width'\n\n      // TODO test with requestAnimationFrame\n      setTimeout(() => {\n        if (containerRef?.current) {\n          setContentProp((containerRef.current as any)[elementPropNameMap[propName]])\n        }\n      }, 100)\n    }\n  }, [containerRef, vertical])\n\n  const styleProps: CSSProperties = useMemo(() => ({\n    '--prop-name': vertical ? 'height' : 'width',\n    '--prop-max-name': vertical ? 'max-height' : 'max-width',\n    '--prop-value': `${contentProp}px`,\n    ...style,\n  } as CSSProperties), [vertical, style, contentProp])\n\n  const classNames = useMemo(() => {\n    const classNames = [vertical ? classes.vertical : classes.horizontal]\n\n    if (collapsed && contentProp && contentProp !== undefined && contentProp !== null) {\n      classNames.push(classes.collapsed)\n    }\n    if (!collapsed && contentProp && contentProp !== undefined && contentProp !== null) {\n      classNames.push(classes.expanded)\n    }\n    return classNames.join(' ')\n  }, [collapsed, contentProp, vertical])\n\n  return (\n    <div\n      id={`${(typeof id !== 'undefined' && id) || id}`}\n      className={`${classes['collapsible-container']} ${classNames} ${className} `}\n      ref={containerRef}\n      style={styleProps}\n      {...dataProps}\n      data-testid={dataProps.dataTestId || dataProps['data-testid'] || id}\n    >\n      {children}\n    </div>\n  )\n})\n\nCollapsibleContainer.displayName = 'CollapsibleContainer'\n"],"names":["elementPropNameMap","width","height","CollapsibleContainer","memo","_ref","collapsed","collapseHandler","children","horizontal","className","id","props","containerRef","useRef","contentProp","setContentProp","useState","dataProps","restProps","style","useParseProps","vertical","useEffect","useLayoutEffect","current","propName","setTimeout","styleProps","useMemo","classNames","classes","push","expanded","join","React","createElement","_extends","ref","dataTestId","displayName"],"mappings":"4SAYA,MAAMA,EAA6C,CACjDC,MAAO,cACPC,OAAQ,gBAoBGC,EAAsDC,GAAKC,IAEvC,IAFwCC,UACvEA,GAAY,EAAKC,gBAAEA,EAAeC,SAAEA,EAAQC,WAAEA,GAAa,EAAKC,UAAEA,EAAY,GAAEC,GAAEA,KAAOC,GAC/DP,EAC1B,MAAMQ,EAAeC,EAAuB,OACrCC,EAAaC,GAAkBC,EAAS,IAEzCC,UAAEA,EAAWC,UAAWC,GAAUC,EAAcT,GAEhDU,GAAYb,EAElBc,GAAU,KACRhB,IAAkBD,EAAU,GAC3B,CAACC,EAAiBD,IAErBkB,GAAgB,KACd,GAAIX,GAAcY,QAAS,CACzB,MAAMC,EAAWJ,EAAW,SAAW,QAGvCK,YAAW,KACLd,GAAcY,SAChBT,EAAgBH,EAAaY,QAAgBzB,EAAmB0B,IAClE,GACC,IACL,IACC,CAACb,EAAcS,IAElB,MAAMM,EAA4BC,GAAQ,KAAA,CACxC,cAAeP,EAAW,SAAW,QACrC,kBAAmBA,EAAW,aAAe,YAC7C,eAAgB,GAAGP,SAChBK,KACgB,CAACE,EAAUF,EAAOL,IAEjCe,EAAaD,GAAQ,KACzB,MAAMC,EAAa,CAACR,EAAWS,EAAQT,SAAWS,EAAQtB,YAQ1D,OANIH,GAAaS,GAAbT,MAA4BS,GAC9Be,EAAWE,KAAKD,EAAQzB,YAErBA,GAAaS,GAAd,MAA6BA,GAC/Be,EAAWE,KAAKD,EAAQE,UAEnBH,EAAWI,KAAK,IAAI,GAC1B,CAAC5B,EAAWS,EAAaO,IAE5B,OACEa,MAAAC,cAAA,MAAAC,EAAA,CACE1B,GAAI,QAAkB,IAAPA,GAAsBA,GAAOA,IAC5CD,UAAW,GAAGqB,EAAQ,4BAA4BD,KAAcpB,KAChE4B,IAAKzB,EACLO,MAAOQ,GACHV,EAAS,CACb,cAAaA,EAAUqB,YAAcrB,EAAU,gBAAkBP,IAEhEH,EACG,IAIVL,EAAqBqC,YAAc"}
+{"version":3,"file":"CollapsibleContainer.js","sources":["../../../../../../../../src/core/ui/components/container/CollapsibleContainer.tsx"],"sourcesContent":["import { FC, useRef, useState, memo, ReactNode,\n  useEffect, useLayoutEffect, useMemo, CSSProperties, PropsWithChildren } from 'react'\n\nimport { useParseProps } from '../../../hooks/useParseProps'\n\nimport classes from './CollapsibleContainer.module.scss'\nimport { LayoutBoxProps } from './layoutBox/layoutBox.types'\n\n\n/**\n * Mapping of element property names for calculating dimensions.\n */\nconst elementPropNameMap: Record<string, string> = {\n  width: 'scrollWidth',\n  height: 'scrollHeight',\n}\n\n/**\n * Props for the CollapsibleContainer component.\n */\nexport type CollapsibleContainerProps = PropsWithChildren & Omit<LayoutBoxProps, 'ref'> & {\n  collapsed?: boolean\n  collapseHandler?: (collapsed: boolean) => void\n  children?: ReactNode\n  className?: string\n  horizontal?: boolean\n} & CSSProperties\n\n/**\n * CollapsibleContainer component.\n *\n * @type {React.FC<CollapsibleContainerProps>}\n * @returns {React.ReactElement} The CollapsibleContainer.\n */\nexport const CollapsibleContainer: FC<CollapsibleContainerProps> = memo(({\n  collapsed = false, collapseHandler, children, horizontal = false, className = '', id, ...props\n}: CollapsibleContainerProps) => {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const [contentProp, setContentProp] = useState(0)\n\n  const { dataProps, restProps: style } = useParseProps(props)\n\n  const vertical = !horizontal\n\n  useEffect(() => {\n    collapseHandler?.(collapsed)\n  }, [collapseHandler, collapsed])\n\n  useLayoutEffect(() => {\n    if (containerRef?.current) {\n      const propName = vertical ? 'height' : 'width'\n\n      // TODO test with requestAnimationFrame\n      setTimeout(() => {\n        if (containerRef?.current) {\n          setContentProp((containerRef.current as any)[elementPropNameMap[propName]])\n        }\n      }, 100)\n    }\n  }, [containerRef, vertical])\n\n  const styleProps: CSSProperties = useMemo(() => ({\n    '--prop-name': vertical ? 'height' : 'width',\n    '--prop-max-name': vertical ? 'max-height' : 'max-width',\n    '--prop-value': `${contentProp}px`,\n    ...style,\n  } as CSSProperties), [vertical, style, contentProp])\n\n  const classNames = useMemo(() => {\n    const classNames = [vertical ? classes.vertical : classes.horizontal]\n\n    if (collapsed && contentProp && contentProp !== undefined && contentProp !== null) {\n      classNames.push(classes.collapsed)\n    }\n    if (!collapsed && contentProp && contentProp !== undefined && contentProp !== null) {\n      classNames.push(classes.expanded)\n    }\n    return classNames.join(' ')\n  }, [collapsed, contentProp, vertical])\n\n  return (\n    <div\n      id={`${(typeof id !== 'undefined' && id) || id}`}\n      className={`${classes['collapsible-container']} ${classNames} ${className} `}\n      ref={containerRef}\n      style={styleProps}\n      {...dataProps}\n      data-testid={dataProps.dataTestId || dataProps['data-testid'] || id}\n    >\n      {children}\n    </div>\n  )\n})\n\nCollapsibleContainer.displayName = 'CollapsibleContainer'\n"],"names":["elementPropNameMap","CollapsibleContainer","memo","collapsed","collapseHandler","children","horizontal","className","id","props","containerRef","useRef","contentProp","setContentProp","useState","dataProps","style","useParseProps","vertical","useEffect","useLayoutEffect","propName","styleProps","useMemo","classNames","classes","jsx"],"mappings":";;;;AAYA,MAAMA,IAA6C;AAAA,EACjD,OAAO;AAAA,EACP,QAAQ;AACV,GAmBaC,IAAsDC,EAAK,CAAC;AAAA,EACvE,WAAAC,IAAY;AAAA,EAAO,iBAAAC;AAAA,EAAiB,UAAAC;AAAA,EAAU,YAAAC,IAAa;AAAA,EAAO,WAAAC,IAAY;AAAA,EAAI,IAAAC;AAAA,EAAI,GAAGC;AAC3F,MAAiC;AAC/B,QAAMC,IAAeC,EAAuB,IAAI,GAC1C,CAACC,GAAaC,CAAc,IAAIC,EAAS,CAAC,GAE1C,EAAE,WAAAC,GAAW,WAAWC,EAAA,IAAUC,EAAcR,CAAK,GAErDS,IAAW,CAACZ;AAElB,EAAAa,EAAU,MAAM;AACd,IAAAf,KAAA,QAAAA,EAAkBD;AAAA,EACpB,GAAG,CAACC,GAAiBD,CAAS,CAAC,GAE/BiB,EAAgB,MAAM;AACpB,QAAIV,KAAA,QAAAA,EAAc,SAAS;AACzB,YAAMW,IAAWH,IAAW,WAAW;AAGvC,iBAAW,MAAM;AACf,QAAIR,KAAA,QAAAA,EAAc,WAChBG,EAAgBH,EAAa,QAAgBV,EAAmBqB,CAAQ,CAAC,CAAC;AAAA,MAE9E,GAAG,GAAG;AAAA,IACR;AAAA,EACF,GAAG,CAACX,GAAcQ,CAAQ,CAAC;AAE3B,QAAMI,IAA4BC,EAAQ,OAAO;AAAA,IAC/C,eAAeL,IAAW,WAAW;AAAA,IACrC,mBAAmBA,IAAW,eAAe;AAAA,IAC7C,gBAAgB,GAAGN,CAAW;AAAA,IAC9B,GAAGI;AAAA,EAAA,IACgB,CAACE,GAAUF,GAAOJ,CAAW,CAAC,GAE7CY,IAAaD,EAAQ,MAAM;AAC/B,UAAMC,IAAa,CAACN,IAAWO,EAAQ,WAAWA,EAAQ,UAAU;AAEpE,WAAItB,KAAaS,KAAeA,MAAgB,UAAaA,MAAgB,QAC3EY,EAAW,KAAKC,EAAQ,SAAS,GAE/B,CAACtB,KAAaS,KAAeA,MAAgB,UAAaA,MAAgB,QAC5EY,EAAW,KAAKC,EAAQ,QAAQ,GAE3BD,EAAW,KAAK,GAAG;AAAA,EAC5B,GAAG,CAACrB,GAAWS,GAAaM,CAAQ,CAAC;AAErC,SACE,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI,GAAI,OAAOlB,IAAO,OAAeA,KAAOA,CAAE;AAAA,MAC9C,WAAW,GAAGiB,EAAQ,uBAAuB,CAAC,IAAID,CAAU,IAAIjB,CAAS;AAAA,MACzE,KAAKG;AAAA,MACL,OAAOY;AAAA,MACN,GAAGP;AAAA,MACJ,eAAaA,EAAU,cAAcA,EAAU,aAAa,KAAKP;AAAA,MAEhE,UAAAH;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;AAEDJ,EAAqB,cAAc;"}

package/dist/ui/esm/src/core/ui/components/container/CollapsibleContainer.module.scss.js

@@ -1,2 +1,14 @@
-var l={"collapsible-container":"CollapsibleContainer-module_collapsible-container__u0Jmm",vertical:"CollapsibleContainer-module_vertical__w7MVN",collapsed:"CollapsibleContainer-module_collapsed__q8fs8",expanded:"CollapsibleContainer-module_expanded__O6Vh8",horizontal:"CollapsibleContainer-module_horizontal__QJWI-"};export{l as default};
+const a = "_vertical_h8vq7_6", e = "_collapsed_h8vq7_10", o = "_expanded_h8vq7_15", l = "_horizontal_h8vq7_20", t = {
+  vertical: a,
+  collapsed: e,
+  expanded: o,
+  horizontal: l
+};
+export {
+  e as collapsed,
+  t as default,
+  o as expanded,
+  l as horizontal,
+  a as vertical
+};
 //# sourceMappingURL=CollapsibleContainer.module.scss.js.map

package/dist/ui/esm/src/core/ui/components/container/CollapsibleContainer.module.scss.js.map

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

package/dist/ui/esm/src/core/ui/components/container/ResizableContainer.js

@@ -1,2 +1,59 @@
-import{extends as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as t}from"react";import{useResize as i}from"../../../hooks/useResize.js";import{LayoutBox as n}from"./layoutBox/LayoutBox.js";const o={main:{position:"absolute",zIndex:1,left:0,pointerEvents:"none"},empty:{pointerEvents:"none"}},r=t((t=>{let{children:r,debounceDelay:a=250,...h}=t;const[l,s]=i(a);return React.createElement(n,e({width:"100%",height:"100%",justify:"center",align:"center",direction:"column"},h),React.createElement(n,{style:o.main,width:"100%",height:"100%",ref:l}),!r&&React.createElement(n,{width:`${Math.max(s?.width||200,200)||200}px`,height:`${Math.max(s?.height||200,200)||200}px`,style:o.empty}),r&&r?.({height:`${s?.height||200}px`,width:`${s?.width||200}px`,measured:!!s?.height}))}));r.displayName="ResizableContainer";export{r as ResizableContainer};
+import { jsxs as x, jsx as m } from "react/jsx-runtime";
+import { memo as a } from "react";
+import { useResize as f } from "../../../hooks/useResize.js";
+import { LayoutBox as s } from "./layoutBox/LayoutBox.js";
+const o = {
+  main: {
+    position: "absolute",
+    zIndex: 1,
+    left: 0,
+    pointerEvents: "none"
+  },
+  empty: {
+    pointerEvents: "none"
+  }
+}, g = a(
+  ({ children: e, debounceDelay: h = 250, ...p }) => {
+    const [i, t] = f(h);
+    return /* @__PURE__ */ x(
+      s,
+      {
+        width: "100%",
+        height: "100%",
+        justify: "center",
+        align: "center",
+        direction: "column",
+        ...p,
+        children: [
+          /* @__PURE__ */ m(
+            s,
+            {
+              style: o.main,
+              width: "100%",
+              height: "100%",
+              ref: i
+            }
+          ),
+          !e && /* @__PURE__ */ m(
+            s,
+            {
+              width: `${Math.max((t == null ? void 0 : t.width) || 200, 200) || 200}px`,
+              height: `${Math.max((t == null ? void 0 : t.height) || 200, 200) || 200}px`,
+              style: o.empty
+            }
+          ),
+          e && (e == null ? void 0 : e({
+            height: `${(t == null ? void 0 : t.height) || 200}px`,
+            width: `${(t == null ? void 0 : t.width) || 200}px`,
+            measured: !!(t != null && t.height)
+          }))
+        ]
+      }
+    );
+  }
+);
+g.displayName = "ResizableContainer";
+export {
+  g as ResizableContainer
+};
 //# sourceMappingURL=ResizableContainer.js.map

package/dist/ui/esm/src/core/ui/components/container/ResizableContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResizableContainer.js","sources":["../../../../../../../../src/core/ui/components/container/ResizableContainer.tsx"],"sourcesContent":["import { memo, RefObject, PropsWithChildren, ReactElement, FC, CSSProperties } from 'react'\n\nimport { useResize } from '../../../hooks/useResize'\n\nimport { LayoutBox } from './layoutBox/LayoutBox'\nimport { LayoutBoxProps } from './layoutBox/layoutBox.types'\n\n\nexport type ResizableContainerProps = LayoutBoxProps & PropsWithChildren<any> & {\n  debounceDelay?: number\n  children?: (props: ResizableContainerRenderProps) => ReactElement\n}\n\nexport type ResizableContainerRenderProps = {\n  width: number | string\n  height: number | string\n  measured: boolean\n}\n\nconst styles = {\n  main: {\n    position: 'absolute',\n    zIndex: 1,\n    left: 0,\n    pointerEvents: 'none',\n  },\n  empty: {\n    pointerEvents: 'none',\n  },\n}\n\nexport const ResizableContainer: FC<ResizableContainerProps> = memo<ResizableContainerProps>(\n  ({ children, debounceDelay = 250, ...props }: ResizableContainerProps) => {\n    const [containerRef, containerSize] = useResize(debounceDelay)\n\n    return (\n      <LayoutBox\n        width='100%'\n        height='100%'\n        justify='center'\n        align='center'\n        direction='column'\n        {...props}\n      >\n        <LayoutBox\n          style={styles.main as CSSProperties}\n          width='100%'\n          height='100%'\n          ref={containerRef as RefObject<HTMLDivElement>}\n        />\n        {!children && (\n        <LayoutBox\n          width={`${Math.max(containerSize?.width || 200, 200) || 200}px`}\n          height={`${Math.max(containerSize?.height || 200, 200) || 200}px`}\n          style={styles.empty as CSSProperties}\n        />\n        )}\n        {children && children?.({\n          height: `${containerSize?.height || 200}px`,\n          width: `${containerSize?.width || 200}px`,\n          measured: !!containerSize?.height,\n        } as ResizableContainerRenderProps)}\n      </LayoutBox>\n    )\n  },\n)\n\nResizableContainer.displayName = 'ResizableContainer'\n"],"names":["styles","main","position","zIndex","left","pointerEvents","empty","ResizableContainer","memo","_ref","children","debounceDelay","props","containerRef","containerSize","useResize","React","createElement","LayoutBox","_extends","width","height","justify","align","direction","style","ref","Math","max","measured","displayName"],"mappings":"yNAmBA,MAAMA,EAAS,CACbC,KAAM,CACJC,SAAU,WACVC,OAAQ,EACRC,KAAM,EACNC,cAAe,QAEjBC,MAAO,CACLD,cAAe,SAINE,EAAkDC,GAC7DC,IAA0E,IAAzEC,SAAEA,EAAQC,cAAEA,EAAgB,OAAQC,GAAgCH,EACnE,MAAOI,EAAcC,GAAiBC,EAAUJ,GAEhD,OACEK,MAAAC,cAACC,EAASC,EAAA,CACRC,MAAM,OACNC,OAAO,OACPC,QAAQ,SACRC,MAAM,SACNC,UAAU,UACNZ,GAEJI,MAAAC,cAACC,EAAS,CACRO,MAAOzB,EAAOC,KACdmB,MAAM,OACNC,OAAO,OACPK,IAAKb,KAELH,GACFM,MAAAC,cAACC,EAAS,CACRE,MAAO,GAAGO,KAAKC,IAAId,GAAeM,OAAS,IAAK,MAAQ,QACxDC,OAAQ,GAAGM,KAAKC,IAAId,GAAeO,QAAU,IAAK,MAAQ,QAC1DI,MAAOzB,EAAOM,QAGfI,GAAYA,IAAW,CACtBW,OAAQ,GAAGP,GAAeO,QAAU,QACpCD,MAAO,GAAGN,GAAeM,OAAS,QAClCS,WAAYf,GAAeO,SAEnB,IAKlBd,EAAmBuB,YAAc"}
+{"version":3,"file":"ResizableContainer.js","sources":["../../../../../../../../src/core/ui/components/container/ResizableContainer.tsx"],"sourcesContent":["import { memo, RefObject, PropsWithChildren, ReactElement, FC, CSSProperties } from 'react'\n\nimport { useResize } from '../../../hooks/useResize'\n\nimport { LayoutBox } from './layoutBox/LayoutBox'\nimport { LayoutBoxProps } from './layoutBox/layoutBox.types'\n\n\nexport type ResizableContainerProps = LayoutBoxProps & PropsWithChildren<any> & {\n  debounceDelay?: number\n  children?: (props: ResizableContainerRenderProps) => ReactElement\n}\n\nexport type ResizableContainerRenderProps = {\n  width: number | string\n  height: number | string\n  measured: boolean\n}\n\nconst styles = {\n  main: {\n    position: 'absolute',\n    zIndex: 1,\n    left: 0,\n    pointerEvents: 'none',\n  },\n  empty: {\n    pointerEvents: 'none',\n  },\n}\n\nexport const ResizableContainer: FC<ResizableContainerProps> = memo<ResizableContainerProps>(\n  ({ children, debounceDelay = 250, ...props }: ResizableContainerProps) => {\n    const [containerRef, containerSize] = useResize(debounceDelay)\n\n    return (\n      <LayoutBox\n        width='100%'\n        height='100%'\n        justify='center'\n        align='center'\n        direction='column'\n        {...props}\n      >\n        <LayoutBox\n          style={styles.main as CSSProperties}\n          width='100%'\n          height='100%'\n          ref={containerRef as RefObject<HTMLDivElement>}\n        />\n        {!children && (\n        <LayoutBox\n          width={`${Math.max(containerSize?.width || 200, 200) || 200}px`}\n          height={`${Math.max(containerSize?.height || 200, 200) || 200}px`}\n          style={styles.empty as CSSProperties}\n        />\n        )}\n        {children && children?.({\n          height: `${containerSize?.height || 200}px`,\n          width: `${containerSize?.width || 200}px`,\n          measured: !!containerSize?.height,\n        } as ResizableContainerRenderProps)}\n      </LayoutBox>\n    )\n  },\n)\n\nResizableContainer.displayName = 'ResizableContainer'\n"],"names":["styles","ResizableContainer","memo","children","debounceDelay","props","containerRef","containerSize","useResize","jsxs","LayoutBox","jsx"],"mappings":";;;;AAmBA,MAAMA,IAAS;AAAA,EACb,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,eAAe;AAAA,EAAA;AAAA,EAEjB,OAAO;AAAA,IACL,eAAe;AAAA,EAAA;AAEnB,GAEaC,IAAkDC;AAAA,EAC7D,CAAC,EAAE,UAAAC,GAAU,eAAAC,IAAgB,KAAK,GAAGC,QAAqC;AACxE,UAAM,CAACC,GAAcC,CAAa,IAAIC,EAAUJ,CAAa;AAE7D,WACE,gBAAAK;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,QAAO;AAAA,QACP,SAAQ;AAAA,QACR,OAAM;AAAA,QACN,WAAU;AAAA,QACT,GAAGL;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAM;AAAA,YAACD;AAAA,YAAA;AAAA,cACC,OAAOV,EAAO;AAAA,cACd,OAAM;AAAA,cACN,QAAO;AAAA,cACP,KAAKM;AAAA,YAAA;AAAA,UAAA;AAAA,UAEN,CAACH,KACF,gBAAAQ;AAAA,YAACD;AAAA,YAAA;AAAA,cACC,OAAO,GAAG,KAAK,KAAIH,KAAA,gBAAAA,EAAe,UAAS,KAAK,GAAG,KAAK,GAAG;AAAA,cAC3D,QAAQ,GAAG,KAAK,KAAIA,KAAA,gBAAAA,EAAe,WAAU,KAAK,GAAG,KAAK,GAAG;AAAA,cAC7D,OAAOP,EAAO;AAAA,YAAA;AAAA,UAAA;AAAA,UAGfG,MAAYA,KAAA,gBAAAA,EAAW;AAAA,YACtB,QAAQ,IAAGI,KAAA,gBAAAA,EAAe,WAAU,GAAG;AAAA,YACvC,OAAO,IAAGA,KAAA,gBAAAA,EAAe,UAAS,GAAG;AAAA,YACrC,UAAU,CAAC,EAACA,KAAA,QAAAA,EAAe;AAAA,UAAA;AAAA,QACK;AAAA,MAAA;AAAA,IAAA;AAAA,EAGxC;AACF;AAEAN,EAAmB,cAAc;"}

package/dist/ui/esm/src/core/ui/components/container/layoutBox/LayoutBox.js

@@ -1,2 +1,77 @@
-import{extends as e}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as t,forwardRef as o,useMemo as s}from"react";import{useParseProps as i}from"../../../../hooks/useParseProps.js";import{classNames as r}from"../../../../utils/helpers/ui.js";import a from"./layoutBox.module.scss.js";import{LayoutDirection as l}from"./layoutBox.types.js";const d={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},n=e=>e&&d[e]||e,u=o(((t,o)=>{let{id:d,style:u,children:f,tabIndex:m,className:p="",column:x,asGrid:c=!1,wFull:y=!1,hFull:h=!1,centered:g=!1,flex:b,width:j,height:v,debug:B=!1,background:N,...w}=t;const{dataProps:I,restProps:P}=i(w),L=s((()=>void 0!==x&&!0===x?l.COLUMN:null),[x]),k=s((()=>{const e={...P};return(P.direction||L)&&(e.flexDirection=P.direction||L),g?(e.alignItems="center",e.justifyContent="center"):(P.align&&(e.alignItems=n(P.align)),P.justify&&(e.justifyContent=n(P.justify))),e.display=c?"grid":"flex",y?e.width="100%":void 0!==j&&(e.width="number"==typeof j?`${j}px`:j),h?e.height="100%":void 0!==v&&(e.height="number"==typeof v?`${v}px`:v),void 0!==b&&(e.flex=!0===b?1:b),void 0!==N&&(e.background=N),B&&(e.outline="1px solid red"),{...e,...u}}),[c,N,g,B,b,h,v,L,P,u,y,j]);return React.createElement("div",e({},d?{id:`${d}`}:{},{ref:o,tabIndex:m,className:r(a["layout-box"],p),style:k},I,{"data-testid":I.dataTestId||I["data-testid"]||d}),f)}));u.displayName="LayoutBoxRefForwarded";const f=t(u),m=t(u);f.displayName="LayoutBox",m.displayName="BoxLayout";export{m as BoxLayout,f as LayoutBox};
+import { jsx as M } from "react/jsx-runtime";
+import { memo as N, forwardRef as R, useMemo as L } from "react";
+import { useParseProps as $ } from "../../../../hooks/useParseProps.js";
+import { classNames as D } from "../../../../utils/helpers/ui.js";
+import g from "./layoutBox.module.scss.js";
+import { LayoutDirection as F } from "./layoutBox.types.js";
+const O = {
+  start: "flex-start",
+  "flex-start": "flex-start",
+  end: "flex-end",
+  "flex-end": "flex-end"
+}, B = (t) => t && (O[t] || t), d = R(({
+  id: t,
+  style: m,
+  children: j,
+  tabIndex: v,
+  className: P = "",
+  column: a,
+  asGrid: p = !1,
+  wFull: y = !1,
+  hFull: x = !1,
+  centered: u = !1,
+  flex: s,
+  width: i,
+  height: r,
+  debug: c = !1,
+  background: f,
+  ...C
+}, b) => {
+  const { dataProps: l, restProps: o } = $(C), n = L(() => a !== void 0 && a === !0 ? F.COLUMN : null, [a]), I = L(() => {
+    const e = {
+      ...o
+    };
+    return (o.direction || n) && (e.flexDirection = o.direction || n), u ? (e.alignItems = "center", e.justifyContent = "center") : (o.align && (e.alignItems = B(o.align)), o.justify && (e.justifyContent = B(o.justify))), p ? e.display = "grid" : e.display = "flex", y ? e.width = "100%" : i !== void 0 && (e.width = typeof i == "number" ? `${i}px` : i), x ? e.height = "100%" : r !== void 0 && (e.height = typeof r == "number" ? `${r}px` : r), s !== void 0 && (s === !0 ? e.flex = 1 : e.flex = s), f !== void 0 && (e.background = f), c && (e.outline = "1px solid red"), {
+      ...e,
+      ...m
+    };
+  }, [
+    p,
+    f,
+    u,
+    c,
+    s,
+    x,
+    r,
+    n,
+    o,
+    m,
+    y,
+    i
+  ]);
+  return /* @__PURE__ */ M(
+    "div",
+    {
+      ...t ? { id: `${t}` } : {},
+      ref: b,
+      tabIndex: v,
+      className: D(
+        g["layout-box"],
+        P
+      ),
+      style: I,
+      ...l,
+      "data-testid": l.dataTestId || l["data-testid"] || t,
+      children: j
+    }
+  );
+});
+d.displayName = "LayoutBoxRefForwarded";
+const S = N(d), T = N(d);
+S.displayName = "LayoutBox";
+T.displayName = "BoxLayout";
+export {
+  T as BoxLayout,
+  S as LayoutBox
+};
 //# sourceMappingURL=LayoutBox.js.map

package/dist/ui/esm/src/core/ui/components/container/layoutBox/LayoutBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"LayoutBox.js","sources":["../../../../../../../../../src/core/ui/components/container/layoutBox/LayoutBox.tsx"],"sourcesContent":["import { memo, FC, useMemo, CSSProperties, forwardRef, LegacyRef } from 'react'\n\nimport { useParseProps } from '../../../../hooks/useParseProps'\nimport { classNames } from '../../../../utils/helpers/ui'\n\nimport classes from './layoutBox.module.scss'\nimport { LayoutDirection, LayoutBoxProps } from './layoutBox.types'\n\n/**\n * Map of flex values for resolving flex alignment and justification.\n * @type {Record<string, string>}\n */\nconst flexValueMap: Record<string, string> = {\n  start: 'flex-start',\n  'flex-start': 'flex-start',\n  end: 'flex-end',\n  'flex-end': 'flex-end',\n}\n\n/**\n * Resolves flex alignment and justification properties based on the provided value.\n * @param {string | undefined} value - The value to resolve.\n * @returns {string | undefined} - Resolved flex property value.\n */\nconst resolveFlexProps = (value?: string): string | undefined => (value ? (flexValueMap[value] || value) : value)\n\n/**\n * Forwarded ref version of the LayoutBox component.\n * @param {LayoutBoxProps} props - Props for the LayoutBox component.\n * @param {LegacyRef<HTMLDivElement> | undefined} ref - Ref for accessing the underlying DOM element.\n * @returns {JSX.Element} - Rendered LayoutBox component.\n */\nconst LayoutBoxRefForwarded = forwardRef(({\n  id,\n  style,\n  children,\n  tabIndex,\n  className = '',\n  column,\n  asGrid = false,\n  wFull = false,\n  hFull = false,\n  centered = false,\n  flex,\n  width,\n  height,\n  debug = false,\n  background,\n  ...props\n}: LayoutBoxProps, ref: LegacyRef<HTMLDivElement> | undefined | null) => {\n  const { dataProps, restProps } = useParseProps(props)\n\n  /**\n   * Memoized resolved direction based on the column prop.\n   * @type {LayoutDirection}\n   */\n  const resolvedColumn = useMemo(() => ((\n    column !== undefined && column === true)\n    ? LayoutDirection.COLUMN\n    : null), [column])\n\n  /**\n  * Memoized styles combining parsed props, BoxLayout-like helpers and additional styles.\n  * @type {CSSProperties}\n  */\n  const styles = useMemo(() => {\n    const baseStyles: CSSProperties = {\n      ...(restProps as CSSProperties),\n    }\n\n    // Resolve direction (supports column helper)\n    if (restProps.direction || resolvedColumn) {\n      baseStyles.flexDirection = (restProps.direction || resolvedColumn) as CSSProperties['flexDirection']\n    }\n\n    // Resolve alignment and justification\n    if (centered) {\n      baseStyles.alignItems = 'center'\n      baseStyles.justifyContent = 'center'\n    } else {\n      if (restProps.align) {\n        baseStyles.alignItems = resolveFlexProps(restProps.align as string)\n      }\n      if (restProps.justify) {\n        baseStyles.justifyContent = resolveFlexProps(restProps.justify as string)\n      }\n    }\n\n    // Flex or grid display\n    if (asGrid) {\n      baseStyles.display = 'grid'\n    } else {\n      baseStyles.display = 'flex'\n    }\n\n    // Width / height helpers\n    if (wFull) {\n      baseStyles.width = '100%'\n    } else if (width !== undefined) {\n      baseStyles.width = typeof width === 'number' ? `${width}px` : width\n    }\n\n    if (hFull) {\n      baseStyles.height = '100%'\n    } else if (height !== undefined) {\n      baseStyles.height = typeof height === 'number' ? `${height}px` : height\n    }\n\n    // Flex helper\n    if (flex !== undefined) {\n      if (flex === true) {\n        baseStyles.flex = 1\n      } else if (typeof flex === 'number') {\n        baseStyles.flex = flex\n      } else {\n        baseStyles.flex = flex as string\n      }\n    }\n\n    // Background helper\n    if (background !== undefined) {\n      baseStyles.background = background\n    }\n\n    // Debug outline helper\n    if (debug) {\n      baseStyles.outline = '1px solid red'\n    }\n\n    // User provided style wins last\n    return {\n      ...baseStyles,\n      ...style,\n    }\n  }, [\n    asGrid,\n    background,\n    centered,\n    debug,\n    flex,\n    hFull,\n    height,\n    resolvedColumn,\n    restProps,\n    style,\n    wFull,\n    width,\n  ])\n\n  return (\n    <div\n      {...(id ? { id: `${id}` } : {})}\n      ref={ref}\n      tabIndex={tabIndex}\n      className={classNames(\n        classes['layout-box'],\n        className,\n      )}\n      style={styles as CSSProperties}\n      {...dataProps}\n      data-testid={dataProps.dataTestId || dataProps['data-testid'] || id}\n    >\n      {children}\n    </div>\n  )\n})\n\nLayoutBoxRefForwarded.displayName = 'LayoutBoxRefForwarded'\n\n/**\n * Memoized and memoized LayoutBox component.\n * @type {FC<LayoutBoxProps>}\n */\nexport const LayoutBox: FC<LayoutBoxProps> = memo<LayoutBoxProps>(LayoutBoxRefForwarded)\n\nexport const BoxLayout: FC<LayoutBoxProps> = memo<LayoutBoxProps>(LayoutBoxRefForwarded)\n\nLayoutBox.displayName = 'LayoutBox'\n\nBoxLayout.displayName = 'BoxLayout'\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","LayoutBoxRefForwarded","forwardRef","_ref","ref","id","style","children","tabIndex","className","column","asGrid","wFull","hFull","centered","flex","width","height","debug","background","props","dataProps","restProps","useParseProps","resolvedColumn","useMemo","undefined","LayoutDirection","COLUMN","styles","baseStyles","direction","flexDirection","alignItems","justifyContent","align","justify","display","outline","React","createElement","_extends","classNames","classes","dataTestId","displayName","LayoutBox","memo","BoxLayout"],"mappings":"6WAYA,MAAMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAQRC,EAAoBC,GAAwCA,GAASJ,EAAaI,IAAmBA,EAQrGC,EAAwBC,GAAW,CAAAC,EAiBtBC,KAAsD,IAjB/BC,GACxCA,EAAEC,MACFA,EAAKC,SACLA,EAAQC,SACRA,EAAQC,UACRA,EAAY,GAAEC,OACdA,EAAMC,OACNA,GAAS,EAAKC,MACdA,GAAQ,EAAKC,MACbA,GAAQ,EAAKC,SACbA,GAAW,EAAKC,KAChBA,EAAIC,MACJA,EAAKC,OACLA,EAAMC,MACNA,GAAQ,EAAKC,WACbA,KACGC,GACYjB,EACf,MAAMkB,UAAEA,EAASC,UAAEA,GAAcC,EAAcH,GAMzCI,EAAiBC,GAAQ,SAClBC,IAAXhB,IAAmC,IAAXA,EACtBiB,EAAgBC,OAChB,MAAO,CAAClB,IAMNmB,EAASJ,GAAQ,KACrB,MAAMK,EAA4B,IAC5BR,GA+DN,OA3DIA,EAAUS,WAAaP,KACzBM,EAAWE,cAAiBV,EAAUS,WAAaP,GAIjDV,GACFgB,EAAWG,WAAa,SACxBH,EAAWI,eAAiB,WAExBZ,EAAUa,QACZL,EAAWG,WAAalC,EAAiBuB,EAAUa,QAEjDb,EAAUc,UACZN,EAAWI,eAAiBnC,EAAiBuB,EAAUc,WAMzDN,EAAWO,QADT1B,EACmB,OAEA,OAInBC,EACFkB,EAAWd,MAAQ,YACAU,IAAVV,IACTc,EAAWd,MAAyB,iBAAVA,EAAqB,GAAGA,MAAYA,GAG5DH,EACFiB,EAAWb,OAAS,YACAS,IAAXT,IACTa,EAAWb,OAA2B,iBAAXA,EAAsB,GAAGA,MAAaA,QAItDS,IAATX,IAEAe,EAAWf,MADA,IAATA,EACgB,EAEAA,QAOHW,IAAfP,IACFW,EAAWX,WAAaA,GAItBD,IACFY,EAAWQ,QAAU,iBAIhB,IACFR,KACAxB,EACJ,GACA,CACDK,EACAQ,EACAL,EACAI,EACAH,EACAF,EACAI,EACAO,EACAF,EACAhB,EACAM,EACAI,IAGF,OACEuB,MAAAC,oBAAAC,EAAA,CAAA,EACOpC,EAAK,CAAEA,GAAI,GAAGA,KAAS,GAAE,CAC9BD,IAAKA,EACLI,SAAUA,EACVC,UAAWiC,EACTC,EAAQ,cACRlC,GAEFH,MAAOuB,GACHR,EAAS,CACb,cAAaA,EAAUuB,YAAcvB,EAAU,gBAAkBhB,IAEhEE,EACG,IAIVN,EAAsB4C,YAAc,8BAMvBC,EAAgCC,EAAqB9C,GAErD+C,EAAgCD,EAAqB9C,GAElE6C,EAAUD,YAAc,YAExBG,EAAUH,YAAc"}
+{"version":3,"file":"LayoutBox.js","sources":["../../../../../../../../../src/core/ui/components/container/layoutBox/LayoutBox.tsx"],"sourcesContent":["import { memo, FC, useMemo, CSSProperties, forwardRef, LegacyRef } from 'react'\n\nimport { useParseProps } from '../../../../hooks/useParseProps'\nimport { classNames } from '../../../../utils/helpers/ui'\n\nimport classes from './layoutBox.module.scss'\nimport { LayoutDirection, LayoutBoxProps } from './layoutBox.types'\n\n/**\n * Map of flex values for resolving flex alignment and justification.\n * @type {Record<string, string>}\n */\nconst flexValueMap: Record<string, string> = {\n  start: 'flex-start',\n  'flex-start': 'flex-start',\n  end: 'flex-end',\n  'flex-end': 'flex-end',\n}\n\n/**\n * Resolves flex alignment and justification properties based on the provided value.\n * @param {string | undefined} value - The value to resolve.\n * @returns {string | undefined} - Resolved flex property value.\n */\nconst resolveFlexProps = (value?: string): string | undefined => (value ? (flexValueMap[value] || value) : value)\n\n/**\n * Forwarded ref version of the LayoutBox component.\n * @param {LayoutBoxProps} props - Props for the LayoutBox component.\n * @param {LegacyRef<HTMLDivElement> | undefined} ref - Ref for accessing the underlying DOM element.\n * @returns {JSX.Element} - Rendered LayoutBox component.\n */\nconst LayoutBoxRefForwarded = forwardRef(({\n  id,\n  style,\n  children,\n  tabIndex,\n  className = '',\n  column,\n  asGrid = false,\n  wFull = false,\n  hFull = false,\n  centered = false,\n  flex,\n  width,\n  height,\n  debug = false,\n  background,\n  ...props\n}: LayoutBoxProps, ref: LegacyRef<HTMLDivElement> | undefined | null) => {\n  const { dataProps, restProps } = useParseProps(props)\n\n  /**\n   * Memoized resolved direction based on the column prop.\n   * @type {LayoutDirection}\n   */\n  const resolvedColumn = useMemo(() => ((\n    column !== undefined && column === true)\n    ? LayoutDirection.COLUMN\n    : null), [column])\n\n  /**\n  * Memoized styles combining parsed props, BoxLayout-like helpers and additional styles.\n  * @type {CSSProperties}\n  */\n  const styles = useMemo(() => {\n    const baseStyles: CSSProperties = {\n      ...(restProps as CSSProperties),\n    }\n\n    // Resolve direction (supports column helper)\n    if (restProps.direction || resolvedColumn) {\n      baseStyles.flexDirection = (restProps.direction || resolvedColumn) as CSSProperties['flexDirection']\n    }\n\n    // Resolve alignment and justification\n    if (centered) {\n      baseStyles.alignItems = 'center'\n      baseStyles.justifyContent = 'center'\n    } else {\n      if (restProps.align) {\n        baseStyles.alignItems = resolveFlexProps(restProps.align as string)\n      }\n      if (restProps.justify) {\n        baseStyles.justifyContent = resolveFlexProps(restProps.justify as string)\n      }\n    }\n\n    // Flex or grid display\n    if (asGrid) {\n      baseStyles.display = 'grid'\n    } else {\n      baseStyles.display = 'flex'\n    }\n\n    // Width / height helpers\n    if (wFull) {\n      baseStyles.width = '100%'\n    } else if (width !== undefined) {\n      baseStyles.width = typeof width === 'number' ? `${width}px` : width\n    }\n\n    if (hFull) {\n      baseStyles.height = '100%'\n    } else if (height !== undefined) {\n      baseStyles.height = typeof height === 'number' ? `${height}px` : height\n    }\n\n    // Flex helper\n    if (flex !== undefined) {\n      if (flex === true) {\n        baseStyles.flex = 1\n      } else if (typeof flex === 'number') {\n        baseStyles.flex = flex\n      } else {\n        baseStyles.flex = flex as string\n      }\n    }\n\n    // Background helper\n    if (background !== undefined) {\n      baseStyles.background = background\n    }\n\n    // Debug outline helper\n    if (debug) {\n      baseStyles.outline = '1px solid red'\n    }\n\n    // User provided style wins last\n    return {\n      ...baseStyles,\n      ...style,\n    }\n  }, [\n    asGrid,\n    background,\n    centered,\n    debug,\n    flex,\n    hFull,\n    height,\n    resolvedColumn,\n    restProps,\n    style,\n    wFull,\n    width,\n  ])\n\n  return (\n    <div\n      {...(id ? { id: `${id}` } : {})}\n      ref={ref}\n      tabIndex={tabIndex}\n      className={classNames(\n        classes['layout-box'],\n        className,\n      )}\n      style={styles as CSSProperties}\n      {...dataProps}\n      data-testid={dataProps.dataTestId || dataProps['data-testid'] || id}\n    >\n      {children}\n    </div>\n  )\n})\n\nLayoutBoxRefForwarded.displayName = 'LayoutBoxRefForwarded'\n\n/**\n * Memoized and memoized LayoutBox component.\n * @type {FC<LayoutBoxProps>}\n */\nexport const LayoutBox: FC<LayoutBoxProps> = memo<LayoutBoxProps>(LayoutBoxRefForwarded)\n\nexport const BoxLayout: FC<LayoutBoxProps> = memo<LayoutBoxProps>(LayoutBoxRefForwarded)\n\nLayoutBox.displayName = 'LayoutBox'\n\nBoxLayout.displayName = 'BoxLayout'\n"],"names":["flexValueMap","resolveFlexProps","value","LayoutBoxRefForwarded","forwardRef","id","style","children","tabIndex","className","column","asGrid","wFull","hFull","centered","flex","width","height","debug","background","props","ref","dataProps","restProps","useParseProps","resolvedColumn","useMemo","LayoutDirection","styles","baseStyles","jsx","classNames","classes","LayoutBox","memo","BoxLayout"],"mappings":";;;;;;AAYA,MAAMA,IAAuC;AAAA,EAC3C,OAAO;AAAA,EACP,cAAc;AAAA,EACd,KAAK;AAAA,EACL,YAAY;AACd,GAOMC,IAAmB,CAACC,MAAwCA,MAASF,EAAaE,CAAK,KAAKA,IAQ5FC,IAAwBC,EAAW,CAAC;AAAA,EACxC,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,QAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,OAAAC,IAAQ;AAAA,EACR,OAAAC,IAAQ;AAAA,EACR,UAAAC,IAAW;AAAA,EACX,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,YAAAC;AAAA,EACA,GAAGC;AACL,GAAmBC,MAAsD;AACvE,QAAM,EAAE,WAAAC,GAAW,WAAAC,MAAcC,EAAcJ,CAAK,GAM9CK,IAAiBC,EAAQ,MAC7BhB,MAAW,UAAaA,MAAW,KACjCiB,EAAgB,SAChB,MAAO,CAACjB,CAAM,CAAC,GAMbkB,IAASF,EAAQ,MAAM;AAC3B,UAAMG,IAA4B;AAAA,MAChC,GAAIN;AAAA,IAAA;AAIN,YAAIA,EAAU,aAAaE,OACzBI,EAAW,gBAAiBN,EAAU,aAAaE,IAIjDX,KACFe,EAAW,aAAa,UACxBA,EAAW,iBAAiB,aAExBN,EAAU,UACZM,EAAW,aAAa5B,EAAiBsB,EAAU,KAAe,IAEhEA,EAAU,YACZM,EAAW,iBAAiB5B,EAAiBsB,EAAU,OAAiB,KAKxEZ,IACFkB,EAAW,UAAU,SAErBA,EAAW,UAAU,QAInBjB,IACFiB,EAAW,QAAQ,SACVb,MAAU,WACnBa,EAAW,QAAQ,OAAOb,KAAU,WAAW,GAAGA,CAAK,OAAOA,IAG5DH,IACFgB,EAAW,SAAS,SACXZ,MAAW,WACpBY,EAAW,SAAS,OAAOZ,KAAW,WAAW,GAAGA,CAAM,OAAOA,IAI/DF,MAAS,WACPA,MAAS,KACXc,EAAW,OAAO,IAElBA,EAAW,OAAOd,IAOlBI,MAAe,WACjBU,EAAW,aAAaV,IAItBD,MACFW,EAAW,UAAU,kBAIhB;AAAA,MACL,GAAGA;AAAA,MACH,GAAGvB;AAAA,IAAA;AAAA,EAEP,GAAG;AAAA,IACDK;AAAA,IACAQ;AAAA,IACAL;AAAA,IACAI;AAAA,IACAH;AAAA,IACAF;AAAA,IACAI;AAAA,IACAQ;AAAA,IACAF;AAAA,IACAjB;AAAA,IACAM;AAAA,IACAI;AAAA,EAAA,CACD;AAED,SACE,gBAAAc;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAIzB,IAAK,EAAE,IAAI,GAAGA,CAAE,GAAA,IAAO,CAAA;AAAA,MAC5B,KAAAgB;AAAA,MACA,UAAAb;AAAA,MACA,WAAWuB;AAAA,QACTC,EAAQ,YAAY;AAAA,QACpBvB;AAAA,MAAA;AAAA,MAEF,OAAOmB;AAAA,MACN,GAAGN;AAAA,MACJ,eAAaA,EAAU,cAAcA,EAAU,aAAa,KAAKjB;AAAA,MAEhE,UAAAE;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;AAEDJ,EAAsB,cAAc;AAM7B,MAAM8B,IAAgCC,EAAqB/B,CAAqB,GAE1EgC,IAAgCD,EAAqB/B,CAAqB;AAEvF8B,EAAU,cAAc;AAExBE,EAAU,cAAc;"}