@mittwald/flow-react-components 0.2.0-alpha.567 → 0.2.0-alpha.569

package/dist/js/components/src/components/AccentBox/AccentBox.mjs

@@ -7,27 +7,28 @@ import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
 import '../../lib/propsContext/propsContext.mjs';
 import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
 
-const AccentBox = flowComponent("AccentBox", (props) => {
-  const { color = "blue", children, elementType = "div", className } = props;
-  const rootClassName = clsx(styles.accentBox, className, styles[color]);
-  const Element = elementType;
-  const contentColor = color === "green" ? "dark" : void 0;
-  const propsContext = {
-    Link: {
-      color: contentColor,
-      ___inherit: true
-    },
-    Text: {
-      color: contentColor,
-      ___inherit: true
-    },
-    Heading: {
-      color: contentColor,
-      ___inherit: true
-    }
-  };
-  return /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children: /* @__PURE__ */ jsx(Element, { className: rootClassName, children }) });
-});
+const AccentBox = flowComponent(
+  "AccentBox",
+  (props) => {
+    const { color = "blue", children, elementType = "div", className } = props;
+    const rootClassName = clsx(styles.accentBox, className, styles[color]);
+    const Element = elementType;
+    const contentColor = color === "green" ? "dark" : void 0;
+    const propsContext = {
+      Link: {
+        color: contentColor
+      },
+      Text: {
+        color: contentColor
+      },
+      Heading: {
+        color: contentColor
+      }
+    };
+    return /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children: /* @__PURE__ */ jsx(Element, { className: rootClassName, children }) });
+  },
+  { type: "layout" }
+);
 
 export { AccentBox, AccentBox as default };
 //# sourceMappingURL=AccentBox.mjs.map

package/dist/js/components/src/components/AccentBox/AccentBox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AccentBox.mjs","sources":["../../../../../../src/components/AccentBox/AccentBox.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport type {\n  PropsWithClassName,\n  PropsWithElementType,\n} from \"@/lib/types/props\";\nimport clsx from \"clsx\";\nimport styles from \"./AccentBox.module.scss\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\n\nexport interface AccentBoxProps\n  extends PropsWithChildren,\n    PropsWithElementType<\"div\" | \"section\" | \"article\">,\n    PropsWithClassName,\n    FlowComponentProps {\n  color?: \"blue\" | \"green\" | \"gradient\" | \"neutral\";\n}\n\n/** @flr-generate all */\nexport const AccentBox = flowComponent(\"AccentBox\", (props) => {\n  const { color = \"blue\", children, elementType = \"div\", className } = props;\n\n  const rootClassName = clsx(styles.accentBox, className, styles[color]);\n\n  const Element = elementType;\n\n  const contentColor = color === \"green\" ? \"dark\" : undefined;\n\n  const propsContext: PropsContext = {\n    Link: {\n      color: contentColor,\n      ___inherit: true,\n    },\n    Text: {\n      color: contentColor,\n      ___inherit: true,\n    },\n    Heading: {\n      color: contentColor,\n      ___inherit: true,\n    },\n  };\n\n  return (\n    <PropsContextProvider props={propsContext}>\n      <Element className={rootClassName}>{children}</Element>\n    </PropsContextProvider>\n  );\n});\n\nexport default AccentBox;\n"],"names":[],"mappings":";;;;;;;AAsBO,MAAM,SAAA,GAAY,aAAA,CAAc,WAAA,EAAa,CAAC,KAAA,KAAU;AAC7D,EAAA,MAAM,EAAE,KAAA,GAAQ,MAAA,EAAQ,UAAU,WAAA,GAAc,KAAA,EAAO,WAAU,GAAI,KAAA;AAErE,EAAA,MAAM,gBAAgB,IAAA,CAAK,MAAA,CAAO,WAAW,SAAA,EAAW,MAAA,CAAO,KAAK,CAAC,CAAA;AAErE,EAAA,MAAM,OAAA,GAAU,WAAA;AAEhB,EAAA,MAAM,YAAA,GAAe,KAAA,KAAU,OAAA,GAAU,MAAA,GAAS,MAAA;AAElD,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,IAAA,EAAM;AAAA,MACJ,KAAA,EAAO,YAAA;AAAA,MACP,UAAA,EAAY;AAAA,KACd;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,KAAA,EAAO,YAAA;AAAA,MACP,UAAA,EAAY;AAAA,KACd;AAAA,IACA,OAAA,EAAS;AAAA,MACP,KAAA,EAAO,YAAA;AAAA,MACP,UAAA,EAAY;AAAA;AACd,GACF;AAEA,EAAA,uBACE,GAAA,CAAC,wBAAqB,KAAA,EAAO,YAAA,EAC3B,8BAAC,OAAA,EAAA,EAAQ,SAAA,EAAW,aAAA,EAAgB,QAAA,EAAS,CAAA,EAC/C,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"AccentBox.mjs","sources":["../../../../../../src/components/AccentBox/AccentBox.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport type {\n  PropsWithClassName,\n  PropsWithElementType,\n} from \"@/lib/types/props\";\nimport clsx from \"clsx\";\nimport styles from \"./AccentBox.module.scss\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\n\nexport interface AccentBoxProps\n  extends PropsWithChildren,\n    PropsWithElementType<\"div\" | \"section\" | \"article\">,\n    PropsWithClassName,\n    FlowComponentProps {\n  color?: \"blue\" | \"green\" | \"gradient\" | \"neutral\";\n}\n\n/** @flr-generate all */\nexport const AccentBox = flowComponent(\n  \"AccentBox\",\n  (props) => {\n    const { color = \"blue\", children, elementType = \"div\", className } = props;\n\n    const rootClassName = clsx(styles.accentBox, className, styles[color]);\n\n    const Element = elementType;\n\n    const contentColor = color === \"green\" ? \"dark\" : undefined;\n\n    const propsContext: PropsContext = {\n      Link: {\n        color: contentColor,\n      },\n      Text: {\n        color: contentColor,\n      },\n      Heading: {\n        color: contentColor,\n      },\n    };\n\n    return (\n      <PropsContextProvider props={propsContext}>\n        <Element className={rootClassName}>{children}</Element>\n      </PropsContextProvider>\n    );\n  },\n  { type: \"layout\" },\n);\n\nexport default AccentBox;\n"],"names":[],"mappings":";;;;;;;AAsBO,MAAM,SAAA,GAAY,aAAA;AAAA,EACvB,WAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM,EAAE,KAAA,GAAQ,MAAA,EAAQ,UAAU,WAAA,GAAc,KAAA,EAAO,WAAU,GAAI,KAAA;AAErE,IAAA,MAAM,gBAAgB,IAAA,CAAK,MAAA,CAAO,WAAW,SAAA,EAAW,MAAA,CAAO,KAAK,CAAC,CAAA;AAErE,IAAA,MAAM,OAAA,GAAU,WAAA;AAEhB,IAAA,MAAM,YAAA,GAAe,KAAA,KAAU,OAAA,GAAU,MAAA,GAAS,MAAA;AAElD,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,IAAA,EAAM;AAAA,QACJ,KAAA,EAAO;AAAA,OACT;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,KAAA,EAAO;AAAA,OACT;AAAA,MACA,OAAA,EAAS;AAAA,QACP,KAAA,EAAO;AAAA;AACT,KACF;AAEA,IAAA,uBACE,GAAA,CAAC,wBAAqB,KAAA,EAAO,YAAA,EAC3B,8BAAC,OAAA,EAAA,EAAQ,SAAA,EAAW,aAAA,EAAgB,QAAA,EAAS,CAAA,EAC/C,CAAA;AAAA,EAEJ,CAAA;AAAA,EACA,EAAE,MAAM,QAAA;AACV;;;;"}

package/dist/js/components/src/components/ActionGroup/ActionGroup.mjs

@@ -11,37 +11,43 @@ import { TunnelProvider } from '@mittwald/react-tunnel';
 import { ActionStateContextProvider } from '../Action/models/ActionStateContext.mjs';
 import { getActionGroupSlot } from './lib/getActionGroupSlot.mjs';
 
