@e1011/es-kit 1.5.0 → 1.5.4

package/dist/ui/esm/src/core/ui/components/atoms/text/anchor-link/AnchorLink.js

@@ -1,2 +1,54 @@
-import{extends as e}from"../../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as t,useCallback as r,useMemo as a}from"react";import{Link as o}from"../Link.js";import s from"./anchorLink.module.scss.js";import{classNames as i}from"../../../../../utils/helpers/ui.js";import{composeId as n}from"../../../../../utils/helpers/text.js";const l=t((t=>{let{id:l,onClick:m,href:c,asLink:d=!1,text:p,children:u,className:f="",...h}=t;const k=p||u?.toString(),b=r((e=>m?(e?.preventDefault(),e?.stopPropagation(),m(e,c,h.target,u)):null),[c,m,u,h.target]),g=a((()=>m?{onClick:b,onKeyDown:b,role:"button",tabIndex:-1}:{}),[b,m]);return React.createElement("span",e({},g,{id:`${void 0!==l&&l||k&&n(k)}`,"data-testid":h.dataTestId||h["data-testid"]||l||k&&n(k)}),d&&React.createElement(o,e({href:c||""},h),u||p||c),!d&&React.createElement("a",e({href:c||"",className:i(s.anchorLink,h.disabled&&s.disabled,f)},h),u||p||c))}));l.displayName="AnchorLink";export{l as AnchorLink};
+import { jsxs as e, jsx as u } from "react/jsx-runtime";
+import { memo as k, useCallback as p, useMemo as x } from "react";
+import { Link as y } from "../Link.js";
+import f from "./anchorLink.module.scss.js";
+import { classNames as I } from "../../../../../utils/helpers/ui.js";
+import { composeId as c } from "../../../../../utils/helpers/text.js";
+const L = k(({
+  id: i,
+  onClick: m,
+  href: s,
+  asLink: n = !1,
+  text: d,
+  children: a,
+  className: b = "",
+  ...o
+}) => {
+  const r = d || (a == null ? void 0 : a.toString()), l = p((t) => m ? (t == null || t.preventDefault(), t == null || t.stopPropagation(), m(t, s, o.target, a)) : null, [s, m, a, o.target]), g = x(() => m ? {
+    onClick: l,
+    onKeyDown: l,
+    role: "button",
+    tabIndex: -1
+  } : {}, [l, m]);
+  return (
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    /* @__PURE__ */ e(
+      "span",
+      {
+        ...g,
+        id: `${typeof i < "u" && i || r && c(r)}`,
+        "data-testid": o.dataTestId || o["data-testid"] || i || r && c(r),
+        children: [
+          n && /* @__PURE__ */ u(y, { href: s || "", ...o, children: a || d || s }),
+          !n && /* eslint-disable-next-line @typescript-eslint/ban-ts-comment */
+          /* @ts-ignore */
+          /* @__PURE__ */ u(
+            "a",
+            {
+              href: s || "",
+              className: I(f.anchorLink, o.disabled && f.disabled, b),
+              ...o,
+              children: a || d || s
+            }
+          )
+        ]
+      }
+    )
+  );
+});
+L.displayName = "AnchorLink";
+export {
+  L as AnchorLink
+};
 //# sourceMappingURL=AnchorLink.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"AnchorLink.js","sources":["../../../../../../../../../../src/core/ui/components/atoms/text/anchor-link/AnchorLink.tsx"],"sourcesContent":["import { memo, FC, useCallback, MouseEvent, useMemo } from 'react'\n\nimport { Link } from '../Link'\nimport { classNames, composeId } from '../../../../../utils'\n\nimport type { AnchorLinkProps } from './anchorLink.types'\nimport classes from './anchorLink.module.scss'\n\n\n\n/**\n * AnchorLink component.\n *\n * @type {React.FC<AnchorLinkProps>}\n * @returns {React.ReactElement} The AnchorLink.\n */\nexport const AnchorLink: FC<AnchorLinkProps> = memo<AnchorLinkProps>(({\n  id,\n  onClick,\n  href,\n  asLink = false,\n  text,\n  children,\n  className = '',\n  ...props\n}: AnchorLinkProps) => {\n  const textFromChildren: string | undefined = text || children?.toString()\n\n  const clickHandler = useCallback((event?: MouseEvent) => {\n    if (onClick) {\n      event?.preventDefault()\n      event?.stopPropagation()\n      return onClick(event, href, props.target, children as string)\n    }\n\n    return null\n  }, [href, onClick, children, props.target])\n\n  const onClickProps = useMemo(() => (onClick ? ({\n    onClick: clickHandler,\n    onKeyDown: clickHandler,\n    role: 'button',\n    tabIndex: -1,\n  }) : {}), [clickHandler, onClick])\n\n  return (\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    <span\n      {...onClickProps}\n      id={`${(typeof id !== 'undefined' && id) || (textFromChildren && composeId(textFromChildren))}`}\n      data-testid={props.dataTestId || props['data-testid'] || id || (textFromChildren && composeId(textFromChildren))}\n    >\n      {asLink && <Link href={href || ''} {...props}>{children || text || href}</Link>}\n      {!asLink && (\n      /* eslint-disable-next-line @typescript-eslint/ban-ts-comment */\n      /* @ts-ignore */\n      <a\n        href={href || ''}\n        className={\n          classNames(classes.anchorLink, props.disabled && classes.disabled, className)\n        }\n        {...props}\n      >{children || text || href}\n      </a>\n      )}\n    </span>\n\n\n  )\n})\n\nexport type AnchorLinkType = typeof AnchorLink;\n\nAnchorLink.displayName = 'AnchorLink'\n"],"names":["AnchorLink","memo","_ref","id","onClick","href","asLink","text","children","className","props","textFromChildren","toString","clickHandler","useCallback","event","preventDefault","stopPropagation","target","onClickProps","useMemo","onKeyDown","role","tabIndex","React","createElement","_extends","composeId","dataTestId","Link","classNames","classes","anchorLink","disabled","displayName"],"mappings":"oWAgBaA,EAAkCC,GAAsBC,IAS9C,IAT+CC,GACpEA,EAAEC,QACFA,EAAOC,KACPA,EAAIC,OACJA,GAAS,EAAKC,KACdA,EAAIC,SACJA,EAAQC,UACRA,EAAY,MACTC,GACaR,EAChB,MAAMS,EAAuCJ,GAAQC,GAAUI,WAEzDC,EAAeC,GAAaC,GAC5BX,GACFW,GAAOC,iBACPD,GAAOE,kBACAb,EAAQW,EAAOV,EAAMK,EAAMQ,OAAQV,IAGrC,MACN,CAACH,EAAMD,EAASI,EAAUE,EAAMQ,SAE7BC,EAAeC,GAAQ,IAAOhB,EAAW,CAC7CA,QAASS,EACTQ,UAAWR,EACXS,KAAM,SACNC,UAAU,GACP,IAAK,CAACV,EAAcT,IAEzB,OAGEoB,MAAAC,cAAA,OAAAC,KACMP,EAAY,CAChBhB,GAAI,QAAkB,IAAPA,GAAsBA,GAAQQ,GAAoBgB,EAAUhB,KAC3E,cAAaD,EAAMkB,YAAclB,EAAM,gBAAkBP,GAAOQ,GAAoBgB,EAAUhB,KAE7FL,GAAUkB,MAAAC,cAACI,EAAIH,EAAA,CAACrB,KAAMA,GAAQ,IAAQK,GAAQF,GAAYD,GAAQF,IACjEC,GAGFkB,MAAAC,cAAA,IAAAC,EAAA,CACErB,KAAMA,GAAQ,GACdI,UACEqB,EAAWC,EAAQC,WAAYtB,EAAMuB,UAAYF,EAAQE,SAAUxB,IAEjEC,GACJF,GAAYD,GAAQF,GAGjB,IAQXL,EAAWkC,YAAc"}
