@e1011/es-kit 1.1.78 → 1.1.80

package/dist/types/src/core/ui/components/container/layoutBox/LayoutBox.d.ts

@@ -5,4 +5,5 @@ import { LayoutBoxProps } from './layoutBox.types';
  * @type {FC<LayoutBoxProps>}
  */
 export declare const LayoutBox: FC<LayoutBoxProps>;
+export declare const BoxLayout: FC<LayoutBoxProps>;
 //# sourceMappingURL=LayoutBox.d.ts.map

package/dist/types/src/core/ui/components/container/layoutBox/LayoutBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LayoutBox.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/container/layoutBox/LayoutBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,EAAE,EAAiD,MAAM,OAAO,CAAA;AAM/E,OAAO,EAAmB,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAsFnE;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAA+C,CAAA"}
+{"version":3,"file":"LayoutBox.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/container/layoutBox/LayoutBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,EAAE,EAAiD,MAAM,OAAO,CAAA;AAM/E,OAAO,EAAmB,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAgLnE;;;GAGG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAA+C,CAAA;AAExF,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAA+C,CAAA"}

package/dist/types/src/core/ui/components/container/layoutBox/layoutBox.types.d.ts

@@ -12,8 +12,8 @@ export declare enum LayoutDirection {
 export type LayoutBoxProps = PropsWithChildren & {
     /** Unique identifier for the component. */
     id?: string | number;
-    /** CSS flex property. */
-    flex?: string;
+    /** CSS flex property. Can be string, boolean (true = flex-1), or number. */
+    flex?: string | boolean | number;
     /** CSS flexGrow property. */
     flexGrow?: string | number;
     /** Text alignment within the box. */
@@ -36,10 +36,10 @@ export type LayoutBoxProps = PropsWithChildren & {
     margin?: string;
     /** CSS padding property. */
     padding?: string;
-    /** CSS width property. */
-    width?: string;
-    /** CSS height property. */
-    height?: string;
+    /** CSS width property. Can be string or number (converted to px). */
+    width?: string | number;
+    /** CSS height property. Can be string or number (converted to px). */
+    height?: string | number;
     /** CSS maxWidth property. */
     maxWidth?: string;
     /** CSS maxHeight property. */
@@ -52,6 +52,8 @@ export type LayoutBoxProps = PropsWithChildren & {
     gap?: string;
     /** CSS borderRadius property. */
     borderRadius?: string;
+    /** CSS background property. */
+    background?: string;
     /** Additional inline styles for the component. */
     style?: Record<string, unknown> | null;
     /** Additional class name(s) for the component. */
@@ -64,5 +66,15 @@ export type LayoutBoxProps = PropsWithChildren & {
     onClick?: () => void;
     /** If true, sets the layout direction to column. */
     column?: boolean;
-} & Omit<CSSProperties, 'direction'>;
+    /** If true, uses CSS Grid instead of Flexbox. */
+    asGrid?: boolean;
+    /** If true, sets width to 100%. */
+    wFull?: boolean;
+    /** If true, sets height to 100%. */
+    hFull?: boolean;
+    /** If true, centers content in both axes. */
+    centered?: boolean;
+    /** If true, adds an outline to help debug layout issues. */
+    debug?: boolean;
+} & Omit<CSSProperties, 'direction' | 'flex'>;
 //# sourceMappingURL=layoutBox.types.d.ts.map

package/dist/types/src/core/ui/components/container/layoutBox/layoutBox.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"layoutBox.types.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/container/layoutBox/layoutBox.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAEnE;;GAEG;AACH,oBAAY,eAAe;IACzB,GAAG,QAAQ;IACX,MAAM,WAAW;CAClB;AAED;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,iBAAiB,GAAG;IAC/C,2CAA2C;IAC3C,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACpB,yBAAyB;IACzB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC1B,qCAAqC;IACrC,SAAS,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAA;IACvC,+CAA+C;IAC/C,SAAS,CAAC,EAAE,eAAe,GAAG,MAAM,CAAA;IACpC,+BAA+B;IAC/B,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC5B,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,oCAAoC;IACpC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,2BAA2B;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,4BAA4B;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,0BAA0B;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,2BAA2B;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kCAAkC;IAClC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,iCAAiC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI,CAAA;IACtC,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,oDAAoD;IACpD,GAAG,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,GAAG,SAAS,GAAG,IAAI,CAAA;IAClD,yCAAyC;IACzC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,oDAAoD;IACpD,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,GAAG,IAAI,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC"}
+{"version":3,"file":"layoutBox.types.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/container/layoutBox/layoutBox.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAEnE;;GAEG;AACH,oBAAY,eAAe;IACzB,GAAG,QAAQ;IACX,MAAM,WAAW;CAClB;AAED;;GAEG;AAEH,MAAM,MAAM,cAAc,GAAG,iBAAiB,GAAG;IAC/C,2CAA2C;IAC3C,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACpB,4EAA4E;IAC5E,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,CAAA;IAChC,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC1B,qCAAqC;IACrC,SAAS,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAA;IACvC,+CAA+C;IAC/C,SAAS,CAAC,EAAE,eAAe,GAAG,MAAM,CAAA;IACpC,+BAA+B;IAC/B,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC5B,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,oCAAoC;IACpC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,2BAA2B;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,4BAA4B;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,sEAAsE;IACtE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kCAAkC;IAClC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,iCAAiC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,+BAA+B;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI,CAAA;IACtC,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,oDAAoD;IACpD,GAAG,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,GAAG,SAAS,GAAG,IAAI,CAAA;IAClD,yCAAyC;IACzC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,oDAAoD;IACpD,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,iDAAiD;IACjD,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,mCAAmC;IACnC,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,oCAAoC;IACpC,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,4DAA4D;IAC5D,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,GAAG,IAAI,CAAC,aAAa,EAAE,WAAW,GAAG,MAAM,CAAC,CAAC"}

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

@@ -1,2 +1,2 @@
-import{objectWithoutProperties as t,objectSpread2 as e,extends as o}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as s,forwardRef as a,useMemo as l}from"react";import{useParseProps as r}from"../../../../hooks/useParseProps.js";import{classNames as i}from"../../../../utils/helpers/ui.js";import n from"./layoutBox.module.scss.js";import{LayoutDirection as d}from"./layoutBox.types.js";const c=["id","style","children","tabIndex","className","onClick","column"],m={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},u=t=>t&&m[t]||t,f=a(((s,a)=>{let{id:m,style:f,children:p,tabIndex:x,className:y="",onClick:j,column:b}=s,I=t(s,c);const{dataProps:N,restProps:P}=r(I),h=l((()=>j?{onClick:j,onKeyDown:j,role:"button",tabIndex:-1}:{}),[j]),B=l((()=>void 0!==b&&!0===b?d.COLUMN:null),[b]),C=l((()=>e(e(e(e(e({},P),P.align?{alignItems:u(P.align)}:{}),P.justify?{justifyContent:u(P.justify)}:{}),P.direction||B?{flexDirection:P.direction||B}:{}),f)),[B,P,f]);return React.createElement("div",o({},m?{id:"".concat(m)}:{},{ref:a,tabIndex:x,className:i(n["layout-box"],y),style:C},N,{"data-testid":N.dataTestId||N["data-testid"]||m},h),p)}));f.displayName="LayoutBoxRefForwarded";const p=s(f);p.displayName="LayoutBox";export{p as LayoutBox};
+import{objectWithoutProperties as e,objectSpread2 as t,extends as o}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as i,forwardRef as l,useMemo as a}from"react";import{useParseProps as r}from"../../../../hooks/useParseProps.js";import{classNames as s}from"../../../../utils/helpers/ui.js";import d from"./layoutBox.module.scss.js";import{LayoutDirection as n}from"./layoutBox.types.js";const c=["id","style","children","tabIndex","className","onClick","column","asGrid","wFull","hFull","centered","flex","width","height","debug","background"],u={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},m=e=>e&&u[e]||e,x=l(((i,l)=>{let{id:u,style:x,children:f,tabIndex:p,className:y="",onClick:h,column:b,asGrid:g=!1,wFull:j=!1,hFull:w=!1,centered:k=!1,flex:v,width:I,height:N,debug:B=!1,background:C}=i,P=e(i,c);const{dataProps:F,restProps:L}=r(P),D=a((()=>h?{onClick:h,onKeyDown:h,role:"button",tabIndex:-1}:{}),[h]),G=a((()=>void 0!==b&&!0===b?n.COLUMN:null),[b]),R=a((()=>{const e=t({},L);return(L.direction||G)&&(e.flexDirection=L.direction||G),k?(e.alignItems="center",e.justifyContent="center"):(L.align&&(e.alignItems=m(L.align)),L.justify&&(e.justifyContent=m(L.justify))),e.display=g?"grid":"flex",j?e.width="100%":void 0!==I&&(e.width="number"==typeof I?"".concat(I,"px"):I),w?e.height="100%":void 0!==N&&(e.height="number"==typeof N?"".concat(N,"px"):N),void 0!==v&&(e.flex=!0===v?1:v),void 0!==C&&(e.background=C),B&&(e.outline="1px solid red"),t(t({},e),x)}),[g,C,k,B,v,w,N,G,L,x,j,I]);return React.createElement("div",o({},u?{id:"".concat(u)}:{},{ref:l,tabIndex:p,className:s(d["layout-box"],y),style:R},F,{"data-testid":F.dataTestId||F["data-testid"]||u},D),f)}));x.displayName="LayoutBoxRefForwarded";const f=i(x),p=i(x);f.displayName="LayoutBox",p.displayName="BoxLayout";export{p as BoxLayout,f 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, style, children, tabIndex, className = '', onClick, column, ...props\n}: LayoutBoxProps, ref: LegacyRef<HTMLDivElement> | undefined | null) => {\n  const { dataProps, restProps } = useParseProps(props)\n\n  /**\n   * Memoized onClick event properties.\n   * @type {{ onClick?: () => void; onKeyDown?: () => void; role?: string; tabIndex?: number }}\n   */\n  const onClickProps = useMemo(() => (onClick ? ({\n    onClick,\n    onKeyDown: onClick,\n    role: 'button',\n    tabIndex: -1,\n  }) : {}), [onClick])\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 and additional styles.\n   * @type {CSSProperties}\n   */\n  const styles = useMemo(() => (\n    {\n      ...restProps,\n      ...(restProps.align ? { alignItems: resolveFlexProps(restProps.align as string) } : {}),\n      ...(restProps.justify ? { justifyContent: resolveFlexProps(restProps.justify as string) } : {}),\n      ...(restProps.direction || resolvedColumn ? { flexDirection: restProps.direction || resolvedColumn } : {}),\n      ...style,\n    }\n  ), [resolvedColumn, restProps, style])\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      {...onClickProps}\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\nLayoutBox.displayName = 'LayoutBox'\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","LayoutBoxRefForwarded","forwardRef","_ref","ref","id","style","children","tabIndex","className","onClick","column","props","_objectWithoutProperties","_excluded","dataProps","restProps","useParseProps","onClickProps","useMemo","onKeyDown","role","resolvedColumn","undefined","LayoutDirection","COLUMN","styles","_objectSpread","align","alignItems","justify","justifyContent","direction","flexDirection","React","createElement","_extends","concat","classNames","classes","dataTestId","displayName","LayoutBox","memo"],"mappings":"yeAYMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAQRC,EAAoBC,GAAwCA,GAASJ,EAAaI,IAAmBA,EAQrGC,EAAwBC,GAAW,CAAAC,EAEtBC,KAAsD,IAF/BC,GACxCA,EAAEC,MAAEA,EAAKC,SAAEA,EAAQC,SAAEA,EAAQC,UAAEA,EAAY,GAAEC,QAAEA,EAAOC,OAAEA,GACzCR,EADoDS,EAAKC,EAAAV,EAAAW,GAExE,MAAMC,UAAEA,EAASC,UAAEA,GAAcC,EAAcL,GAMzCM,EAAeC,GAAQ,IAAOT,EAAW,CAC7CA,UACAU,UAAWV,EACXW,KAAM,SACNb,UAAW,GACR,CAAG,GAAE,CAACE,IAMLY,EAAiBH,GAAQ,SAClBI,IAAXZ,IAAmC,IAAXA,EACtBa,EAAgBC,OAChB,MAAO,CAACd,IAMNe,EAASP,GAAQ,IAAAQ,EAAAA,EAAAA,EAAAA,EAAAA,EAEhBX,CAAAA,EAAAA,GACCA,EAAUY,MAAQ,CAAEC,WAAY9B,EAAiBiB,EAAUY,QAAqB,CAAE,GAClFZ,EAAUc,QAAU,CAAEC,eAAgBhC,EAAiBiB,EAAUc,UAAuB,IACxFd,EAAUgB,WAAaV,EAAiB,CAAEW,cAAejB,EAAUgB,WAAaV,GAAmB,CAAA,GACpGhB,IAEJ,CAACgB,EAAgBN,EAAWV,IAE/B,OACE4B,MAAAC,oBAAAC,EAAA,CAAA,EACO/B,EAAK,CAAEA,GAAE,GAAAgC,OAAKhC,IAAS,GAAE,CAC9BD,IAAKA,EACLI,SAAUA,EACVC,UAAW6B,EACTC,EAAQ,cACR9B,GAEFH,MAAOoB,GACHX,EAAS,CACb,cAAaA,EAAUyB,YAAczB,EAAU,gBAAkBV,GAC7Da,GAEHX,EACG,IAIVN,EAAsBwC,YAAc,8BAMvBC,EAAgCC,EAAqB1C,GAElEyC,EAAUD,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  onClick,\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 onClick event properties.\n   * @type {{ onClick?: () => void; onKeyDown?: () => void; role?: string; tabIndex?: number }}\n   */\n  const onClickProps = useMemo(() => (onClick ? ({\n    onClick,\n    onKeyDown: onClick,\n    role: 'button',\n    tabIndex: -1,\n  }) : {}), [onClick])\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      {...onClickProps}\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","onClick","column","asGrid","wFull","hFull","centered","flex","width","height","debug","background","props","_objectWithoutProperties","_excluded","dataProps","restProps","useParseProps","onClickProps","useMemo","onKeyDown","role","resolvedColumn","undefined","LayoutDirection","COLUMN","styles","baseStyles","_objectSpread","direction","flexDirection","alignItems","justifyContent","align","justify","display","concat","outline","React","createElement","_extends","classNames","classes","dataTestId","displayName","LayoutBox","memo","BoxLayout"],"mappings":"0jBAYMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAQRC,EAAoBC,GAAwCA,GAASJ,EAAaI,IAAmBA,EAQrGC,EAAwBC,GAAW,CAAAC,EAkBtBC,KAAsD,IAlB/BC,GACxCA,EAAEC,MACFA,EAAKC,SACLA,EAAQC,SACRA,EAAQC,UACRA,EAAY,GAAEC,QACdA,EAAOC,OACPA,EAAMC,OACNA,GAAS,EAAKC,MACdA,GAAQ,EAAKC,MACbA,GAAQ,EAAKC,SACbA,GAAW,EAAKC,KAChBA,EAAIC,MACJA,EAAKC,OACLA,EAAMC,MACNA,GAAQ,EAAKC,WACbA,GAEejB,EADZkB,EAAKC,EAAAnB,EAAAoB,GAER,MAAMC,UAAEA,EAASC,UAAEA,GAAcC,EAAcL,GAMzCM,EAAeC,GAAQ,IAAOlB,EAAW,CAC7CA,UACAmB,UAAWnB,EACXoB,KAAM,SACNtB,UAAW,GACR,CAAG,GAAE,CAACE,IAMLqB,EAAiBH,GAAQ,SAClBI,IAAXrB,IAAmC,IAAXA,EACtBsB,EAAgBC,OAChB,MAAO,CAACvB,IAMNwB,EAASP,GAAQ,KACrB,MAAMQ,EAAyBC,EAAA,CAAA,EACzBZ,GA+DN,OA3DIA,EAAUa,WAAaP,KACzBK,EAAWG,cAAiBd,EAAUa,WAAaP,GAIjDhB,GACFqB,EAAWI,WAAa,SACxBJ,EAAWK,eAAiB,WAExBhB,EAAUiB,QACZN,EAAWI,WAAazC,EAAiB0B,EAAUiB,QAEjDjB,EAAUkB,UACZP,EAAWK,eAAiB1C,EAAiB0B,EAAUkB,WAMzDP,EAAWQ,QADThC,EACmB,OAEA,OAInBC,EACFuB,EAAWnB,MAAQ,YACAe,IAAVf,IACTmB,EAAWnB,MAAyB,iBAAVA,EAAkB,GAAA4B,OAAM5B,EAAK,MAAOA,GAG5DH,EACFsB,EAAWlB,OAAS,YACAc,IAAXd,IACTkB,EAAWlB,OAA2B,iBAAXA,EAAmB,GAAA2B,OAAM3B,EAAM,MAAOA,QAItDc,IAAThB,IAEAoB,EAAWpB,MADA,IAATA,EACgB,EAEAA,QAOHgB,IAAfZ,IACFgB,EAAWhB,WAAaA,GAItBD,IACFiB,EAAWU,QAAU,iBAIvBT,EAAAA,EACKD,CAAAA,EAAAA,GACA9B,EAAK,GAET,CACDM,EACAQ,EACAL,EACAI,EACAH,EACAF,EACAI,EACAa,EACAN,EACAnB,EACAO,EACAI,IAGF,OACE8B,MAAAC,oBAAAC,EAAA,CAAA,EACO5C,EAAK,CAAEA,GAAE,GAAAwC,OAAKxC,IAAS,GAAE,CAC9BD,IAAKA,EACLI,SAAUA,EACVC,UAAWyC,EACTC,EAAQ,cACR1C,GAEFH,MAAO6B,GACHX,EAAS,CACb,cAAaA,EAAU4B,YAAc5B,EAAU,gBAAkBnB,GAC7DsB,GAEHpB,EACG,IAIVN,EAAsBoD,YAAc,8BAMvBC,EAAgCC,EAAqBtD,GAErDuD,EAAgCD,EAAqBtD,GAElEqD,EAAUD,YAAc,YAExBG,EAAUH,YAAc"}

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

@@ -1 +1 @@
-{"version":3,"file":"layoutBox.types.js","sources":["../../../../../../../../../src/core/ui/components/container/layoutBox/layoutBox.types.ts"],"sourcesContent":["import { CSSProperties, LegacyRef, PropsWithChildren } from 'react'\n\n/**\n * Enum representing the possible layout directions.\n */\nexport enum LayoutDirection {\n  ROW = 'row',\n  COLUMN = 'column',\n}\n\n/**\n * Props for the LayoutBox component.\n */\nexport type LayoutBoxProps = PropsWithChildren & {\n  /** Unique identifier for the component. */\n  id?: string | number\n  /** CSS flex property. */\n  flex?: string\n  /** CSS flexGrow property. */\n  flexGrow?: string | number\n  /** Text alignment within the box. */\n  alignText?: 'center' | 'right' | 'left'\n  /** Direction of the layout (row or column). */\n  direction?: LayoutDirection | string\n  /** CSS flexShrink property. */\n  flexShrink?: string | number\n  /** CSS flexBasis property. */\n  flexBasis?: string\n  /** CSS flexWrap property. */\n  flexWrap?: string\n  /** CSS justify-content property. */\n  justify?: string\n  /** CSS align-items property. */\n  align?: string\n  /** CSS align-self property. */\n  alignSelf?: string\n  /** CSS margin property. */\n  margin?: string\n  /** CSS padding property. */\n  padding?: string\n  /** CSS width property. */\n  width?: string\n  /** CSS height property. */\n  height?: string\n  /** CSS maxWidth property. */\n  maxWidth?: string\n  /** CSS maxHeight property. */\n  maxHeight?: string\n  /** CSS minWidth property. */\n  minWidth?: string\n  /** CSS minHeight property. */\n  minHeight?: string\n  /** Gap between child elements. */\n  gap?: string\n  /** CSS borderRadius property. */\n  borderRadius?: string\n  /** Additional inline styles for the component. */\n  style?: Record<string, unknown> | null\n  /** Additional class name(s) for the component. */\n  className?: string\n  /** Tab index for keyboard navigation. */\n  tabIndex?: number\n  /** Ref for accessing the underlying DOM element. */\n  ref?: LegacyRef<HTMLDivElement> | undefined | null\n  /** Callback function for click event. */\n  onClick?: () => void\n  /** If true, sets the layout direction to column. */\n  column?: boolean\n} & Omit<CSSProperties, 'direction'>;\n"],"names":["LayoutDirection"],"mappings":"AAKYA,IAAAA,WAAAA,GAAe,OAAfA,EAAe,IAAA,MAAfA,EAAe,OAAA,SAAfA,CAAe,EAAA,CAAA"}
+{"version":3,"file":"layoutBox.types.js","sources":["../../../../../../../../../src/core/ui/components/container/layoutBox/layoutBox.types.ts"],"sourcesContent":["import { CSSProperties, LegacyRef, PropsWithChildren } from 'react'\n\n/**\n * Enum representing the possible layout directions.\n */\nexport enum LayoutDirection {\n  ROW = 'row',\n  COLUMN = 'column',\n}\n\n/**\n * Props for the LayoutBox component.\n */\n// TODO replace with & React.DIVHtmlAttributes<HTMLDivElement>\nexport type LayoutBoxProps = PropsWithChildren & {\n  /** Unique identifier for the component. */\n  id?: string | number\n  /** CSS flex property. Can be string, boolean (true = flex-1), or number. */\n  flex?: string | boolean | number\n  /** CSS flexGrow property. */\n  flexGrow?: string | number\n  /** Text alignment within the box. */\n  alignText?: 'center' | 'right' | 'left'\n  /** Direction of the layout (row or column). */\n  direction?: LayoutDirection | string\n  /** CSS flexShrink property. */\n  flexShrink?: string | number\n  /** CSS flexBasis property. */\n  flexBasis?: string\n  /** CSS flexWrap property. */\n  flexWrap?: string\n  /** CSS justify-content property. */\n  justify?: string\n  /** CSS align-items property. */\n  align?: string\n  /** CSS align-self property. */\n  alignSelf?: string\n  /** CSS margin property. */\n  margin?: string\n  /** CSS padding property. */\n  padding?: string\n  /** CSS width property. Can be string or number (converted to px). */\n  width?: string | number\n  /** CSS height property. Can be string or number (converted to px). */\n  height?: string | number\n  /** CSS maxWidth property. */\n  maxWidth?: string\n  /** CSS maxHeight property. */\n  maxHeight?: string\n  /** CSS minWidth property. */\n  minWidth?: string\n  /** CSS minHeight property. */\n  minHeight?: string\n  /** Gap between child elements. */\n  gap?: string\n  /** CSS borderRadius property. */\n  borderRadius?: string\n  /** CSS background property. */\n  background?: string\n  /** Additional inline styles for the component. */\n  style?: Record<string, unknown> | null\n  /** Additional class name(s) for the component. */\n  className?: string\n  /** Tab index for keyboard navigation. */\n  tabIndex?: number\n  /** Ref for accessing the underlying DOM element. */\n  ref?: LegacyRef<HTMLDivElement> | undefined | null\n  /** Callback function for click event. */\n  onClick?: () => void\n  /** If true, sets the layout direction to column. */\n  column?: boolean\n  /** If true, uses CSS Grid instead of Flexbox. */\n  asGrid?: boolean\n  /** If true, sets width to 100%. */\n  wFull?: boolean\n  /** If true, sets height to 100%. */\n  hFull?: boolean\n  /** If true, centers content in both axes. */\n  centered?: boolean\n  /** If true, adds an outline to help debug layout issues. */\n  debug?: boolean\n} & Omit<CSSProperties, 'direction' | 'flex'>;\n"],"names":["LayoutDirection"],"mappings":"AAKYA,IAAAA,WAAAA,GAAe,OAAfA,EAAe,IAAA,MAAfA,EAAe,OAAA,SAAfA,CAAe,EAAA,CAAA"}

package/dist/ui/esm/src/core/ui/index.js

@@ -1,2 +1,2 @@
-export{calculateColors,calculatePercColor,convertHex,convertRGB,defaultFontSize,pxToRem,resolveStyleValue,setDefaultFontSize,toHex}from"./utils/style.js";export{LayoutBox}from"./components/container/layoutBox/LayoutBox.js";export{LayoutDirection}from"./components/container/layoutBox/layoutBox.types.js";export{LazyComponent,PendingBoundary,createLazyModule,createLazyModuleWithStore,wrapPromise}from"./components/container/lazyComponent/LazyComponent.js";export{CollapsibleContainer}from"./components/container/CollapsibleContainer.js";export{ResizableContainer}from"./components/container/ResizableContainer.js";export{DefaultErrorComponent,ErrorBoundary}from"./components/error/ErrorBoundary.js";export{Field,Select,setIconColor,setIconComponent}from"./components/field/Field.js";export{DividerHorizontal,DividerLine,DividerVertical}from"./components/dividers/DividerLine.js";export{IconBase}from"./components/icon/IconBase.js";export{Icon}from"./components/icon/Icon.js";export{ESIcon,ESIconBase}from"./components/icon/IconWC.js";export{Button,IconButton,keys}from"./components/atoms/button/Button.js";export{Text}from"./components/atoms/text/Text.js";export{Headline,HeadlineSecondary,HeadlineTertiary}from"./components/atoms/text/Headline.js";export{Paragraph,ParagraphBold,ParagraphBoldSmall,ParagraphSmall}from"./components/atoms/text/Paragraph.js";export{Link}from"./components/atoms/text/Link.js";export{AnchorLink}from"./components/atoms/text/anchor-link/AnchorLink.js";export{TextAndContent,TextAndIcons}from"./components/atoms/textAndContent/TextAndContent.js";export{Tag}from"./components/atoms/tag/Tag.js";export{TagVariant}from"./components/atoms/tag/tag.types.js";export{Toggle}from"./components/atoms/toggle/Toggle.js";export{FlowLayout}from"./components/molecules/layouts/FlowLayout.js";export{Popover}from"./components/molecules/popover/PopoverLite.js";export{Tooltip}from"./components/molecules/popover/Tooltip.js";export{PopoverPlacement}from"./components/molecules/popover/popover.types.js";export{Popup}from"./components/molecules/popup/Popup.js";export{PopupAnimateVariant}from"./components/molecules/popup/popup.types.js";
+export{calculateColors,calculatePercColor,convertHex,convertRGB,defaultFontSize,pxToRem,resolveStyleValue,setDefaultFontSize,toHex}from"./utils/style.js";export{BoxLayout,LayoutBox}from"./components/container/layoutBox/LayoutBox.js";export{LayoutDirection}from"./components/container/layoutBox/layoutBox.types.js";export{LazyComponent,PendingBoundary,createLazyModule,createLazyModuleWithStore,wrapPromise}from"./components/container/lazyComponent/LazyComponent.js";export{CollapsibleContainer}from"./components/container/CollapsibleContainer.js";export{ResizableContainer}from"./components/container/ResizableContainer.js";export{DefaultErrorComponent,ErrorBoundary}from"./components/error/ErrorBoundary.js";export{Field,Select,setIconColor,setIconComponent}from"./components/field/Field.js";export{DividerHorizontal,DividerLine,DividerVertical}from"./components/dividers/DividerLine.js";export{IconBase}from"./components/icon/IconBase.js";export{Icon}from"./components/icon/Icon.js";export{ESIcon,ESIconBase}from"./components/icon/IconWC.js";export{Button,IconButton,keys}from"./components/atoms/button/Button.js";export{Text}from"./components/atoms/text/Text.js";export{Headline,HeadlineSecondary,HeadlineTertiary}from"./components/atoms/text/Headline.js";export{Paragraph,ParagraphBold,ParagraphBoldSmall,ParagraphSmall}from"./components/atoms/text/Paragraph.js";export{Link}from"./components/atoms/text/Link.js";export{AnchorLink}from"./components/atoms/text/anchor-link/AnchorLink.js";export{TextAndContent,TextAndIcons}from"./components/atoms/textAndContent/TextAndContent.js";export{Tag}from"./components/atoms/tag/Tag.js";export{TagVariant}from"./components/atoms/tag/tag.types.js";export{Toggle}from"./components/atoms/toggle/Toggle.js";export{FlowLayout}from"./components/molecules/layouts/FlowLayout.js";export{Popover}from"./components/molecules/popover/PopoverLite.js";export{Tooltip}from"./components/molecules/popover/Tooltip.js";export{PopoverPlacement}from"./components/molecules/popover/popover.types.js";export{Popup}from"./components/molecules/popup/Popup.js";export{PopupAnimateVariant}from"./components/molecules/popup/popup.types.js";
 //# sourceMappingURL=index.js.map

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

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

package/dist/ui/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, style, children, tabIndex, className = '', onClick, column, ...props\n}: LayoutBoxProps, ref: LegacyRef<HTMLDivElement> | undefined | null) => {\n  const { dataProps, restProps } = useParseProps(props)\n\n  /**\n   * Memoized onClick event properties.\n   * @type {{ onClick?: () => void; onKeyDown?: () => void; role?: string; tabIndex?: number }}\n   */\n  const onClickProps = useMemo(() => (onClick ? ({\n    onClick,\n    onKeyDown: onClick,\n    role: 'button',\n    tabIndex: -1,\n  }) : {}), [onClick])\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 and additional styles.\n   * @type {CSSProperties}\n   */\n  const styles = useMemo(() => (\n    {\n      ...restProps,\n      ...(restProps.align ? { alignItems: resolveFlexProps(restProps.align as string) } : {}),\n      ...(restProps.justify ? { justifyContent: resolveFlexProps(restProps.justify as string) } : {}),\n      ...(restProps.direction || resolvedColumn ? { flexDirection: restProps.direction || resolvedColumn } : {}),\n      ...style,\n    }\n  ), [resolvedColumn, restProps, style])\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      {...onClickProps}\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\nLayoutBox.displayName = 'LayoutBox'\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","LayoutBoxRefForwarded","forwardRef","_ref","ref","id","style","children","tabIndex","className","onClick","column","props","_objectWithoutProperties","_excluded","dataProps","restProps","useParseProps","onClickProps","useMemo","onKeyDown","role","resolvedColumn","undefined","LayoutDirection","COLUMN","styles","_objectSpread","objectSpread2","align","alignItems","justify","justifyContent","direction","flexDirection","React","createElement","_extends","concat","classNames","classes","dataTestId","displayName","LayoutBox","memo"],"mappings":"4VAYMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAQRC,EAAoBC,GAAwCA,GAASJ,EAAaI,IAAmBA,EAQrGC,EAAwBC,EAAUA,YAAC,CAAAC,EAEtBC,KAAsD,IAF/BC,GACxCA,EAAEC,MAAEA,EAAKC,SAAEA,EAAQC,SAAEA,EAAQC,UAAEA,EAAY,GAAEC,QAAEA,EAAOC,OAAEA,GACzCR,EADoDS,EAAKC,EAAAA,wBAAAV,EAAAW,GAExE,MAAMC,UAAEA,EAASC,UAAEA,GAAcC,EAAAA,cAAcL,GAMzCM,EAAeC,WAAQ,IAAOT,EAAW,CAC7CA,UACAU,UAAWV,EACXW,KAAM,SACNb,UAAW,GACR,CAAG,GAAE,CAACE,IAMLY,EAAiBH,EAAAA,SAAQ,SAClBI,IAAXZ,IAAmC,IAAXA,EACtBa,EAAeA,gBAACC,OAChB,MAAO,CAACd,IAMNe,EAASP,EAAOA,SAAC,IAAAQ,EAAAC,cAAAD,EAAAC,cAAAD,EAAAC,cAAAD,gBAAAA,EAAAA,cAEhBX,CAAAA,EAAAA,GACCA,EAAUa,MAAQ,CAAEC,WAAY/B,EAAiBiB,EAAUa,QAAqB,CAAE,GAClFb,EAAUe,QAAU,CAAEC,eAAgBjC,EAAiBiB,EAAUe,UAAuB,IACxFf,EAAUiB,WAAaX,EAAiB,CAAEY,cAAelB,EAAUiB,WAAaX,GAAmB,CAAA,GACpGhB,IAEJ,CAACgB,EAAgBN,EAAWV,IAE/B,OACE6B,MAAAC,oBAAAC,EAAAA,QAAA,CAAA,EACOhC,EAAK,CAAEA,GAAE,GAAAiC,OAAKjC,IAAS,GAAE,CAC9BD,IAAKA,EACLI,SAAUA,EACVC,UAAW8B,EAAAA,WACTC,EAAAA,QAAQ,cACR/B,GAEFH,MAAOoB,GACHX,EAAS,CACb,cAAaA,EAAU0B,YAAc1B,EAAU,gBAAkBV,GAC7Da,GAEHX,EACG,IAIVN,EAAsByC,YAAc,8BAMvBC,EAAgCC,EAAIA,KAAiB3C,GAElE0C,EAAUD,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  onClick,\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 onClick event properties.\n   * @type {{ onClick?: () => void; onKeyDown?: () => void; role?: string; tabIndex?: number }}\n   */\n  const onClickProps = useMemo(() => (onClick ? ({\n    onClick,\n    onKeyDown: onClick,\n    role: 'button',\n    tabIndex: -1,\n  }) : {}), [onClick])\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      {...onClickProps}\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","onClick","column","asGrid","wFull","hFull","centered","flex","width","height","debug","background","props","_objectWithoutProperties","_excluded","dataProps","restProps","useParseProps","onClickProps","useMemo","onKeyDown","role","resolvedColumn","undefined","LayoutDirection","COLUMN","styles","baseStyles","_objectSpread","direction","flexDirection","alignItems","justifyContent","align","justify","display","concat","outline","objectSpread2","React","createElement","_extends","classNames","classes","dataTestId","displayName","LayoutBox","memo","BoxLayout"],"mappings":"6aAYMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAQRC,EAAoBC,GAAwCA,GAASJ,EAAaI,IAAmBA,EAQrGC,EAAwBC,EAAUA,YAAC,CAAAC,EAkBtBC,KAAsD,IAlB/BC,GACxCA,EAAEC,MACFA,EAAKC,SACLA,EAAQC,SACRA,EAAQC,UACRA,EAAY,GAAEC,QACdA,EAAOC,OACPA,EAAMC,OACNA,GAAS,EAAKC,MACdA,GAAQ,EAAKC,MACbA,GAAQ,EAAKC,SACbA,GAAW,EAAKC,KAChBA,EAAIC,MACJA,EAAKC,OACLA,EAAMC,MACNA,GAAQ,EAAKC,WACbA,GAEejB,EADZkB,EAAKC,EAAAA,wBAAAnB,EAAAoB,GAER,MAAMC,UAAEA,EAASC,UAAEA,GAAcC,EAAAA,cAAcL,GAMzCM,EAAeC,WAAQ,IAAOlB,EAAW,CAC7CA,UACAmB,UAAWnB,EACXoB,KAAM,SACNtB,UAAW,GACR,CAAG,GAAE,CAACE,IAMLqB,EAAiBH,EAAAA,SAAQ,SAClBI,IAAXrB,IAAmC,IAAXA,EACtBsB,EAAeA,gBAACC,OAChB,MAAO,CAACvB,IAMNwB,EAASP,EAAAA,SAAQ,KACrB,MAAMQ,EAAyBC,EAAAA,cAAA,CAAA,EACzBZ,GA+DN,OA3DIA,EAAUa,WAAaP,KACzBK,EAAWG,cAAiBd,EAAUa,WAAaP,GAIjDhB,GACFqB,EAAWI,WAAa,SACxBJ,EAAWK,eAAiB,WAExBhB,EAAUiB,QACZN,EAAWI,WAAazC,EAAiB0B,EAAUiB,QAEjDjB,EAAUkB,UACZP,EAAWK,eAAiB1C,EAAiB0B,EAAUkB,WAMzDP,EAAWQ,QADThC,EACmB,OAEA,OAInBC,EACFuB,EAAWnB,MAAQ,YACAe,IAAVf,IACTmB,EAAWnB,MAAyB,iBAAVA,EAAkB,GAAA4B,OAAM5B,EAAK,MAAOA,GAG5DH,EACFsB,EAAWlB,OAAS,YACAc,IAAXd,IACTkB,EAAWlB,OAA2B,iBAAXA,EAAmB,GAAA2B,OAAM3B,EAAM,MAAOA,QAItDc,IAAThB,IAEAoB,EAAWpB,MADA,IAATA,EACgB,EAEAA,QAOHgB,IAAfZ,IACFgB,EAAWhB,WAAaA,GAItBD,IACFiB,EAAWU,QAAU,iBAIvBT,EAAAU,cAAAV,EAAAU,cACKX,CAAAA,EAAAA,GACA9B,EAAK,GAET,CACDM,EACAQ,EACAL,EACAI,EACAH,EACAF,EACAI,EACAa,EACAN,EACAnB,EACAO,EACAI,IAGF,OACE+B,MAAAC,oBAAAC,EAAAA,QAAA,CAAA,EACO7C,EAAK,CAAEA,GAAE,GAAAwC,OAAKxC,IAAS,GAAE,CAC9BD,IAAKA,EACLI,SAAUA,EACVC,UAAW0C,EAAAA,WACTC,EAAAA,QAAQ,cACR3C,GAEFH,MAAO6B,GACHX,EAAS,CACb,cAAaA,EAAU6B,YAAc7B,EAAU,gBAAkBnB,GAC7DsB,GAEHpB,EACG,IAIVN,EAAsBqD,YAAc,8BAMvBC,EAAgCC,EAAIA,KAAiBvD,GAErDwD,EAAgCD,EAAIA,KAAiBvD,GAElEsD,EAAUD,YAAc,YAExBG,EAAUH,YAAc"}

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

@@ -1 +1 @@
-{"version":3,"file":"layoutBox.types.js","sources":["../../../../../../../../src/core/ui/components/container/layoutBox/layoutBox.types.ts"],"sourcesContent":["import { CSSProperties, LegacyRef, PropsWithChildren } from 'react'\n\n/**\n * Enum representing the possible layout directions.\n */\nexport enum LayoutDirection {\n  ROW = 'row',\n  COLUMN = 'column',\n}\n\n/**\n * Props for the LayoutBox component.\n */\nexport type LayoutBoxProps = PropsWithChildren & {\n  /** Unique identifier for the component. */\n  id?: string | number\n  /** CSS flex property. */\n  flex?: string\n  /** CSS flexGrow property. */\n  flexGrow?: string | number\n  /** Text alignment within the box. */\n  alignText?: 'center' | 'right' | 'left'\n  /** Direction of the layout (row or column). */\n  direction?: LayoutDirection | string\n  /** CSS flexShrink property. */\n  flexShrink?: string | number\n  /** CSS flexBasis property. */\n  flexBasis?: string\n  /** CSS flexWrap property. */\n  flexWrap?: string\n  /** CSS justify-content property. */\n  justify?: string\n  /** CSS align-items property. */\n  align?: string\n  /** CSS align-self property. */\n  alignSelf?: string\n  /** CSS margin property. */\n  margin?: string\n  /** CSS padding property. */\n  padding?: string\n  /** CSS width property. */\n  width?: string\n  /** CSS height property. */\n  height?: string\n  /** CSS maxWidth property. */\n  maxWidth?: string\n  /** CSS maxHeight property. */\n  maxHeight?: string\n  /** CSS minWidth property. */\n  minWidth?: string\n  /** CSS minHeight property. */\n  minHeight?: string\n  /** Gap between child elements. */\n  gap?: string\n  /** CSS borderRadius property. */\n  borderRadius?: string\n  /** Additional inline styles for the component. */\n  style?: Record<string, unknown> | null\n  /** Additional class name(s) for the component. */\n  className?: string\n  /** Tab index for keyboard navigation. */\n  tabIndex?: number\n  /** Ref for accessing the underlying DOM element. */\n  ref?: LegacyRef<HTMLDivElement> | undefined | null\n  /** Callback function for click event. */\n  onClick?: () => void\n  /** If true, sets the layout direction to column. */\n  column?: boolean\n} & Omit<CSSProperties, 'direction'>;\n"],"names":["LayoutDirection"],"mappings":"aAKYA,IAAAA,WAAAA,GAAe,OAAfA,EAAe,IAAA,MAAfA,EAAe,OAAA,SAAfA,CAAe,EAAA,CAAA"}
+{"version":3,"file":"layoutBox.types.js","sources":["../../../../../../../../src/core/ui/components/container/layoutBox/layoutBox.types.ts"],"sourcesContent":["import { CSSProperties, LegacyRef, PropsWithChildren } from 'react'\n\n/**\n * Enum representing the possible layout directions.\n */\nexport enum LayoutDirection {\n  ROW = 'row',\n  COLUMN = 'column',\n}\n\n/**\n * Props for the LayoutBox component.\n */\n// TODO replace with & React.DIVHtmlAttributes<HTMLDivElement>\nexport type LayoutBoxProps = PropsWithChildren & {\n  /** Unique identifier for the component. */\n  id?: string | number\n  /** CSS flex property. Can be string, boolean (true = flex-1), or number. */\n  flex?: string | boolean | number\n  /** CSS flexGrow property. */\n  flexGrow?: string | number\n  /** Text alignment within the box. */\n  alignText?: 'center' | 'right' | 'left'\n  /** Direction of the layout (row or column). */\n  direction?: LayoutDirection | string\n  /** CSS flexShrink property. */\n  flexShrink?: string | number\n  /** CSS flexBasis property. */\n  flexBasis?: string\n  /** CSS flexWrap property. */\n  flexWrap?: string\n  /** CSS justify-content property. */\n  justify?: string\n  /** CSS align-items property. */\n  align?: string\n  /** CSS align-self property. */\n  alignSelf?: string\n  /** CSS margin property. */\n  margin?: string\n  /** CSS padding property. */\n  padding?: string\n  /** CSS width property. Can be string or number (converted to px). */\n  width?: string | number\n  /** CSS height property. Can be string or number (converted to px). */\n  height?: string | number\n  /** CSS maxWidth property. */\n  maxWidth?: string\n  /** CSS maxHeight property. */\n  maxHeight?: string\n  /** CSS minWidth property. */\n  minWidth?: string\n  /** CSS minHeight property. */\n  minHeight?: string\n  /** Gap between child elements. */\n  gap?: string\n  /** CSS borderRadius property. */\n  borderRadius?: string\n  /** CSS background property. */\n  background?: string\n  /** Additional inline styles for the component. */\n  style?: Record<string, unknown> | null\n  /** Additional class name(s) for the component. */\n  className?: string\n  /** Tab index for keyboard navigation. */\n  tabIndex?: number\n  /** Ref for accessing the underlying DOM element. */\n  ref?: LegacyRef<HTMLDivElement> | undefined | null\n  /** Callback function for click event. */\n  onClick?: () => void\n  /** If true, sets the layout direction to column. */\n  column?: boolean\n  /** If true, uses CSS Grid instead of Flexbox. */\n  asGrid?: boolean\n  /** If true, sets width to 100%. */\n  wFull?: boolean\n  /** If true, sets height to 100%. */\n  hFull?: boolean\n  /** If true, centers content in both axes. */\n  centered?: boolean\n  /** If true, adds an outline to help debug layout issues. */\n  debug?: boolean\n} & Omit<CSSProperties, 'direction' | 'flex'>;\n"],"names":["LayoutDirection"],"mappings":"aAKYA,IAAAA,WAAAA,GAAe,OAAfA,EAAe,IAAA,MAAfA,EAAe,OAAA,SAAfA,CAAe,EAAA,CAAA"}

package/dist/ui/src/core/ui/index.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("./utils/style.js"),o=require("./components/container/layoutBox/LayoutBox.js"),t=require("./components/container/layoutBox/layoutBox.types.js"),r=require("./components/container/lazyComponent/LazyComponent.js"),n=require("./components/container/CollapsibleContainer.js"),s=require("./components/container/ResizableContainer.js"),a=require("./components/error/ErrorBoundary.js"),p=require("./components/field/Field.js"),i=require("./components/dividers/DividerLine.js"),l=require("./components/icon/IconBase.js"),c=require("./components/icon/Icon.js"),u=require("./components/icon/IconWC.js"),x=require("./components/atoms/button/Button.js"),m=require("./components/atoms/text/Text.js"),d=require("./components/atoms/text/Headline.js"),y=require("./components/atoms/text/Paragraph.js"),j=require("./components/atoms/text/Link.js"),g=require("./components/atoms/text/anchor-link/AnchorLink.js"),q=require("./components/atoms/textAndContent/TextAndContent.js"),C=require("./components/atoms/tag/Tag.js"),P=require("./components/atoms/tag/tag.types.js"),B=require("./components/atoms/toggle/Toggle.js"),L=require("./components/molecules/layouts/FlowLayout.js"),v=require("./components/molecules/popover/PopoverLite.js"),T=require("./components/molecules/popover/Tooltip.js"),S=require("./components/molecules/popover/popover.types.js"),I=require("./components/molecules/popup/Popup.js"),z=require("./components/molecules/popup/popup.types.js");exports.calculateColors=e.calculateColors,exports.calculatePercColor=e.calculatePercColor,exports.convertHex=e.convertHex,exports.convertRGB=e.convertRGB,Object.defineProperty(exports,"defaultFontSize",{enumerable:!0,get:function(){return e.defaultFontSize}}),exports.pxToRem=e.pxToRem,exports.resolveStyleValue=e.resolveStyleValue,exports.setDefaultFontSize=e.setDefaultFontSize,exports.toHex=e.toHex,exports.LayoutBox=o.LayoutBox,exports.LayoutDirection=t.LayoutDirection,exports.LazyComponent=r.LazyComponent,exports.PendingBoundary=r.PendingBoundary,exports.createLazyModule=r.createLazyModule,exports.createLazyModuleWithStore=r.createLazyModuleWithStore,exports.wrapPromise=r.wrapPromise,exports.CollapsibleContainer=n.CollapsibleContainer,exports.ResizableContainer=s.ResizableContainer,exports.DefaultErrorComponent=a.DefaultErrorComponent,exports.ErrorBoundary=a.ErrorBoundary,exports.Field=p.Field,exports.Select=p.Select,exports.setIconColor=p.setIconColor,exports.setIconComponent=p.setIconComponent,exports.DividerHorizontal=i.DividerHorizontal,exports.DividerLine=i.DividerLine,exports.DividerVertical=i.DividerVertical,exports.IconBase=l.IconBase,exports.Icon=c.Icon,exports.ESIcon=u.ESIcon,exports.ESIconBase=u.ESIconBase,exports.Button=x.Button,exports.IconButton=x.IconButton,exports.keys=x.keys,exports.Text=m.Text,exports.Headline=d.Headline,exports.HeadlineSecondary=d.HeadlineSecondary,exports.HeadlineTertiary=d.HeadlineTertiary,exports.Paragraph=y.Paragraph,exports.ParagraphBold=y.ParagraphBold,exports.ParagraphBoldSmall=y.ParagraphBoldSmall,exports.ParagraphSmall=y.ParagraphSmall,exports.Link=j.Link,exports.AnchorLink=g.AnchorLink,exports.TextAndContent=q.TextAndContent,exports.TextAndIcons=q.TextAndIcons,exports.Tag=C.Tag,exports.TagVariant=P.TagVariant,exports.Toggle=B.Toggle,exports.FlowLayout=L.FlowLayout,exports.Popover=v.Popover,exports.Tooltip=T.Tooltip,exports.PopoverPlacement=S.PopoverPlacement,exports.Popup=I.Popup,exports.PopupAnimateVariant=z.PopupAnimateVariant;
+"use strict";var e=require("./utils/style.js"),o=require("./components/container/layoutBox/LayoutBox.js"),t=require("./components/container/layoutBox/layoutBox.types.js"),r=require("./components/container/lazyComponent/LazyComponent.js"),n=require("./components/container/CollapsibleContainer.js"),s=require("./components/container/ResizableContainer.js"),a=require("./components/error/ErrorBoundary.js"),p=require("./components/field/Field.js"),i=require("./components/dividers/DividerLine.js"),l=require("./components/icon/IconBase.js"),c=require("./components/icon/Icon.js"),u=require("./components/icon/IconWC.js"),x=require("./components/atoms/button/Button.js"),m=require("./components/atoms/text/Text.js"),d=require("./components/atoms/text/Headline.js"),y=require("./components/atoms/text/Paragraph.js"),j=require("./components/atoms/text/Link.js"),B=require("./components/atoms/text/anchor-link/AnchorLink.js"),g=require("./components/atoms/textAndContent/TextAndContent.js"),q=require("./components/atoms/tag/Tag.js"),C=require("./components/atoms/tag/tag.types.js"),P=require("./components/atoms/toggle/Toggle.js"),L=require("./components/molecules/layouts/FlowLayout.js"),v=require("./components/molecules/popover/PopoverLite.js"),T=require("./components/molecules/popover/Tooltip.js"),S=require("./components/molecules/popover/popover.types.js"),I=require("./components/molecules/popup/Popup.js"),z=require("./components/molecules/popup/popup.types.js");exports.calculateColors=e.calculateColors,exports.calculatePercColor=e.calculatePercColor,exports.convertHex=e.convertHex,exports.convertRGB=e.convertRGB,Object.defineProperty(exports,"defaultFontSize",{enumerable:!0,get:function(){return e.defaultFontSize}}),exports.pxToRem=e.pxToRem,exports.resolveStyleValue=e.resolveStyleValue,exports.setDefaultFontSize=e.setDefaultFontSize,exports.toHex=e.toHex,exports.BoxLayout=o.BoxLayout,exports.LayoutBox=o.LayoutBox,exports.LayoutDirection=t.LayoutDirection,exports.LazyComponent=r.LazyComponent,exports.PendingBoundary=r.PendingBoundary,exports.createLazyModule=r.createLazyModule,exports.createLazyModuleWithStore=r.createLazyModuleWithStore,exports.wrapPromise=r.wrapPromise,exports.CollapsibleContainer=n.CollapsibleContainer,exports.ResizableContainer=s.ResizableContainer,exports.DefaultErrorComponent=a.DefaultErrorComponent,exports.ErrorBoundary=a.ErrorBoundary,exports.Field=p.Field,exports.Select=p.Select,exports.setIconColor=p.setIconColor,exports.setIconComponent=p.setIconComponent,exports.DividerHorizontal=i.DividerHorizontal,exports.DividerLine=i.DividerLine,exports.DividerVertical=i.DividerVertical,exports.IconBase=l.IconBase,exports.Icon=c.Icon,exports.ESIcon=u.ESIcon,exports.ESIconBase=u.ESIconBase,exports.Button=x.Button,exports.IconButton=x.IconButton,exports.keys=x.keys,exports.Text=m.Text,exports.Headline=d.Headline,exports.HeadlineSecondary=d.HeadlineSecondary,exports.HeadlineTertiary=d.HeadlineTertiary,exports.Paragraph=y.Paragraph,exports.ParagraphBold=y.ParagraphBold,exports.ParagraphBoldSmall=y.ParagraphBoldSmall,exports.ParagraphSmall=y.ParagraphSmall,exports.Link=j.Link,exports.AnchorLink=B.AnchorLink,exports.TextAndContent=g.TextAndContent,exports.TextAndIcons=g.TextAndIcons,exports.Tag=q.Tag,exports.TagVariant=C.TagVariant,exports.Toggle=P.Toggle,exports.FlowLayout=L.FlowLayout,exports.Popover=v.Popover,exports.Tooltip=T.Tooltip,exports.PopoverPlacement=S.PopoverPlacement,exports.Popup=I.Popup,exports.PopupAnimateVariant=z.PopupAnimateVariant;
 //# sourceMappingURL=index.js.map