-const ActionGroup = flowComponent("ActionGroup", (props) => {
-  const {
-    children,
-    className,
-    ref,
-    spacing = "s",
-    ...rest
-  } = props;
-  const rootClassName = clsx(styles.actionGroup, className, styles[spacing]);
-  const propsContext = {
-    Button: {
-      slot: dynamic((props2) => getActionGroupSlot(props2)),
-      className: dynamic((props2) => {
-        const slot = getActionGroupSlot(props2);
-        return clsx(props2.className, styles[slot]);
-      })
-    },
-    Switch: {
-      labelPosition: "leading",
-      className: dynamic((props2) => {
-        return clsx(props2.className, props2.slot && styles[props2.slot]);
-      })
-    },
-    Link: {
-      className: dynamic((props2) => {
-        return clsx(props2.className, props2.slot && styles[props2.slot]);
-      })
-    }
-  };
-  return /* @__PURE__ */ jsx(ActionStateContextProvider, { children: /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children: /* @__PURE__ */ jsx(TunnelProvider, { children: /* @__PURE__ */ jsx("div", { ...rest, className: rootClassName, ref, role: "group", children }) }) }) });
-});
+const ActionGroup = flowComponent(
+  "ActionGroup",
+  (props) => {
+    const {
+      children,
+      className,
+      ref,
+      spacing = "s",
+      ...rest
+    } = props;
+    const rootClassName = clsx(styles.actionGroup, className, styles[spacing]);
+    const propsContext = {
+      Button: {
+        slot: dynamic((props2) => getActionGroupSlot(props2)),
+        className: dynamic((props2) => {
+          const slot = getActionGroupSlot(props2);
+          return clsx(props2.className, styles[slot]);
+        })
+      },
+      Switch: {
+        labelPosition: "leading",
+        className: dynamic((props2) => {
+          return clsx(props2.className, props2.slot && styles[props2.slot]);
+        })
+      },
+      Link: {
+        className: dynamic((props2) => {
+          return clsx(props2.className, props2.slot && styles[props2.slot]);
+        })
+      }
+    };
+    return /* @__PURE__ */ jsx(ActionStateContextProvider, { children: /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children: /* @__PURE__ */ jsx(TunnelProvider, { children: /* @__PURE__ */ jsx("div", { ...rest, className: rootClassName, ref, role: "group", children }) }) }) });
+  },
+  {
+    type: "layout"
+  }
+);
 
 export { ActionGroup, ActionGroup as default };
 //# sourceMappingURL=ActionGroup.mjs.map

package/dist/js/components/src/components/ActionGroup/ActionGroup.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ActionGroup.mjs","sources":["../../../../../../src/components/ActionGroup/ActionGroup.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport styles from \"./ActionGroup.module.scss\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { dynamic, PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { TunnelProvider } from \"@mittwald/react-tunnel\";\nimport { ActionStateContextProvider } from \"@/components/Action/models/ActionStateContext\";\nimport { getActionGroupSlot } from \"@/components/ActionGroup/lib/getActionGroupSlot\";\n\nexport interface ActionGroupProps\n  extends PropsWithChildren,\n    FlowComponentProps<HTMLDivElement>,\n    PropsWithClassName {\n  /** The spacing between the buttons inside the action group. @default \"m\" */\n  spacing?: \"s\" | \"m\";\n}\n\n/** @flr-generate all */\nexport const ActionGroup = flowComponent(\"ActionGroup\", (props) => {\n  const {\n    children,\n    className,\n    ref,\n\n    spacing = \"s\",\n    ...rest\n  } = props;\n\n  const rootClassName = clsx(styles.actionGroup, className, styles[spacing]);\n\n  const propsContext: PropsContext = {\n    Button: {\n      slot: dynamic((props) => getActionGroupSlot(props)),\n      className: dynamic((props) => {\n        const slot = getActionGroupSlot(props);\n        return clsx(props.className, styles[slot]);\n      }),\n    },\n    Switch: {\n      labelPosition: \"leading\",\n      className: dynamic((props) => {\n        return clsx(props.className, props.slot && styles[props.slot]);\n      }),\n    },\n    Link: {\n      className: dynamic((props) => {\n        return clsx(props.className, props.slot && styles[props.slot]);\n      }),\n    },\n  };\n\n  return (\n    <ActionStateContextProvider>\n      <PropsContextProvider props={propsContext}>\n        <TunnelProvider>\n          <div {...rest} className={rootClassName} ref={ref} role=\"group\">\n            {children}\n          </div>\n        </TunnelProvider>\n      </PropsContextProvider>\n    </ActionStateContextProvider>\n  );\n});\n\nexport default ActionGroup;\n"],"names":["props"],"mappings":";;;;;;;;;;;AAqBO,MAAM,WAAA,GAAc,aAAA,CAAc,aAAA,EAAe,CAAC,KAAA,KAAU;AACjE,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAA;AAAA,IAEA,OAAA,GAAU,GAAA;AAAA,IACV,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,gBAAgB,IAAA,CAAK,MAAA,CAAO,aAAa,SAAA,EAAW,MAAA,CAAO,OAAO,CAAC,CAAA;AAEzE,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,MAAA,EAAQ;AAAA,MACN,MAAM,OAAA,CAAQ,CAACA,MAAAA,KAAU,kBAAA,CAAmBA,MAAK,CAAC,CAAA;AAAA,MAClD,SAAA,EAAW,OAAA,CAAQ,CAACA,MAAAA,KAAU;AAC5B,QAAA,MAAM,IAAA,GAAO,mBAAmBA,MAAK,CAAA;AACrC,QAAA,OAAO,IAAA,CAAKA,MAAAA,CAAM,SAAA,EAAW,MAAA,CAAO,IAAI,CAAC,CAAA;AAAA,MAC3C,CAAC;AAAA,KACH;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,aAAA,EAAe,SAAA;AAAA,MACf,SAAA,EAAW,OAAA,CAAQ,CAACA,MAAAA,KAAU;AAC5B,QAAA,OAAO,IAAA,CAAKA,OAAM,SAAA,EAAWA,MAAAA,CAAM,QAAQ,MAAA,CAAOA,MAAAA,CAAM,IAAI,CAAC,CAAA;AAAA,MAC/D,CAAC;AAAA,KACH;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,SAAA,EAAW,OAAA,CAAQ,CAACA,MAAAA,KAAU;AAC5B,QAAA,OAAO,IAAA,CAAKA,OAAM,SAAA,EAAWA,MAAAA,CAAM,QAAQ,MAAA,CAAOA,MAAAA,CAAM,IAAI,CAAC,CAAA;AAAA,MAC/D,CAAC;AAAA;AACH,GACF;AAEA,EAAA,uBACE,GAAA,CAAC,8BACC,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,OAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,kBACC,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAK,GAAG,IAAA,EAAM,SAAA,EAAW,eAAe,GAAA,EAAU,IAAA,EAAK,SACrD,QAAA,EACH,CAAA,EACF,GACF,CAAA,EACF,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"ActionGroup.mjs","sources":["../../../../../../src/components/ActionGroup/ActionGroup.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport styles from \"./ActionGroup.module.scss\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { dynamic, PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { TunnelProvider } from \"@mittwald/react-tunnel\";\nimport { ActionStateContextProvider } from \"@/components/Action/models/ActionStateContext\";\nimport { getActionGroupSlot } from \"@/components/ActionGroup/lib/getActionGroupSlot\";\n\nexport interface ActionGroupProps\n  extends PropsWithChildren,\n    FlowComponentProps<HTMLDivElement>,\n    PropsWithClassName {\n  /** The spacing between the buttons inside the action group. @default \"m\" */\n  spacing?: \"s\" | \"m\";\n}\n\n/** @flr-generate all */\nexport const ActionGroup = flowComponent(\n  \"ActionGroup\",\n  (props) => {\n    const {\n      children,\n      className,\n      ref,\n\n      spacing = \"s\",\n      ...rest\n    } = props;\n\n    const rootClassName = clsx(styles.actionGroup, className, styles[spacing]);\n\n    const propsContext: PropsContext = {\n      Button: {\n        slot: dynamic((props) => getActionGroupSlot(props)),\n        className: dynamic((props) => {\n          const slot = getActionGroupSlot(props);\n          return clsx(props.className, styles[slot]);\n        }),\n      },\n      Switch: {\n        labelPosition: \"leading\",\n        className: dynamic((props) => {\n          return clsx(props.className, props.slot && styles[props.slot]);\n        }),\n      },\n      Link: {\n        className: dynamic((props) => {\n          return clsx(props.className, props.slot && styles[props.slot]);\n        }),\n      },\n    };\n\n    return (\n      <ActionStateContextProvider>\n        <PropsContextProvider props={propsContext}>\n          <TunnelProvider>\n            <div {...rest} className={rootClassName} ref={ref} role=\"group\">\n              {children}\n            </div>\n          </TunnelProvider>\n        </PropsContextProvider>\n      </ActionStateContextProvider>\n    );\n  },\n  {\n    type: \"layout\",\n  },\n);\n\nexport default ActionGroup;\n"],"names":["props"],"mappings":";;;;;;;;;;;AAqBO,MAAM,WAAA,GAAc,aAAA;AAAA,EACzB,aAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM;AAAA,MACJ,QAAA;AAAA,MACA,SAAA;AAAA,MACA,GAAA;AAAA,MAEA,OAAA,GAAU,GAAA;AAAA,MACV,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,gBAAgB,IAAA,CAAK,MAAA,CAAO,aAAa,SAAA,EAAW,MAAA,CAAO,OAAO,CAAC,CAAA;AAEzE,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,MAAA,EAAQ;AAAA,QACN,MAAM,OAAA,CAAQ,CAACA,MAAAA,KAAU,kBAAA,CAAmBA,MAAK,CAAC,CAAA;AAAA,QAClD,SAAA,EAAW,OAAA,CAAQ,CAACA,MAAAA,KAAU;AAC5B,UAAA,MAAM,IAAA,GAAO,mBAAmBA,MAAK,CAAA;AACrC,UAAA,OAAO,IAAA,CAAKA,MAAAA,CAAM,SAAA,EAAW,MAAA,CAAO,IAAI,CAAC,CAAA;AAAA,QAC3C,CAAC;AAAA,OACH;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,aAAA,EAAe,SAAA;AAAA,QACf,SAAA,EAAW,OAAA,CAAQ,CAACA,MAAAA,KAAU;AAC5B,UAAA,OAAO,IAAA,CAAKA,OAAM,SAAA,EAAWA,MAAAA,CAAM,QAAQ,MAAA,CAAOA,MAAAA,CAAM,IAAI,CAAC,CAAA;AAAA,QAC/D,CAAC;AAAA,OACH;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,SAAA,EAAW,OAAA,CAAQ,CAACA,MAAAA,KAAU;AAC5B,UAAA,OAAO,IAAA,CAAKA,OAAM,SAAA,EAAWA,MAAAA,CAAM,QAAQ,MAAA,CAAOA,MAAAA,CAAM,IAAI,CAAC,CAAA;AAAA,QAC/D,CAAC;AAAA;AACH,KACF;AAEA,IAAA,uBACE,GAAA,CAAC,8BACC,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,OAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,kBACC,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAK,GAAG,IAAA,EAAM,SAAA,EAAW,eAAe,GAAA,EAAU,IAAA,EAAK,SACrD,QAAA,EACH,CAAA,EACF,GACF,CAAA,EACF,CAAA;AAAA,EAEJ,CAAA;AAAA,EACA;AAAA,IACE,IAAA,EAAM;AAAA;AAEV;;;;"}