+{"version":3,"file":"AnchorLink.js","sources":["../../../../../../../../../../src/core/ui/components/atoms/text/anchor-link/AnchorLink.tsx"],"sourcesContent":["import { memo, FC, useCallback, MouseEvent, useMemo } from 'react'\n\nimport { Link } from '../Link'\nimport { classNames, composeId } from '../../../../../utils'\n\nimport type { AnchorLinkProps } from './anchorLink.types'\nimport classes from './anchorLink.module.scss'\n\n\n\n/**\n * AnchorLink component.\n *\n * @type {React.FC<AnchorLinkProps>}\n * @returns {React.ReactElement} The AnchorLink.\n */\nexport const AnchorLink: FC<AnchorLinkProps> = memo<AnchorLinkProps>(({\n  id,\n  onClick,\n  href,\n  asLink = false,\n  text,\n  children,\n  className = '',\n  ...props\n}: AnchorLinkProps) => {\n  const textFromChildren: string | undefined = text || children?.toString()\n\n  const clickHandler = useCallback((event?: MouseEvent) => {\n    if (onClick) {\n      event?.preventDefault()\n      event?.stopPropagation()\n      return onClick(event, href, props.target, children as string)\n    }\n\n    return null\n  }, [href, onClick, children, props.target])\n\n  const onClickProps = useMemo(() => (onClick ? ({\n    onClick: clickHandler,\n    onKeyDown: clickHandler,\n    role: 'button',\n    tabIndex: -1,\n  }) : {}), [clickHandler, onClick])\n\n  return (\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    <span\n      {...onClickProps}\n      id={`${(typeof id !== 'undefined' && id) || (textFromChildren && composeId(textFromChildren))}`}\n      data-testid={props.dataTestId || props['data-testid'] || id || (textFromChildren && composeId(textFromChildren))}\n    >\n      {asLink && <Link href={href || ''} {...props}>{children || text || href}</Link>}\n      {!asLink && (\n      /* eslint-disable-next-line @typescript-eslint/ban-ts-comment */\n      /* @ts-ignore */\n      <a\n        href={href || ''}\n        className={\n          classNames(classes.anchorLink, props.disabled && classes.disabled, className)\n        }\n        {...props}\n      >{children || text || href}\n      </a>\n      )}\n    </span>\n\n\n  )\n})\n\nexport type AnchorLinkType = typeof AnchorLink;\n\nAnchorLink.displayName = 'AnchorLink'\n"],"names":["AnchorLink","memo","id","onClick","href","asLink","text","children","className","props","textFromChildren","clickHandler","useCallback","event","onClickProps","useMemo","jsxs","composeId","jsx","Link","classNames","classes"],"mappings":";;;;;;AAgBO,MAAMA,IAAkCC,EAAsB,CAAC;AAAA,EACpE,IAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAuB;AACrB,QAAMC,IAAuCJ,MAAQC,KAAA,gBAAAA,EAAU,aAEzDI,IAAeC,EAAY,CAACC,MAC5BV,KACFU,KAAA,QAAAA,EAAO,kBACPA,KAAA,QAAAA,EAAO,mBACAV,EAAQU,GAAOT,GAAMK,EAAM,QAAQF,CAAkB,KAGvD,MACN,CAACH,GAAMD,GAASI,GAAUE,EAAM,MAAM,CAAC,GAEpCK,IAAeC,EAAQ,MAAOZ,IAAW;AAAA,IAC7C,SAASQ;AAAA,IACT,WAAWA;AAAA,IACX,MAAM;AAAA,IACN,UAAU;AAAA,EAAA,IACP,IAAK,CAACA,GAAcR,CAAO,CAAC;AAEjC;AAAA;AAAA;AAAA,IAGE,gBAAAa;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAGF;AAAA,QACJ,IAAI,GAAI,OAAOZ,IAAO,OAAeA,KAAQQ,KAAoBO,EAAUP,CAAgB,CAAE;AAAA,QAC7F,eAAaD,EAAM,cAAcA,EAAM,aAAa,KAAKP,KAAOQ,KAAoBO,EAAUP,CAAgB;AAAA,QAE7G,UAAA;AAAA,UAAAL,KAAU,gBAAAa,EAACC,KAAK,MAAMf,KAAQ,IAAK,GAAGK,GAAQ,UAAAF,KAAYD,KAAQF,EAAA,CAAK;AAAA,UACvE,CAACC;AAAA;AAAA,UAGF,gBAAAa;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAMd,KAAQ;AAAA,cACd,WACEgB,EAAWC,EAAQ,YAAYZ,EAAM,YAAYY,EAAQ,UAAUb,CAAS;AAAA,cAE7E,GAAGC;AAAA,cACJ,eAAYH,KAAQF;AAAA,YAAA;AAAA,UAAA;AAAA,QACtB;AAAA,MAAA;AAAA,IAAA;AAAA;AAMN,CAAC;AAIDJ,EAAW,cAAc;"}

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;"}