package/dist/js/components/src/components/Align/Align.mjs

@@ -7,23 +7,29 @@ import '../../lib/propsContext/propsContext.mjs';
 import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
 import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
 
-const Align = flowComponent("Align", (props) => {
-  const { children, className } = props;
-  const rootClassName = clsx(styles.align, className);
-  const propsContext = {
-    Text: { className: styles.text },
-    Button: { className: styles.button },
-    Avatar: { className: styles.avatar, size: "m" },
-    CopyButton: { size: "s", className: styles.copyButton },
-    Icon: { size: "s", className: styles.icon },
-    ContextualHelpTrigger: {
-      Button: {
-        className: styles.contextualHelpTriggerButton
+const Align = flowComponent(
+  "Align",
+  (props) => {
+    const { children, className } = props;
+    const rootClassName = clsx(styles.align, className);
+    const propsContext = {
+      Text: { className: styles.text },
+      Button: { className: styles.button },
+      Avatar: { className: styles.avatar, size: "m" },
+      CopyButton: { size: "s", className: styles.copyButton },
+      Icon: { size: "s", className: styles.icon },
+      ContextualHelpTrigger: {
+        Button: {
+          className: styles.contextualHelpTriggerButton
+        }
       }
-    }
-  };
-  return /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children: /* @__PURE__ */ jsx("div", { className: rootClassName, children }) });
-});
+    };
+    return /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children: /* @__PURE__ */ jsx("div", { className: rootClassName, children }) });
+  },
+  {
+    type: "layout"
+  }
+);
 
 export { Align, Align as default };
 //# sourceMappingURL=Align.mjs.map

package/dist/js/components/src/components/Align/Align.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Align.mjs","sources":["../../../../../../src/components/Align/Align.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport styles from \"./Align.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\n\nexport interface AlignProps\n  extends PropsWithChildren,\n    PropsWithClassName,\n    FlowComponentProps {}\n\n/** @flr-generate all */\nexport const Align = flowComponent(\"Align\", (props) => {\n  const { children, className } = props;\n\n  const rootClassName = clsx(styles.align, className);\n\n  const propsContext: PropsContext = {\n    Text: { className: styles.text },\n    Button: { className: styles.button },\n    Avatar: { className: styles.avatar, size: \"m\" },\n    CopyButton: { size: \"s\", className: styles.copyButton },\n    Icon: { size: \"s\", className: styles.icon },\n    ContextualHelpTrigger: {\n      Button: {\n        className: styles.contextualHelpTriggerButton,\n      },\n    },\n  };\n\n  return (\n    <PropsContextProvider props={propsContext}>\n      <div className={rootClassName}>{children}</div>\n    </PropsContextProvider>\n  );\n});\n\nexport default Align;\n"],"names":[],"mappings":";;;;;;;AAeO,MAAM,KAAA,GAAQ,aAAA,CAAc,OAAA,EAAS,CAAC,KAAA,KAAU;AACrD,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAU,GAAI,KAAA;AAEhC,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,KAAA,EAAO,SAAS,CAAA;AAElD,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,IAAA,EAAM,EAAE,SAAA,EAAW,MAAA,CAAO,IAAA,EAAK;AAAA,IAC/B,MAAA,EAAQ,EAAE,SAAA,EAAW,MAAA,CAAO,MAAA,EAAO;AAAA,IACnC,QAAQ,EAAE,SAAA,EAAW,MAAA,CAAO,MAAA,EAAQ,MAAM,GAAA,EAAI;AAAA,IAC9C,YAAY,EAAE,IAAA,EAAM,GAAA,EAAK,SAAA,EAAW,OAAO,UAAA,EAAW;AAAA,IACtD,MAAM,EAAE,IAAA,EAAM,GAAA,EAAK,SAAA,EAAW,OAAO,IAAA,EAAK;AAAA,IAC1C,qBAAA,EAAuB;AAAA,MACrB,MAAA,EAAQ;AAAA,QACN,WAAW,MAAA,CAAO;AAAA;AACpB;AACF,GACF;AAEA,EAAA,uBACE,GAAA,CAAC,wBAAqB,KAAA,EAAO,YAAA,EAC3B,8BAAC,KAAA,EAAA,EAAI,SAAA,EAAW,aAAA,EAAgB,QAAA,EAAS,CAAA,EAC3C,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Align.mjs","sources":["../../../../../../src/components/Align/Align.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport styles from \"./Align.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\n\nexport interface AlignProps\n  extends PropsWithChildren,\n    PropsWithClassName,\n    FlowComponentProps {}\n\n/** @flr-generate all */\nexport const Align = flowComponent(\n  \"Align\",\n  (props) => {\n    const { children, className } = props;\n\n    const rootClassName = clsx(styles.align, className);\n\n    const propsContext: PropsContext = {\n      Text: { className: styles.text },\n      Button: { className: styles.button },\n      Avatar: { className: styles.avatar, size: \"m\" },\n      CopyButton: { size: \"s\", className: styles.copyButton },\n      Icon: { size: \"s\", className: styles.icon },\n      ContextualHelpTrigger: {\n        Button: {\n          className: styles.contextualHelpTriggerButton,\n        },\n      },\n    };\n\n    return (\n      <PropsContextProvider props={propsContext}>\n        <div className={rootClassName}>{children}</div>\n      </PropsContextProvider>\n    );\n  },\n  {\n    type: \"layout\",\n  },\n);\n\nexport default Align;\n"],"names":[],"mappings":";;;;;;;AAeO,MAAM,KAAA,GAAQ,aAAA;AAAA,EACnB,OAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAU,GAAI,KAAA;AAEhC,IAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,KAAA,EAAO,SAAS,CAAA;AAElD,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,IAAA,EAAM,EAAE,SAAA,EAAW,MAAA,CAAO,IAAA,EAAK;AAAA,MAC/B,MAAA,EAAQ,EAAE,SAAA,EAAW,MAAA,CAAO,MAAA,EAAO;AAAA,MACnC,QAAQ,EAAE,SAAA,EAAW,MAAA,CAAO,MAAA,EAAQ,MAAM,GAAA,EAAI;AAAA,MAC9C,YAAY,EAAE,IAAA,EAAM,GAAA,EAAK,SAAA,EAAW,OAAO,UAAA,EAAW;AAAA,MACtD,MAAM,EAAE,IAAA,EAAM,GAAA,EAAK,SAAA,EAAW,OAAO,IAAA,EAAK;AAAA,MAC1C,qBAAA,EAAuB;AAAA,QACrB,MAAA,EAAQ;AAAA,UACN,WAAW,MAAA,CAAO;AAAA;AACpB;AACF,KACF;AAEA,IAAA,uBACE,GAAA,CAAC,wBAAqB,KAAA,EAAO,YAAA,EAC3B,8BAAC,KAAA,EAAA,EAAI,SAAA,EAAW,aAAA,EAAgB,QAAA,EAAS,CAAA,EAC3C,CAAA;AAAA,EAEJ,CAAA;AAAA,EACA;AAAA,IACE,IAAA,EAAM;AAAA;AAEV;;;;"}

package/dist/js/components/src/components/Autocomplete/Autocomplete.mjs

@@ -13,48 +13,48 @@ import { TunnelExit } from '@mittwald/react-tunnel';
 import locales from '../../../../_virtual/_.locale.json@48bdcfec6dd32df5dc9f6fa222d33240.mjs';
 import { Text } from '../Text/Text.mjs';
 import styles from './Autocomplete.module.scss.mjs';
-import { useLocalizedStringFormatter, useFocusWithin, UNSAFE_PortalProvider } from 'react-aria';
-import { emitElementValueChange } from '../../lib/react/emitElementValueChange.mjs';
+import { useObjectRef, useLocalizedStringFormatter, useFocusWithin, UNSAFE_PortalProvider } from 'react-aria';
 import { useFieldComponent } from '../../lib/hooks/useFieldComponent.mjs';
-import { useManagedValue } from '../../lib/hooks/useManagedValue.mjs';
+import { useControlledHostValueProps } from '../../lib/remote/useControlledHostValueProps.mjs';
+import { isFocused } from '../../lib/form/isFocused.mjs';
 
 const Autocomplete = flowComponent("Autocomplete", (props) => {
-  const { children, isInvalid, ...rest } = props;
-  const { value, handleOnChange } = useManagedValue(props);
+  const { children, isInvalid, value, defaultValue, ref, onChange, ...rest } = useControlledHostValueProps(props);
+  const inputRef = useObjectRef(ref);
   const { contains } = Aria.useFilter({ sensitivity: "base" });
   const stringFormatter = useLocalizedStringFormatter(locales);
   const container = useRef(null);
-  const triggerRef = useRef(null);
-  const controller = useOverlayController("Popover", {
+  const optionsOverlayController = useOverlayController("Popover", {
     reuseControllerFromContext: false
   });
   const focusWithin = useFocusWithin({
-    onBlurWithin: controller.close
+    onBlurWithin: optionsOverlayController.close
   });
+  const renderEmptyState = () => /* @__PURE__ */ jsx(Text, { className: styles.empty, children: stringFormatter.format("autocomplete.empty") });
+  const handleInputChange = (value2) => {
+    if (value2 === "") {
+      optionsOverlayController.close();
+    } else if (isFocused(inputRef.current)) {
+      optionsOverlayController.open();
+    }
+    onChange?.(value2);
+  };
+  const handleOptionAction = (key) => {
+    const value2 = String(key);
+    onChange(value2);
+    optionsOverlayController.close();
+  };
   const inputProps = {
     onKeyDown: (e) => {
-      if (e.key === "Enter" && controller.isOpen) {
+      if (e.key === "Enter" && optionsOverlayController.isOpen) {
         e.preventDefault();
       }
     },
     isInvalid,
-    ref: triggerRef
-  };
-  const renderEmptyState = () => /* @__PURE__ */ jsx(Text, { className: styles.empty, children: stringFormatter.format("autocomplete.empty") });
-  const handleOnInputChange = (value2) => {
-    if (!value2) {
-      controller.close();
-    } else if (!controller.isOpen) {
-      controller.open();
-    }
-    handleOnChange?.(value2);
-  };
-  const handleOptionAction = (key) => {
-    const inputElement = triggerRef.current;
-    if (inputElement) {
-      emitElementValueChange(inputElement, String(key));
-    }
-    controller.close();
+    ref: inputRef,
+    onChange: handleInputChange,
+    value,
+    defaultValue
   };
   const {
     FieldErrorView,
@@ -64,7 +64,7 @@ const Autocomplete = flowComponent("Autocomplete", (props) => {
   } = useFieldComponent(props);
   const propsContext = {
     SearchField: inputProps,
-    TextField: { ...inputProps, inputContext: Aria.AutocompleteContext },
+    TextField: inputProps,
     Option: {
       tunnelId: "options"
     },
@@ -74,31 +74,42 @@ const Autocomplete = flowComponent("Autocomplete", (props) => {
     ...fieldPropsContext
   };
   return /* @__PURE__ */ jsxs("div", { ...fieldProps, children: [
-    /* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, clear: true, children: /* @__PURE__ */ jsx("div", { ...focusWithin.focusWithinProps, ref: container, children: /* @__PURE__ */ jsx(UNSAFE_PortalProvider, { getContainer: () => container.current, children: /* @__PURE__ */ jsxs(
-      Aria.Autocomplete,
+    /* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsx(
+      PropsContextProvider,
       {
-        onInputChange: handleOnInputChange,
-        filter: contains,
-        disableAutoFocusFirst: true,
-        inputValue: value,
-        ...rest,
-        children: [
-          children,
-          /* @__PURE__ */ jsx(
-            Options,
-            {
-              onAction: handleOptionAction,
-              triggerRef,
-              controller,
-              renderEmptyState,
-              isNonModal: true,
-              placement: "bottom start",
-              children: /* @__PURE__ */ jsx(TunnelExit, { id: "options" })
-            }
-          )
-        ]
+        props: propsContext,
+        dependencies: [
+          value,
+          isInvalid,
+          defaultValue,
+          optionsOverlayController,
+          onChange
+        ],
+        children: /* @__PURE__ */ jsx("div", { ...focusWithin.focusWithinProps, ref: container, children: /* @__PURE__ */ jsx(UNSAFE_PortalProvider, { getContainer: () => container.current, children: /* @__PURE__ */ jsxs(
+          Aria.Autocomplete,
+          {
+            filter: contains,
+            disableAutoFocusFirst: true,
+            ...rest,
+            children: [
+              children,
+              /* @__PURE__ */ jsx(
+                Options,
+                {
+                  onAction: handleOptionAction,
+                  triggerRef: inputRef,
+                  controller: optionsOverlayController,
+                  renderEmptyState,
+                  isNonModal: true,
+                  placement: "bottom start",
+                  children: /* @__PURE__ */ jsx(TunnelExit, { id: "options" })
+                }
+              )
+            ]
+          }
+        ) }) })
       }
-    ) }) }) }) }),
+    ) }),
     /* @__PURE__ */ jsx(FieldErrorView, {})
   ] });
 });

package/dist/js/components/src/components/Autocomplete/Autocomplete.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Autocomplete.mjs","sources":["../../../../../../src/components/Autocomplete/Autocomplete.tsx"],"sourcesContent":["import { useRef, type PropsWithChildren } from \"react\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { SearchFieldProps } from \"@/components/SearchField\";\nimport type { TextFieldProps } from \"@/components/TextField\";\nimport Options from \"@/components/Options\";\nimport { TunnelExit } from \"@mittwald/react-tunnel\";\nimport locales from \"./locales/*.locale.json\";\nimport Text from \"@/components/Text\";\nimport styles from \"./Autocomplete.module.scss\";\nimport {\n  UNSAFE_PortalProvider,\n  useFocusWithin,\n  useLocalizedStringFormatter,\n} from \"react-aria\";\nimport { emitElementValueChange } from \"@/lib/react/emitElementValueChange\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useManagedValue } from \"@/lib/hooks/useManagedValue\";\n\nexport interface AutocompleteProps\n  extends PropsWithChildren,\n    PropsWithClassName,\n    FlowComponentProps,\n    Omit<\n      Aria.AutocompleteProps,\n      \"children\" | \"onInputChange\" | \"inputValue\" | \"defaultInputValue\"\n    > {\n  isInvalid?: boolean;\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n}\n\n/** @flr-generate all */\nexport const Autocomplete = flowComponent(\"Autocomplete\", (props) => {\n  const { children, isInvalid, ...rest } = props;\n\n  const { value, handleOnChange } = useManagedValue(props);\n\n  const { contains } = Aria.useFilter({ sensitivity: \"base\" });\n  const stringFormatter = useLocalizedStringFormatter(locales);\n  const container = useRef(null);\n  const triggerRef = useRef<HTMLInputElement>(null);\n\n  const controller = useOverlayController(\"Popover\", {\n    reuseControllerFromContext: false,\n  });\n\n  const focusWithin = useFocusWithin({\n    onBlurWithin: controller.close,\n  });\n\n  const inputProps: SearchFieldProps & TextFieldProps = {\n    onKeyDown: (e) => {\n      if (e.key === \"Enter\" && controller.isOpen) {\n        e.preventDefault();\n      }\n    },\n    isInvalid,\n    ref: triggerRef,\n  };\n\n  const renderEmptyState = () => (\n    <Text className={styles.empty}>\n      {stringFormatter.format(\"autocomplete.empty\")}\n    </Text>\n  );\n\n  const handleOnInputChange = (value: string) => {\n    if (!value) {\n      controller.close();\n    } else if (!controller.isOpen) {\n      controller.open();\n    }\n\n    handleOnChange?.(value);\n  };\n\n  const handleOptionAction = (key: Aria.Key) => {\n    const inputElement = triggerRef.current;\n    if (inputElement) {\n      // Set value on input element and trigger change event\n      emitElementValueChange(inputElement, String(key));\n    }\n    controller.close();\n  };\n\n  const {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    fieldPropsContext,\n    fieldProps,\n  } = useFieldComponent(props);\n\n  const propsContext: PropsContext = {\n    SearchField: inputProps,\n    TextField: { ...inputProps, inputContext: Aria.AutocompleteContext },\n    Option: {\n      tunnelId: \"options\",\n    },\n    Popover: {\n      className: styles.popover,\n    },\n    ...fieldPropsContext,\n  };\n\n  return (\n    <div {...fieldProps}>\n      <FieldErrorCaptureContext>\n        <PropsContextProvider props={propsContext} clear>\n          <div {...focusWithin.focusWithinProps} ref={container}>\n            <UNSAFE_PortalProvider getContainer={() => container.current}>\n              <Aria.Autocomplete\n                onInputChange={handleOnInputChange}\n                filter={contains}\n                disableAutoFocusFirst\n                inputValue={value}\n                {...rest}\n              >\n                {children}\n                <Options\n                  onAction={handleOptionAction}\n                  triggerRef={triggerRef}\n                  controller={controller}\n                  renderEmptyState={renderEmptyState}\n                  isNonModal\n                  placement=\"bottom start\"\n                >\n                  <TunnelExit id=\"options\" />\n                </Options>\n              </Aria.Autocomplete>\n            </UNSAFE_PortalProvider>\n          </div>\n        </PropsContextProvider>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </div>\n  );\n});\n\nexport default Autocomplete;\n"],"names":["value"],"mappings":"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"}
+{"version":3,"file":"Autocomplete.mjs","sources":["../../../../../../src/components/Autocomplete/Autocomplete.tsx"],"sourcesContent":["import { useRef, type PropsWithChildren } from \"react\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { SearchFieldProps } from \"@/components/SearchField\";\nimport type { TextFieldProps } from \"@/components/TextField\";\nimport Options from \"@/components/Options\";\nimport { TunnelExit } from \"@mittwald/react-tunnel\";\nimport locales from \"./locales/*.locale.json\";\nimport Text from \"@/components/Text\";\nimport styles from \"./Autocomplete.module.scss\";\nimport {\n  UNSAFE_PortalProvider,\n  useFocusWithin,\n  useLocalizedStringFormatter,\n  useObjectRef,\n} from \"react-aria\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { isFocused } from \"@/lib/form/isFocused\";\n\nexport interface AutocompleteProps\n  extends PropsWithChildren,\n    PropsWithClassName,\n    FlowComponentProps<HTMLInputElement>,\n    Omit<\n      Aria.AutocompleteProps,\n      \"children\" | \"onInputChange\" | \"inputValue\" | \"defaultInputValue\" | \"ref\"\n    > {\n  isInvalid?: boolean;\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n}\n\n/** @flr-generate all */\nexport const Autocomplete = flowComponent(\"Autocomplete\", (props) => {\n  const { children, isInvalid, value, defaultValue, ref, onChange, ...rest } =\n    useControlledHostValueProps(props);\n\n  const inputRef = useObjectRef(ref);\n\n  const { contains } = Aria.useFilter({ sensitivity: \"base\" });\n  const stringFormatter = useLocalizedStringFormatter(locales);\n  const container = useRef(null);\n\n  const optionsOverlayController = useOverlayController(\"Popover\", {\n    reuseControllerFromContext: false,\n  });\n\n  const focusWithin = useFocusWithin({\n    onBlurWithin: optionsOverlayController.close,\n  });\n\n  const renderEmptyState = () => (\n    <Text className={styles.empty}>\n      {stringFormatter.format(\"autocomplete.empty\")}\n    </Text>\n  );\n\n  const handleInputChange = (value: string) => {\n    if (value === \"\") {\n      optionsOverlayController.close();\n    } else if (isFocused(inputRef.current)) {\n      optionsOverlayController.open();\n    }\n    onChange?.(value);\n  };\n\n  const handleOptionAction = (key: Aria.Key) => {\n    const value = String(key);\n    onChange(value);\n    optionsOverlayController.close();\n  };\n\n  const inputProps: SearchFieldProps & TextFieldProps = {\n    onKeyDown: (e) => {\n      if (e.key === \"Enter\" && optionsOverlayController.isOpen) {\n        e.preventDefault();\n      }\n    },\n    isInvalid,\n    ref: inputRef,\n    onChange: handleInputChange,\n    value,\n    defaultValue,\n  };\n\n  const {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    fieldPropsContext,\n    fieldProps,\n  } = useFieldComponent(props);\n\n  const propsContext: PropsContext = {\n    SearchField: inputProps,\n    TextField: inputProps,\n    Option: {\n      tunnelId: \"options\",\n    },\n    Popover: {\n      className: styles.popover,\n    },\n    ...fieldPropsContext,\n  };\n\n  return (\n    <div {...fieldProps}>\n      <FieldErrorCaptureContext>\n        <PropsContextProvider\n          props={propsContext}\n          dependencies={[\n            value,\n            isInvalid,\n            defaultValue,\n            optionsOverlayController,\n            onChange,\n          ]}\n        >\n          <div {...focusWithin.focusWithinProps} ref={container}>\n            <UNSAFE_PortalProvider getContainer={() => container.current}>\n              <Aria.Autocomplete\n                filter={contains}\n                disableAutoFocusFirst\n                {...rest}\n              >\n                {children}\n                <Options\n                  onAction={handleOptionAction}\n                  triggerRef={inputRef}\n                  controller={optionsOverlayController}\n                  renderEmptyState={renderEmptyState}\n                  isNonModal\n                  placement=\"bottom start\"\n                >\n                  <TunnelExit id=\"options\" />\n                </Options>\n              </Aria.Autocomplete>\n            </UNSAFE_PortalProvider>\n          </div>\n        </PropsContextProvider>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </div>\n  );\n});\n\nexport default Autocomplete;\n"],"names":["value"],"mappings":"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"}

package/dist/js/components/src/components/BrowserOnly/BrowserOnly.mjs

@@ -6,6 +6,13 @@ import '../../lib/controller/overlay/context.mjs';
 import { useIsMounted } from '../../lib/hooks/useIsMounted.mjs';
 import '../../lib/propsContext/propsContext.mjs';
 import 'remeda';
+import 'react/jsx-runtime';
+import '@mittwald/react-tunnel';
+import '../../lib/slotContext/SlotContextProvider.mjs';
+import '../../lib/propsContext/components/ComponentPropsContextProvider.mjs';
+import '../../views/ComponentPropsContextProviderView.mjs';
+import '../../lib/propsContext/components/PropsContextProvider.mjs';
+import '../../lib/viewComponentContext/viewComponentContext.mjs';
 import '@react-aria/utils';
 import 'dot-prop';
 

package/dist/js/components/src/components/BrowserOnly/BrowserOnly.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BrowserOnly.mjs","sources":["../../../../../../src/components/BrowserOnly/BrowserOnly.tsx"],"sourcesContent":["import { useIsMounted } from \"@/lib/hooks\";\nimport type { PropsWithChildren } from \"react\";\n\nexport type BrowserOnlyProps = PropsWithChildren;\n\nexport const BrowserOnly = (props: PropsWithChildren) => {\n  if (useIsMounted()) {\n    return props.children;\n  }\n};\n\nexport default BrowserOnly;\n"],"names":[],"mappings":";;;;;;;;;AAKO,MAAM,WAAA,GAAc,CAAC,KAAA,KAA6B;AACvD,EAAA,IAAI,cAAa,EAAG;AAClB,IAAA,OAAO,KAAA,CAAM,QAAA;AAAA,EACf;AACF;;;;"}
+{"version":3,"file":"BrowserOnly.mjs","sources":["../../../../../../src/components/BrowserOnly/BrowserOnly.tsx"],"sourcesContent":["import { useIsMounted } from \"@/lib/hooks\";\nimport type { PropsWithChildren } from \"react\";\n\nexport type BrowserOnlyProps = PropsWithChildren;\n\nexport const BrowserOnly = (props: PropsWithChildren) => {\n  if (useIsMounted()) {\n    return props.children;\n  }\n};\n\nexport default BrowserOnly;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAKO,MAAM,WAAA,GAAc,CAAC,KAAA,KAA6B;AACvD,EAAA,IAAI,cAAa,EAAG;AAClB,IAAA,OAAO,KAAA,CAAM,QAAA;AAAA,EACf;AACF;;;;"}

package/dist/js/components/src/components/CartesianChart/CartesianChart.mjs

@@ -29,6 +29,10 @@ import 'react-aria-components';
 import 'mobx';
 import '../../lib/controller/overlay/context.mjs';
 import 'remeda';
+import '../../lib/slotContext/SlotContextProvider.mjs';
+import '../../lib/propsContext/components/ComponentPropsContextProvider.mjs';
+import '../../views/ComponentPropsContextProviderView.mjs';
+import '../../lib/viewComponentContext/viewComponentContext.mjs';
 import '@react-aria/utils';
 import 'dot-prop';
 import '../Heading/Heading.mjs';
@@ -37,12 +41,10 @@ import { CartesianGrid } from './components/CartesianGrid/CartesianGrid.mjs';
 import '../Checkbox/Checkbox.mjs';
 import '../CheckboxButton/CheckboxButton.mjs';
 import '../CheckboxGroup/CheckboxGroup.mjs';
-import '../../lib/propsContext/inherit/PropsContextLevelProvider.mjs';
 import 'react-syntax-highlighter';
 import '../CopyButton/CopyButton.mjs';
 import '../ColumnLayout/ColumnLayout.mjs';
 import '../ComboBox/ComboBox.mjs';
-import '../../lib/propsContext/components/ComponentPropsContextProvider.mjs';
 import '../Content/Content.mjs';
 import '../ContextMenu/ContextMenu.mjs';
 import '../MenuItem/MenuItem.mjs';
@@ -90,6 +92,7 @@ import '../NumberField/NumberField.mjs';
 import '../Option/Option.mjs';
 import '../../views/OverlayContentView.mjs';
 import '../../views/LoadingSpinnerView.mjs';
+import '../../lib/remote/eventHandlerContext.mjs';
 import '../PasswordCreationField/PasswordCreationField.mjs';
 import '../Popover/components/PopoverTrigger/PopoverTrigger.mjs';
 import '../Popover/Popover.mjs';

package/dist/js/components/src/components/CartesianChart/CartesianChart.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CartesianChart.mjs","sources":["../../../../../../src/components/CartesianChart/CartesianChart.tsx"],"sourcesContent":["import * as Recharts from \"recharts\";\nimport React, {\n  Children,\n  useEffect,\n  useRef,\n  useState,\n  type ComponentProps,\n  type FC,\n  type PropsWithChildren,\n  type ReactElement,\n  type SVGProps,\n} from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"./CartesianChart.module.scss\";\nimport Wrap from \"../Wrap\";\nimport { CartesianGrid } from \"../public\";\n\nexport interface CartesianChartEmptyViewProps {\n  data?: ComponentProps<typeof Recharts.ComposedChart>[\"data\"];\n}\n\nexport interface CartesianChartProps\n  extends Pick<\n      ComponentProps<typeof Recharts.ComposedChart>,\n      \"data\" | \"className\" | \"syncId\" | \"syncMethod\"\n    >,\n    PropsWithChildren {\n  height?: string;\n  /** View that is provided when data is empty/undefined */\n  emptyView?: React.ComponentType<CartesianChartEmptyViewProps>;\n  /**\n   * Allow the height controlling container to set flex-grow: 1. Can only be\n   * used in combination with `height`\n   */\n  flexGrow?: boolean;\n}\n\n/** @flr-generate all */\nexport const CartesianChart: FC<CartesianChartProps> = (props) => {\n  const {\n    children,\n    data,\n    className,\n    height,\n    flexGrow,\n    emptyView: EmptyView,\n    ...rest\n  } = props;\n  const rootClassName = clsx(styles.cartesianChart, className);\n\n  const otherChildren: ReactElement[] = [];\n  const gridChildren: ReactElement[] = [];\n\n  Children.forEach(children, (child) => {\n    if (!child) return;\n    const element = child as ReactElement;\n\n    if (element.type === CartesianGrid) {\n      gridChildren.push(element);\n    } else {\n      otherChildren.push(element);\n    }\n  });\n\n  const showEmptyView = (!data || data.length === 0) && EmptyView;\n\n  const chartContainerRef = useRef<HTMLDivElement>(null);\n  const [viewDimensions, setViewDimensions] = useState<Partial<\n    SVGProps<SVGForeignObjectElement>\n  > | null>(null);\n\n  // resizing the foreignObject for the EmptyView on size changes\n  useEffect(() => {\n    if (showEmptyView) {\n      const updateDimensions = () => {\n        const svg = chartContainerRef.current?.querySelector(\n          \"svg\",\n        ) as SVGSVGElement | null;\n        if (!svg) return;\n\n        const clip = svg.querySelector(\"clipPath rect\");\n        if (clip) {\n          const x = parseFloat(clip.getAttribute(\"x\") ?? \"0\");\n          const y = parseFloat(clip.getAttribute(\"y\") ?? \"0\");\n          const width = parseFloat(clip.getAttribute(\"width\") ?? \"0\");\n          const height = parseFloat(clip.getAttribute(\"height\") ?? \"0\");\n          setViewDimensions({ x, y, width, height });\n        }\n      };\n\n      updateDimensions();\n\n      const container = chartContainerRef.current;\n      const observer = new ResizeObserver(updateDimensions);\n      if (container) observer.observe(container);\n\n      return () => {\n        observer.disconnect();\n      };\n    }\n  }, []);\n\n  return (\n    <Wrap if={height}>\n      <div\n        style={{ height, flex: flexGrow ? 1 : undefined }}\n        ref={chartContainerRef}\n      >\n        <Recharts.ResponsiveContainer>\n          <Recharts.ComposedChart\n            data={data}\n            className={rootClassName}\n            {...rest}\n          >\n            {!showEmptyView && gridChildren}\n            {otherChildren}\n            {showEmptyView && viewDimensions && (\n              <foreignObject {...viewDimensions}>\n                <div className={styles.emptyViewContainer}>\n                  <EmptyView data={data} />\n                </div>\n              </foreignObject>\n            )}\n          </Recharts.ComposedChart>\n        </Recharts.ResponsiveContainer>\n      </div>\n    </Wrap>\n  );\n};\n\nexport default CartesianChart;\n"],"names":["height"],"mappings":"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"}
+{"version":3,"file":"CartesianChart.mjs","sources":["../../../../../../src/components/CartesianChart/CartesianChart.tsx"],"sourcesContent":["import * as Recharts from \"recharts\";\nimport React, {\n  Children,\n  useEffect,\n  useRef,\n  useState,\n  type ComponentProps,\n  type FC,\n  type PropsWithChildren,\n  type ReactElement,\n  type SVGProps,\n} from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"./CartesianChart.module.scss\";\nimport Wrap from \"../Wrap\";\nimport { CartesianGrid } from \"../public\";\n\nexport interface CartesianChartEmptyViewProps {\n  data?: ComponentProps<typeof Recharts.ComposedChart>[\"data\"];\n}\n\nexport interface CartesianChartProps\n  extends Pick<\n      ComponentProps<typeof Recharts.ComposedChart>,\n      \"data\" | \"className\" | \"syncId\" | \"syncMethod\"\n    >,\n    PropsWithChildren {\n  height?: string;\n  /** View that is provided when data is empty/undefined */\n  emptyView?: React.ComponentType<CartesianChartEmptyViewProps>;\n  /**\n   * Allow the height controlling container to set flex-grow: 1. Can only be\n   * used in combination with `height`\n   */\n  flexGrow?: boolean;\n}\n\n/** @flr-generate all */\nexport const CartesianChart: FC<CartesianChartProps> = (props) => {\n  const {\n    children,\n    data,\n    className,\n    height,\n    flexGrow,\n    emptyView: EmptyView,\n    ...rest\n  } = props;\n  const rootClassName = clsx(styles.cartesianChart, className);\n\n  const otherChildren: ReactElement[] = [];\n  const gridChildren: ReactElement[] = [];\n\n  Children.forEach(children, (child) => {\n    if (!child) return;\n    const element = child as ReactElement;\n\n    if (element.type === CartesianGrid) {\n      gridChildren.push(element);\n    } else {\n      otherChildren.push(element);\n    }\n  });\n\n  const showEmptyView = (!data || data.length === 0) && EmptyView;\n\n  const chartContainerRef = useRef<HTMLDivElement>(null);\n  const [viewDimensions, setViewDimensions] = useState<Partial<\n    SVGProps<SVGForeignObjectElement>\n  > | null>(null);\n\n  // resizing the foreignObject for the EmptyView on size changes\n  useEffect(() => {\n    if (showEmptyView) {\n      const updateDimensions = () => {\n        const svg = chartContainerRef.current?.querySelector(\n          \"svg\",\n        ) as SVGSVGElement | null;\n        if (!svg) return;\n\n        const clip = svg.querySelector(\"clipPath rect\");\n        if (clip) {\n          const x = parseFloat(clip.getAttribute(\"x\") ?? \"0\");\n          const y = parseFloat(clip.getAttribute(\"y\") ?? \"0\");\n          const width = parseFloat(clip.getAttribute(\"width\") ?? \"0\");\n          const height = parseFloat(clip.getAttribute(\"height\") ?? \"0\");\n          setViewDimensions({ x, y, width, height });\n        }\n      };\n\n      updateDimensions();\n\n      const container = chartContainerRef.current;\n      const observer = new ResizeObserver(updateDimensions);\n      if (container) observer.observe(container);\n\n      return () => {\n        observer.disconnect();\n      };\n    }\n  }, []);\n\n  return (\n    <Wrap if={height}>\n      <div\n        style={{ height, flex: flexGrow ? 1 : undefined }}\n        ref={chartContainerRef}\n      >\n        <Recharts.ResponsiveContainer>\n          <Recharts.ComposedChart\n            data={data}\n            className={rootClassName}\n            {...rest}\n          >\n            {!showEmptyView && gridChildren}\n            {otherChildren}\n            {showEmptyView && viewDimensions && (\n              <foreignObject {...viewDimensions}>\n                <div className={styles.emptyViewContainer}>\n                  <EmptyView data={data} />\n                </div>\n              </foreignObject>\n            )}\n          </Recharts.ComposedChart>\n        </Recharts.ResponsiveContainer>\n      </div>\n    </Wrap>\n  );\n};\n\nexport default CartesianChart;\n"],"names":["height"],"mappings":"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"}

package/dist/js/components/src/components/Checkbox/Checkbox.mjs

@@ -15,35 +15,28 @@ import styles from './Checkbox.module.scss.mjs';
 import { useFieldComponent } from '../../lib/hooks/useFieldComponent.mjs';
 import '../../lib/propsContext/propsContext.mjs';
 import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
-import { useObjectRef } from '@react-aria/utils';
-import { useMakeFocusable } from '../../lib/hooks/dom/useMakeFocusable.mjs';
+import { useObjectRef } from 'react-aria';
 
 const Checkbox = flowComponent("Checkbox", (props) => {
-  const { children, className, ref, inputClassName, inputRef, ...rest } = props;
+  const { children, className, ref, inputClassName, ...rest } = props;
   const {
     FieldErrorView,
     FieldErrorCaptureContext,
     fieldPropsContext,
     fieldProps
   } = useFieldComponent(props);
-  const localCheckboxRef = useObjectRef(ref);
-  const localInputCheckboxRef = useObjectRef(inputRef);
-  useMakeFocusable(
-    localCheckboxRef,
-    () => localInputCheckboxRef.current?.focus()
-  );
+  const inputRef = useObjectRef(ref);
   return /* @__PURE__ */ jsxs(
     "div",
     {
       ...fieldProps,
       className: clsx(styles.checkbox, className, fieldProps.className),
-      ref: localCheckboxRef,
       children: [
         /* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsx(
           Aria.Checkbox,
           {
             ...rest,
-            inputRef: localInputCheckboxRef,
+            inputRef,
             className: clsx(inputClassName, styles.input),
             children: ({ isSelected, isIndeterminate }) => /* @__PURE__ */ jsxs(PropsContextProvider, { props: fieldPropsContext, children: [
               isSelected ? /* @__PURE__ */ jsx(IconCheckboxChecked, { className: styles.icon }) : isIndeterminate ? /* @__PURE__ */ jsx(IconCheckboxIndeterminate, { className: styles.icon }) : /* @__PURE__ */ jsx(IconCheckboxEmpty, { className: styles.icon }),

package/dist/js/components/src/components/Checkbox/Checkbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.mjs","sources":["../../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import {\n  IconCheckboxChecked,\n  IconCheckboxEmpty,\n  IconCheckboxIndeterminate,\n} from \"@/components/Icon/components/icons\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport clsx from \"clsx\";\nimport type { PropsWithChildren, RefObject } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./Checkbox.module.scss\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\n\nexport interface CheckboxProps\n  extends PropsWithChildren<Omit<Aria.CheckboxProps, \"children\">>,\n    FlowComponentProps {\n  inputClassName?: string;\n  inputRef?: RefObject<HTMLInputElement | null>;\n}\n\n/** @flr-generate all */\nexport const Checkbox = flowComponent(\"Checkbox\", (props) => {\n  const { children, className, ref, inputClassName, inputRef, ...rest } = props;\n\n  const {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    fieldPropsContext,\n    fieldProps,\n  } = useFieldComponent(props);\n\n  const localCheckboxRef = useObjectRef(ref);\n  const localInputCheckboxRef = useObjectRef(inputRef);\n  useMakeFocusable(localCheckboxRef, () =>\n    localInputCheckboxRef.current?.focus(),\n  );\n\n  return (\n    <div\n      {...fieldProps}\n      className={clsx(styles.checkbox, className, fieldProps.className)}\n      ref={localCheckboxRef}\n    >\n      <FieldErrorCaptureContext>\n        <Aria.Checkbox\n          {...rest}\n          inputRef={localInputCheckboxRef}\n          className={clsx(inputClassName, styles.input)}\n        >\n          {({ isSelected, isIndeterminate }) => (\n            <PropsContextProvider props={fieldPropsContext}>\n              {isSelected ? (\n                <IconCheckboxChecked className={styles.icon} />\n              ) : isIndeterminate ? (\n                <IconCheckboxIndeterminate className={styles.icon} />\n              ) : (\n                <IconCheckboxEmpty className={styles.icon} />\n              )}\n              {children}\n            </PropsContextProvider>\n          )}\n        </Aria.Checkbox>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </div>\n  );\n});\n\nexport default Checkbox;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAwBO,MAAM,QAAA,GAAW,aAAA,CAAc,UAAA,EAAY,CAAC,KAAA,KAAU;AAC3D,EAAA,MAAM,EAAE,UAAU,SAAA,EAAW,GAAA,EAAK,gBAAgB,QAAA,EAAU,GAAG,MAAK,GAAI,KAAA;AAExE,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,iBAAA;AAAA,IACA;AAAA,GACF,GAAI,kBAAkB,KAAK,CAAA;AAE3B,EAAA,MAAM,gBAAA,GAAmB,aAAa,GAAG,CAAA;AACzC,EAAA,MAAM,qBAAA,GAAwB,aAAa,QAAQ,CAAA;AACnD,EAAA,gBAAA;AAAA,IAAiB,gBAAA;AAAA,IAAkB,MACjC,qBAAA,CAAsB,OAAA,EAAS,KAAA;AAAM,GACvC;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,WAAW,IAAA,CAAK,MAAA,CAAO,QAAA,EAAU,SAAA,EAAW,WAAW,SAAS,CAAA;AAAA,MAChE,GAAA,EAAK,gBAAA;AAAA,MAEL,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,wBAAA,EAAA,EACC,QAAA,kBAAA,GAAA;AAAA,UAAC,IAAA,CAAK,QAAA;AAAA,UAAL;AAAA,YACE,GAAG,IAAA;AAAA,YACJ,QAAA,EAAU,qBAAA;AAAA,YACV,SAAA,EAAW,IAAA,CAAK,cAAA,EAAgB,MAAA,CAAO,KAAK,CAAA;AAAA,YAE3C,QAAA,EAAA,CAAC,EAAE,UAAA,EAAY,eAAA,uBACd,IAAA,CAAC,oBAAA,EAAA,EAAqB,OAAO,iBAAA,EAC1B,QAAA,EAAA;AAAA,cAAA,UAAA,uBACE,mBAAA,EAAA,EAAoB,SAAA,EAAW,MAAA,CAAO,IAAA,EAAM,IAC3C,eAAA,mBACF,GAAA,CAAC,yBAAA,EAAA,EAA0B,SAAA,EAAW,OAAO,IAAA,EAAM,CAAA,uBAElD,iBAAA,EAAA,EAAkB,SAAA,EAAW,OAAO,IAAA,EAAM,CAAA;AAAA,cAE5C;AAAA,aAAA,EACH;AAAA;AAAA,SAEJ,EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA;AAAA;AAAA,GAClB;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Checkbox.mjs","sources":["../../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import {\n  IconCheckboxChecked,\n  IconCheckboxEmpty,\n  IconCheckboxIndeterminate,\n} from \"@/components/Icon/components/icons\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport clsx from \"clsx\";\nimport type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./Checkbox.module.scss\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { useObjectRef } from \"react-aria\";\n\nexport interface CheckboxProps\n  extends PropsWithChildren<\n      Omit<Aria.CheckboxProps, \"children\" | \"ref\" | \"inputRef\">\n    >,\n    FlowComponentProps<HTMLInputElement> {\n  inputClassName?: string;\n}\n\n/** @flr-generate all */\nexport const Checkbox = flowComponent(\"Checkbox\", (props) => {\n  const { children, className, ref, inputClassName, ...rest } = props;\n\n  const {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    fieldPropsContext,\n    fieldProps,\n  } = useFieldComponent(props);\n\n  const inputRef = useObjectRef(ref);\n\n  return (\n    <div\n      {...fieldProps}\n      className={clsx(styles.checkbox, className, fieldProps.className)}\n    >\n      <FieldErrorCaptureContext>\n        <Aria.Checkbox\n          {...rest}\n          inputRef={inputRef}\n          className={clsx(inputClassName, styles.input)}\n        >\n          {({ isSelected, isIndeterminate }) => (\n            <PropsContextProvider props={fieldPropsContext}>\n              {isSelected ? (\n                <IconCheckboxChecked className={styles.icon} />\n              ) : isIndeterminate ? (\n                <IconCheckboxIndeterminate className={styles.icon} />\n              ) : (\n                <IconCheckboxEmpty className={styles.icon} />\n              )}\n              {children}\n            </PropsContextProvider>\n          )}\n        </Aria.Checkbox>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </div>\n  );\n});\n\nexport default Checkbox;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAwBO,MAAM,QAAA,GAAW,aAAA,CAAc,UAAA,EAAY,CAAC,KAAA,KAAU;AAC3D,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,KAAK,cAAA,EAAgB,GAAG,MAAK,GAAI,KAAA;AAE9D,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,iBAAA;AAAA,IACA;AAAA,GACF,GAAI,kBAAkB,KAAK,CAAA;AAE3B,EAAA,MAAM,QAAA,GAAW,aAAa,GAAG,CAAA;AAEjC,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,WAAW,IAAA,CAAK,MAAA,CAAO,QAAA,EAAU,SAAA,EAAW,WAAW,SAAS,CAAA;AAAA,MAEhE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,wBAAA,EAAA,EACC,QAAA,kBAAA,GAAA;AAAA,UAAC,IAAA,CAAK,QAAA;AAAA,UAAL;AAAA,YACE,GAAG,IAAA;AAAA,YACJ,QAAA;AAAA,YACA,SAAA,EAAW,IAAA,CAAK,cAAA,EAAgB,MAAA,CAAO,KAAK,CAAA;AAAA,YAE3C,QAAA,EAAA,CAAC,EAAE,UAAA,EAAY,eAAA,uBACd,IAAA,CAAC,oBAAA,EAAA,EAAqB,OAAO,iBAAA,EAC1B,QAAA,EAAA;AAAA,cAAA,UAAA,uBACE,mBAAA,EAAA,EAAoB,SAAA,EAAW,MAAA,CAAO,IAAA,EAAM,IAC3C,eAAA,mBACF,GAAA,CAAC,yBAAA,EAAA,EAA0B,SAAA,EAAW,OAAO,IAAA,EAAM,CAAA,uBAElD,iBAAA,EAAA,EAAkB,SAAA,EAAW,OAAO,IAAA,EAAM,CAAA;AAAA,cAE5C;AAAA,aAAA,EACH;AAAA;AAAA,SAEJ,EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA;AAAA;AAAA,GAClB;AAEJ,CAAC;;;;"}