@mittwald/flow-react-components 0.2.0-alpha.491 → 0.2.0-alpha.492

package/dist/js/components/src/components/List/components/Items/components/Item/hooks/useGridItemProps.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useGridItemProps.mjs","sources":["../../../../../../../../../../../src/components/List/components/Items/components/Item/hooks/useGridItemProps.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport { useEffect, useId, useRef, useState } from \"react\";\nimport { useList } from \"@/components/List\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { dynamic, PropsContextProvider } from \"@/lib/propsContext\";\nimport { AccordionButton } from \"@/components/List/components/Items/components/Item/components/AccordionButton\";\n\ninterface P extends PropsWithChildren {\n  data: never;\n}\n\nexport const useGridItemProps = (props: P) => {\n  const { data, children: childrenFromProps } = props;\n  const list = useList();\n  const itemView = list.itemView;\n  const onAction = list.onAction;\n\n  const [isExpanded, setIsExpanded] = useState(\n    itemView?.defaultExpanded?.(data) ?? false,\n  );\n  const contentElementId = useId();\n  const itemRef = useRef<HTMLDivElement>(null);\n\n  const accordion = list.accordion;\n  const children = childrenFromProps ?? itemView?.render(data);\n\n  useEffect(() => {\n    if (accordion) {\n      itemRef.current?.setAttribute(\"aria-expanded\", String(isExpanded));\n      itemRef.current?.setAttribute(\"aria-controls\", contentElementId);\n    }\n  }, [isExpanded, contentElementId, itemRef.current, accordion]);\n\n  if (!accordion) {\n    return {\n      gridItemProps: {\n        onAction: onAction\n          ? () => {\n              onAction?.(data);\n            }\n          : undefined,\n      },\n      children,\n    };\n  }\n\n  const toggleAccordion = () => {\n    setIsExpanded((current) => !current);\n    onAction?.(data);\n  };\n\n  const propsContext: PropsContext = {\n    Content: {\n      id: dynamic((p) => (p.slot === \"bottom\" ? contentElementId : undefined)),\n      wrapWith: dynamic((p) =>\n        p.slot === \"bottom\" ? (\n          <AccordionButton\n            contentElementId={contentElementId}\n            toggle={toggleAccordion}\n            isExpanded={isExpanded}\n          />\n        ) : undefined,\n      ),\n    },\n  };\n\n  return {\n    gridItemProps: {\n      ref: itemRef,\n      onAction: toggleAccordion,\n    },\n    children: (\n      <PropsContextProvider\n        props={propsContext}\n        dependencies={[contentElementId, isExpanded]}\n      >\n        {children}\n      </PropsContextProvider>\n    ),\n  };\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAWa,MAAA,gBAAA,GAAmB,CAAC,KAAa,KAAA;AAC5C,EAAA,MAAM,EAAE,IAAA,EAAM,QAAU,EAAA,iBAAA,EAAsB,GAAA,KAAA;AAC9C,EAAA,MAAM,OAAO,OAAQ,EAAA;AACrB,EAAA,MAAM,WAAW,IAAK,CAAA,QAAA;AACtB,EAAA,MAAM,WAAW,IAAK,CAAA,QAAA;AAEtB,EAAM,MAAA,CAAC,UAAY,EAAA,aAAa,CAAI,GAAA,QAAA;AAAA,IAClC,QAAA,EAAU,eAAkB,GAAA,IAAI,CAAK,IAAA;AAAA,GACvC;AACA,EAAA,MAAM,mBAAmB,KAAM,EAAA;AAC/B,EAAM,MAAA,OAAA,GAAU,OAAuB,IAAI,CAAA;AAE3C,EAAA,MAAM,YAAY,IAAK,CAAA,SAAA;AACvB,EAAA,MAAM,QAAW,GAAA,iBAAA,IAAqB,QAAU,EAAA,MAAA,CAAO,IAAI,CAAA;AAE3D,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,SAAW,EAAA;AACb,MAAA,OAAA,CAAQ,OAAS,EAAA,YAAA,CAAa,eAAiB,EAAA,MAAA,CAAO,UAAU,CAAC,CAAA;AACjE,MAAQ,OAAA,CAAA,OAAA,EAAS,YAAa,CAAA,eAAA,EAAiB,gBAAgB,CAAA;AAAA;AACjE,KACC,CAAC,UAAA,EAAY,kBAAkB,OAAQ,CAAA,OAAA,EAAS,SAAS,CAAC,CAAA;AAE7D,EAAA,IAAI,CAAC,SAAW,EAAA;AACd,IAAO,OAAA;AAAA,MACL,aAAe,EAAA;AAAA,QACb,QAAA,EAAU,WACN,MAAM;AACJ,UAAA,QAAA,GAAW,IAAI,CAAA;AAAA,SAEjB,GAAA;AAAA,OACN;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAA,MAAM,kBAAkB,MAAM;AAC5B,IAAc,aAAA,CAAA,CAAC,OAAY,KAAA,CAAC,OAAO,CAAA;AACnC,IAAA,QAAA,GAAW,IAAI,CAAA;AAAA,GACjB;AAEA,EAAA,MAAM,YAA6B,GAAA;AAAA,IACjC,OAAS,EAAA;AAAA,MACP,EAAA,EAAI,QAAQ,CAAC,CAAA,KAAO,EAAE,IAAS,KAAA,QAAA,GAAW,mBAAmB,MAAU,CAAA;AAAA,MACvE,QAAU,EAAA,OAAA;AAAA,QAAQ,CAAC,CAAA,KACjB,CAAE,CAAA,IAAA,KAAS,QACT,mBAAA,GAAA;AAAA,UAAC,eAAA;AAAA,UAAA;AAAA,YACC,gBAAA;AAAA,YACA,MAAQ,EAAA,eAAA;AAAA,YACR;AAAA;AAAA,SAEA,GAAA;AAAA;AACN;AACF,GACF;AAEA,EAAO,OAAA;AAAA,IACL,aAAe,EAAA;AAAA,MACb,GAAK,EAAA,OAAA;AAAA,MACL,QAAU,EAAA;AAAA,KACZ;AAAA,IACA,QACE,kBAAA,GAAA;AAAA,MAAC,oBAAA;AAAA,MAAA;AAAA,QACC,KAAO,EAAA,YAAA;AAAA,QACP,YAAA,EAAc,CAAC,gBAAA,EAAkB,UAAU,CAAA;AAAA,QAE1C;AAAA;AAAA;AACH,GAEJ;AACF;;;;"}
+{"version":3,"file":"useGridItemProps.mjs","sources":["../../../../../../../../../../../src/components/List/components/Items/components/Item/hooks/useGridItemProps.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport { useEffect, useId, useRef, useState } from \"react\";\nimport { useList } from \"@/components/List\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { dynamic, PropsContextProvider } from \"@/lib/propsContext\";\nimport { AccordionButton } from \"@/components/List/components/Items/components/Item/components/AccordionButton\";\n\ninterface P extends PropsWithChildren {\n  data: never;\n}\n\nexport const useGridItemProps = (props: P) => {\n  const { data, children: childrenFromProps } = props;\n  const list = useList();\n  const itemView = list.itemView;\n  const onAction = list.onAction;\n\n  const [isExpanded, setIsExpanded] = useState(\n    itemView?.defaultExpanded?.(data) ?? false,\n  );\n  const contentElementId = useId();\n  const itemRef = useRef<HTMLDivElement>(null);\n\n  const accordion = list.accordion;\n  const children = childrenFromProps ?? itemView?.render(data);\n\n  useEffect(() => {\n    if (accordion) {\n      itemRef.current?.setAttribute(\"aria-expanded\", String(isExpanded));\n      itemRef.current?.setAttribute(\"aria-controls\", contentElementId);\n    }\n  }, [isExpanded, contentElementId, itemRef.current, accordion]);\n\n  if (!accordion) {\n    return {\n      gridItemProps: {\n        onAction: onAction\n          ? () => {\n              onAction?.(data);\n            }\n          : undefined,\n      },\n      children,\n    };\n  }\n\n  const toggleAccordion = () => {\n    setIsExpanded((current) => !current);\n    onAction?.(data);\n  };\n\n  const propsContext: PropsContext = {\n    Content: {\n      id: dynamic((p) => (p.slot === \"bottom\" ? contentElementId : undefined)),\n      wrapWith: dynamic((p) =>\n        p.slot === \"bottom\" ? (\n          <AccordionButton\n            contentElementId={contentElementId}\n            toggle={toggleAccordion}\n            isExpanded={isExpanded}\n          />\n        ) : undefined,\n      ),\n    },\n  };\n\n  return {\n    gridItemProps: {\n      ref: itemRef,\n      onAction: toggleAccordion,\n    },\n    children: (\n      <PropsContextProvider\n        props={propsContext}\n        dependencies={[contentElementId, isExpanded]}\n      >\n        {children}\n      </PropsContextProvider>\n    ),\n  };\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAWa,MAAA,gBAAA,GAAmB,CAAC,KAAa,KAAA;AAC5C,EAAA,MAAM,EAAE,IAAA,EAAM,QAAU,EAAA,iBAAA,EAAsB,GAAA,KAAA;AAC9C,EAAA,MAAM,OAAO,OAAQ,EAAA;AACrB,EAAA,MAAM,WAAW,IAAK,CAAA,QAAA;AACtB,EAAA,MAAM,WAAW,IAAK,CAAA,QAAA;AAEtB,EAAM,MAAA,CAAC,UAAY,EAAA,aAAa,CAAI,GAAA,QAAA;AAAA,IAClC,QAAA,EAAU,eAAkB,GAAA,IAAI,CAAK,IAAA;AAAA,GACvC;AACA,EAAA,MAAM,mBAAmB,KAAM,EAAA;AAC/B,EAAM,MAAA,OAAA,GAAU,OAAuB,IAAI,CAAA;AAE3C,EAAA,MAAM,YAAY,IAAK,CAAA,SAAA;AACvB,EAAA,MAAM,QAAW,GAAA,iBAAA,IAAqB,QAAU,EAAA,MAAA,CAAO,IAAI,CAAA;AAE3D,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,SAAW,EAAA;AACb,MAAA,OAAA,CAAQ,OAAS,EAAA,YAAA,CAAa,eAAiB,EAAA,MAAA,CAAO,UAAU,CAAC,CAAA;AACjE,MAAQ,OAAA,CAAA,OAAA,EAAS,YAAa,CAAA,eAAA,EAAiB,gBAAgB,CAAA;AAAA;AACjE,KACC,CAAC,UAAA,EAAY,kBAAkB,OAAQ,CAAA,OAAA,EAAS,SAAS,CAAC,CAAA;AAE7D,EAAA,IAAI,CAAC,SAAW,EAAA;AACd,IAAO,OAAA;AAAA,MACL,aAAe,EAAA;AAAA,QACb,QAAA,EAAU,WACN,MAAM;AACJ,UAAA,QAAA,GAAW,IAAI,CAAA;AAAA,SAEjB,GAAA;AAAA,OACN;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAA,MAAM,kBAAkB,MAAM;AAC5B,IAAc,aAAA,CAAA,CAAC,OAAY,KAAA,CAAC,OAAO,CAAA;AACnC,IAAA,QAAA,GAAW,IAAI,CAAA;AAAA,GACjB;AAEA,EAAA,MAAM,YAA6B,GAAA;AAAA,IACjC,OAAS,EAAA;AAAA,MACP,EAAA,EAAI,QAAQ,CAAC,CAAA,KAAO,EAAE,IAAS,KAAA,QAAA,GAAW,mBAAmB,MAAU,CAAA;AAAA,MACvE,QAAU,EAAA,OAAA;AAAA,QAAQ,CAAC,CAAA,KACjB,CAAE,CAAA,IAAA,KAAS,QACT,mBAAA,GAAA;AAAA,UAAC,eAAA;AAAA,UAAA;AAAA,YACC,gBAAA;AAAA,YACA,MAAQ,EAAA,eAAA;AAAA,YACR;AAAA;AAAA,SAEA,GAAA;AAAA;AACN;AACF,GACF;AAEA,EAAO,OAAA;AAAA,IACL,aAAe,EAAA;AAAA,MACb,GAAK,EAAA,OAAA;AAAA,MACL,QAAU,EAAA;AAAA,KACZ;AAAA,IACA,QACE,kBAAA,GAAA;AAAA,MAAC,oBAAA;AAAA,MAAA;AAAA,QACC,KAAO,EAAA,YAAA;AAAA,QACP,YAAA,EAAc,CAAC,gBAAA,EAAkB,UAAU,CAAA;AAAA,QAE1C;AAAA;AAAA;AACH,GAEJ;AACF;;;;"}

package/dist/js/components/src/components/List/components/ListItemView/ListItemView.mjs

@@ -14,7 +14,7 @@ import 'react';
 import 'clsx';
 import '@tabler/icons-react';
 import '../../../Icon/Icon.mjs';
-import '../../../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../../../views/IconView.mjs';
 import '../../../Heading/Heading.mjs';
 import '../../../Text/Text.mjs';
 import 'react-aria';

package/dist/js/components/src/components/List/components/Table/Table.mjs

@@ -6,23 +6,17 @@ import 'invariant';
 import 'react-aria-components';
 import clsx from 'clsx';
 import '../../../../lib/propsContext/propsContext.mjs';
-import '../../../../lib/propsContext/inherit/propsContextLevel.mjs';
-import '@mittwald/react-tunnel';
-import '../../../../lib/slotContext/slotContext.mjs';
-import '@react-aria/utils';
-import 'remeda';
-import '../../../../lib/viewComponentContext/viewComponentContext.mjs';
-import 'dot-prop';
+import '../../../../lib/propsContext/components/PropsContextProvider.mjs';
 import '@tabler/icons-react';
 import '../../../Icon/Icon.mjs';
+import '../../../../views/IconView.mjs';
 import '../../../Heading/Heading.mjs';
 import '../../../Text/Text.mjs';
 import 'react-aria';
-import '../../../Button/Button.mjs';
-import '../../../ContextMenu/ContextMenu.mjs';
-import '../../../MenuItem/MenuItem.mjs';
-import '../../../ContextMenu/components/ContextMenuTrigger/ContextMenuTrigger.mjs';
-import '../../../ContextMenu/components/ContextMenuSection/ContextMenuSection.mjs';
+import '@mittwald/react-tunnel';
+import '../../../../views/ListItemViewContentView.mjs';
+import '../../../../views/ButtonView.mjs';
+import '../../../../views/ContextMenuTriggerView.mjs';
 import '../../../ColumnLayout/ColumnLayout.mjs';
 import '../ListSummary/ListSummary.mjs';
 import { useList } from '../../hooks/useList.mjs';

package/dist/js/components/src/components/List/components/Table/Table.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Table.mjs","sources":["../../../../../../../../src/components/List/components/Table/Table.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport { useList } from \"@/components/List\";\nimport { TableLoadingView } from \"@/components/List/components/Table/components/TableLoadingView\";\nimport styles from \"./Table.module.css\";\nimport clsx from \"clsx\";\nimport ListEmptyViewView from \"@/views/ListEmptyViewView\";\nimport TableView from \"@/views/TableView\";\nimport TableHeaderView from \"@/views/TableHeaderView\";\nimport TableBodyView from \"@/views/TableBodyView\";\nimport TableRowView from \"@/views/TableRowView\";\nimport TableCellView from \"@/views/TableCellView\";\nimport TableColumnView from \"@/views/TableColumnView\";\n\nexport const Table: FC = () => {\n  const list = useList();\n  const table = list.table;\n  const listIsEmpty = list.useIsEmpty();\n\n  const isLoading = list.loader.useIsLoading();\n  const isInitiallyLoading = list.loader.useIsInitiallyLoading();\n\n  if (!table) {\n    return null;\n  }\n\n  if (isInitiallyLoading) {\n    return <TableLoadingView {...table.componentProps} />;\n  }\n\n  if (listIsEmpty) {\n    return <ListEmptyViewView />;\n  }\n\n  const rowAction = table.list.onAction;\n\n  const tableClassName = clsx(\n    styles.table,\n    isLoading && styles.isLoading,\n    table.componentProps.className,\n  );\n\n  return (\n    <TableView\n      {...list.componentProps}\n      {...table.componentProps}\n      className={tableClassName}\n    >\n      <TableHeaderView {...table.header.componentProps}>\n        {table.header.columns.map((col, i) => (\n          <TableColumnView key={i} {...col.componentProps} />\n        ))}\n      </TableHeaderView>\n      <TableBodyView {...table.body.componentProps}>\n        {list.items.entries.map((item) => (\n          <TableRowView\n            className={(props) =>\n              clsx(\n                styles.row,\n                rowAction && styles.hasAction,\n                table.body.row.componentProps.className,\n                props.isSelected && styles.isSelected,\n              )\n            }\n            key={item.id}\n            id={item.id}\n            onAction={rowAction ? () => rowAction(item.data) : undefined}\n            {...table.body.row.componentProps}\n          >\n            {table.body.row?.cells.map((cell, i) => (\n              <TableCellView key={i} {...cell.componentProps}>\n                {cell.renderFn ? cell.renderFn(item.data, list) : undefined}\n              </TableCellView>\n            ))}\n          </TableRowView>\n        ))}\n      </TableBodyView>\n    </TableView>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcO,MAAM,QAAY,MAAM;AAC7B,EAAA,MAAM,OAAO,OAAQ,EAAA;AACrB,EAAA,MAAM,QAAQ,IAAK,CAAA,KAAA;AACnB,EAAM,MAAA,WAAA,GAAc,KAAK,UAAW,EAAA;AAEpC,EAAM,MAAA,SAAA,GAAY,IAAK,CAAA,MAAA,CAAO,YAAa,EAAA;AAC3C,EAAM,MAAA,kBAAA,GAAqB,IAAK,CAAA,MAAA,CAAO,qBAAsB,EAAA;AAE7D,EAAA,IAAI,CAAC,KAAO,EAAA;AACV,IAAO,OAAA,IAAA;AAAA;AAGT,EAAA,IAAI,kBAAoB,EAAA;AACtB,IAAA,uBAAQ,GAAA,CAAA,gBAAA,EAAA,EAAkB,GAAG,KAAA,CAAM,cAAgB,EAAA,CAAA;AAAA;AAGrD,EAAA,IAAI,WAAa,EAAA;AACf,IAAA,2BAAQ,iBAAkB,EAAA,EAAA,CAAA;AAAA;AAG5B,EAAM,MAAA,SAAA,GAAY,MAAM,IAAK,CAAA,QAAA;AAE7B,EAAA,MAAM,cAAiB,GAAA,IAAA;AAAA,IACrB,MAAO,CAAA,KAAA;AAAA,IACP,aAAa,MAAO,CAAA,SAAA;AAAA,IACpB,MAAM,cAAe,CAAA;AAAA,GACvB;AAEA,EACE,uBAAA,IAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAK,CAAA,cAAA;AAAA,MACR,GAAG,KAAM,CAAA,cAAA;AAAA,MACV,SAAW,EAAA,cAAA;AAAA,MAEX,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,mBAAiB,GAAG,KAAA,CAAM,OAAO,cAC/B,EAAA,QAAA,EAAA,KAAA,CAAM,OAAO,OAAQ,CAAA,GAAA,CAAI,CAAC,GAAK,EAAA,CAAA,yBAC7B,eAAyB,EAAA,EAAA,GAAG,IAAI,cAAX,EAAA,EAAA,CAA2B,CAClD,CACH,EAAA,CAAA;AAAA,wBACA,GAAA,CAAC,aAAe,EAAA,EAAA,GAAG,KAAM,CAAA,IAAA,CAAK,cAC3B,EAAA,QAAA,EAAA,IAAA,CAAK,KAAM,CAAA,OAAA,CAAQ,GAAI,CAAA,CAAC,IACvB,qBAAA,GAAA;AAAA,UAAC,YAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,CAAC,KACV,KAAA,IAAA;AAAA,cACE,MAAO,CAAA,GAAA;AAAA,cACP,aAAa,MAAO,CAAA,SAAA;AAAA,cACpB,KAAA,CAAM,IAAK,CAAA,GAAA,CAAI,cAAe,CAAA,SAAA;AAAA,cAC9B,KAAA,CAAM,cAAc,MAAO,CAAA;AAAA,aAC7B;AAAA,YAGF,IAAI,IAAK,CAAA,EAAA;AAAA,YACT,UAAU,SAAY,GAAA,MAAM,SAAU,CAAA,IAAA,CAAK,IAAI,CAAI,GAAA,MAAA;AAAA,YAClD,GAAG,KAAM,CAAA,IAAA,CAAK,GAAI,CAAA,cAAA;AAAA,YAElB,QAAA,EAAA,KAAA,CAAM,KAAK,GAAK,EAAA,KAAA,CAAM,IAAI,CAAC,IAAA,EAAM,CAChC,qBAAA,GAAA,CAAC,aAAuB,EAAA,EAAA,GAAG,KAAK,cAC7B,EAAA,QAAA,EAAA,IAAA,CAAK,QAAW,GAAA,IAAA,CAAK,QAAS,CAAA,IAAA,CAAK,MAAM,IAAI,CAAA,GAAI,MADhC,EAAA,EAAA,CAEpB,CACD;AAAA,WAAA;AAAA,UATI,IAAK,CAAA;AAAA,SAWb,CACH,EAAA;AAAA;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"Table.mjs","sources":["../../../../../../../../src/components/List/components/Table/Table.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport React from \"react\";\nimport { useList } from \"@/components/List\";\nimport { TableLoadingView } from \"@/components/List/components/Table/components/TableLoadingView\";\nimport styles from \"./Table.module.css\";\nimport clsx from \"clsx\";\nimport ListEmptyViewView from \"@/views/ListEmptyViewView\";\nimport TableView from \"@/views/TableView\";\nimport TableHeaderView from \"@/views/TableHeaderView\";\nimport TableBodyView from \"@/views/TableBodyView\";\nimport TableRowView from \"@/views/TableRowView\";\nimport TableCellView from \"@/views/TableCellView\";\nimport TableColumnView from \"@/views/TableColumnView\";\n\nexport const Table: FC = () => {\n  const list = useList();\n  const table = list.table;\n  const listIsEmpty = list.useIsEmpty();\n\n  const isLoading = list.loader.useIsLoading();\n  const isInitiallyLoading = list.loader.useIsInitiallyLoading();\n\n  if (!table) {\n    return null;\n  }\n\n  if (isInitiallyLoading) {\n    return <TableLoadingView {...table.componentProps} />;\n  }\n\n  if (listIsEmpty) {\n    return <ListEmptyViewView />;\n  }\n\n  const rowAction = table.list.onAction;\n\n  const tableClassName = clsx(\n    styles.table,\n    isLoading && styles.isLoading,\n    table.componentProps.className,\n  );\n\n  return (\n    <TableView\n      {...list.componentProps}\n      {...table.componentProps}\n      className={tableClassName}\n    >\n      <TableHeaderView {...table.header.componentProps}>\n        {table.header.columns.map((col, i) => (\n          <TableColumnView key={i} {...col.componentProps} />\n        ))}\n      </TableHeaderView>\n      <TableBodyView {...table.body.componentProps}>\n        {list.items.entries.map((item) => (\n          <TableRowView\n            className={(props) =>\n              clsx(\n                styles.row,\n                rowAction && styles.hasAction,\n                table.body.row.componentProps.className,\n                props.isSelected && styles.isSelected,\n              )\n            }\n            key={item.id}\n            id={item.id}\n            onAction={rowAction ? () => rowAction(item.data) : undefined}\n            {...table.body.row.componentProps}\n          >\n            {table.body.row?.cells.map((cell, i) => (\n              <TableCellView key={i} {...cell.componentProps}>\n                {cell.renderFn ? cell.renderFn(item.data, list) : undefined}\n              </TableCellView>\n            ))}\n          </TableRowView>\n        ))}\n      </TableBodyView>\n    </TableView>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcO,MAAM,QAAY,MAAM;AAC7B,EAAA,MAAM,OAAO,OAAQ,EAAA;AACrB,EAAA,MAAM,QAAQ,IAAK,CAAA,KAAA;AACnB,EAAM,MAAA,WAAA,GAAc,KAAK,UAAW,EAAA;AAEpC,EAAM,MAAA,SAAA,GAAY,IAAK,CAAA,MAAA,CAAO,YAAa,EAAA;AAC3C,EAAM,MAAA,kBAAA,GAAqB,IAAK,CAAA,MAAA,CAAO,qBAAsB,EAAA;AAE7D,EAAA,IAAI,CAAC,KAAO,EAAA;AACV,IAAO,OAAA,IAAA;AAAA;AAGT,EAAA,IAAI,kBAAoB,EAAA;AACtB,IAAA,uBAAQ,GAAA,CAAA,gBAAA,EAAA,EAAkB,GAAG,KAAA,CAAM,cAAgB,EAAA,CAAA;AAAA;AAGrD,EAAA,IAAI,WAAa,EAAA;AACf,IAAA,2BAAQ,iBAAkB,EAAA,EAAA,CAAA;AAAA;AAG5B,EAAM,MAAA,SAAA,GAAY,MAAM,IAAK,CAAA,QAAA;AAE7B,EAAA,MAAM,cAAiB,GAAA,IAAA;AAAA,IACrB,MAAO,CAAA,KAAA;AAAA,IACP,aAAa,MAAO,CAAA,SAAA;AAAA,IACpB,MAAM,cAAe,CAAA;AAAA,GACvB;AAEA,EACE,uBAAA,IAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAK,CAAA,cAAA;AAAA,MACR,GAAG,KAAM,CAAA,cAAA;AAAA,MACV,SAAW,EAAA,cAAA;AAAA,MAEX,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,mBAAiB,GAAG,KAAA,CAAM,OAAO,cAC/B,EAAA,QAAA,EAAA,KAAA,CAAM,OAAO,OAAQ,CAAA,GAAA,CAAI,CAAC,GAAK,EAAA,CAAA,yBAC7B,eAAyB,EAAA,EAAA,GAAG,IAAI,cAAX,EAAA,EAAA,CAA2B,CAClD,CACH,EAAA,CAAA;AAAA,wBACA,GAAA,CAAC,aAAe,EAAA,EAAA,GAAG,KAAM,CAAA,IAAA,CAAK,cAC3B,EAAA,QAAA,EAAA,IAAA,CAAK,KAAM,CAAA,OAAA,CAAQ,GAAI,CAAA,CAAC,IACvB,qBAAA,GAAA;AAAA,UAAC,YAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,CAAC,KACV,KAAA,IAAA;AAAA,cACE,MAAO,CAAA,GAAA;AAAA,cACP,aAAa,MAAO,CAAA,SAAA;AAAA,cACpB,KAAA,CAAM,IAAK,CAAA,GAAA,CAAI,cAAe,CAAA,SAAA;AAAA,cAC9B,KAAA,CAAM,cAAc,MAAO,CAAA;AAAA,aAC7B;AAAA,YAGF,IAAI,IAAK,CAAA,EAAA;AAAA,YACT,UAAU,SAAY,GAAA,MAAM,SAAU,CAAA,IAAA,CAAK,IAAI,CAAI,GAAA,MAAA;AAAA,YAClD,GAAG,KAAM,CAAA,IAAA,CAAK,GAAI,CAAA,cAAA;AAAA,YAElB,QAAA,EAAA,KAAA,CAAM,KAAK,GAAK,EAAA,KAAA,CAAM,IAAI,CAAC,IAAA,EAAM,CAChC,qBAAA,GAAA,CAAC,aAAuB,EAAA,EAAA,GAAG,KAAK,cAC7B,EAAA,QAAA,EAAA,IAAA,CAAK,QAAW,GAAA,IAAA,CAAK,QAAS,CAAA,IAAA,CAAK,MAAM,IAAI,CAAA,GAAI,MADhC,EAAA,EAAA,CAEpB,CACD;AAAA,WAAA;AAAA,UATI,IAAK,CAAA;AAAA,SAWb,CACH,EAAA;AAAA;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/js/components/src/components/List/hooks/useAriaAnnounceSearchState.mjs

@@ -8,16 +8,12 @@ import 'react/jsx-runtime';
 import { useEffect } from 'react';
 import 'clsx';
 import '../../../lib/propsContext/propsContext.mjs';
-import '../../../lib/propsContext/inherit/propsContextLevel.mjs';
-import '@mittwald/react-tunnel';
-import '../../../lib/slotContext/slotContext.mjs';
-import '@react-aria/utils';
-import 'remeda';
-import '../../../lib/viewComponentContext/viewComponentContext.mjs';
-import 'dot-prop';
+import '../../../lib/propsContext/components/PropsContextProvider.mjs';
 import '../../Button/Button.mjs';
 import '@tabler/icons-react';
 import '../../Icon/Icon.mjs';
+import '../../../views/IconView.mjs';
+import '@mittwald/react-tunnel';
 import '../../SuspenseTrigger/SuspenseTrigger.mjs';
 import '../../Action/Action.mjs';
 import '../../ActionGroup/ActionGroup.mjs';
@@ -30,12 +26,19 @@ import '../../Badge/Badge.mjs';
 import 'react-aria-components';
 import 'mobx';
 import '../../../lib/controller/overlay/context.mjs';
+import '@react-aria/utils';
+import 'remeda';
+import '../../../lib/slotContext/SlotContextProvider.mjs';
+import '../../../lib/propsContext/components/ComponentPropsContextProvider.mjs';
+import '../../../views/ComponentPropsContextProviderView.mjs';
+import '../../../lib/viewComponentContext/viewComponentContext.mjs';
 import 'recharts';
 import '../../Heading/Heading.mjs';
 import '../../Text/Text.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';
@@ -63,9 +66,13 @@ import '../../Initials/Initials.mjs';
 import '../../Label/Label.mjs';
 import '../../LayoutCard/LayoutCard.mjs';
 import '../../OverlayTrigger/components/MenuTrigger/MenuTrigger.mjs';
+import '../../../views/DialogTriggerView.mjs';
 import '../../LightBox/LightBox.mjs';
 import '../../Link/Link.mjs';
 import 'invariant';
+import '../../../views/ListItemViewContentView.mjs';
+import '../../../views/ButtonView.mjs';
+import '../../../views/ContextMenuTriggerView.mjs';
 import '../components/ListSummary/ListSummary.mjs';
 import { useList } from './useList.mjs';
 import '../List.mjs';
@@ -81,6 +88,8 @@ import '../../NotificationProvider/NotificationProvider.mjs';
 import 'luxon';
 import '../../NumberField/NumberField.mjs';
 import '../../Option/Option.mjs';
+import '../../../views/OverlayContentView.mjs';
+import '../../../views/ClearPropsContextView.mjs';
 import '../../PasswordCreationField/PasswordCreationField.mjs';
 import '../../Popover/components/PopoverTrigger/PopoverTrigger.mjs';
 import '../../Popover/Popover.mjs';

package/dist/js/components/src/components/List/hooks/useAriaAnnounceSearchState.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useAriaAnnounceSearchState.mjs","sources":["../../../../../../../src/components/List/hooks/useAriaAnnounceSearchState.ts"],"sourcesContent":["import { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"../locales/*.locale.json\";\nimport { announce } from \"@react-aria/live-announcer\";\nimport { useList } from \"@/index/default\";\nimport { useDebounceCallback } from \"usehooks-ts\";\nimport { useEffect } from \"react\";\n\nconst announceDebounceMs = 600;\n\nexport const useAriaAnnounceSearchState = (): void => {\n  const formatter = useLocalizedStringFormatter(locales);\n  const list = useList();\n  const debouncedAnnounce = useDebounceCallback(announce, announceDebounceMs);\n\n  const searchTerm = list.search?.value;\n  const resultCount = list.batches.getTotalItemsCount();\n  const isLoading = list.loader.loaderState.useIsLoading();\n\n  useEffect(() => {\n    if (isLoading || !searchTerm) {\n      debouncedAnnounce.cancel();\n      return;\n    }\n\n    const text = formatter.format(\n      resultCount > 0\n        ? \"list.search.announce.result\"\n        : \"list.search.announce.noResult\",\n      {\n        resultCount,\n        searchTerm,\n      },\n    );\n\n    debouncedAnnounce(text, \"polite\");\n  }, [searchTerm, resultCount, isLoading]);\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,kBAAqB,GAAA,GAAA;AAEpB,MAAM,6BAA6B,MAAY;AACpD,EAAM,MAAA,SAAA,GAAY,4BAA4B,OAAO,CAAA;AACrD,EAAA,MAAM,OAAO,OAAQ,EAAA;AACrB,EAAM,MAAA,iBAAA,GAAoB,mBAAoB,CAAA,QAAA,EAAU,kBAAkB,CAAA;AAE1E,EAAM,MAAA,UAAA,GAAa,KAAK,MAAQ,EAAA,KAAA;AAChC,EAAM,MAAA,WAAA,GAAc,IAAK,CAAA,OAAA,CAAQ,kBAAmB,EAAA;AACpD,EAAA,MAAM,SAAY,GAAA,IAAA,CAAK,MAAO,CAAA,WAAA,CAAY,YAAa,EAAA;AAEvD,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,SAAA,IAAa,CAAC,UAAY,EAAA;AAC5B,MAAA,iBAAA,CAAkB,MAAO,EAAA;AACzB,MAAA;AAAA;AAGF,IAAA,MAAM,OAAO,SAAU,CAAA,MAAA;AAAA,MACrB,WAAA,GAAc,IACV,6BACA,GAAA,+BAAA;AAAA,MACJ;AAAA,QACE,WAAA;AAAA,QACA;AAAA;AACF,KACF;AAEA,IAAA,iBAAA,CAAkB,MAAM,QAAQ,CAAA;AAAA,GAC/B,EAAA,CAAC,UAAY,EAAA,WAAA,EAAa,SAAS,CAAC,CAAA;AACzC;;;;"}
+{"version":3,"file":"useAriaAnnounceSearchState.mjs","sources":["../../../../../../../src/components/List/hooks/useAriaAnnounceSearchState.ts"],"sourcesContent":["import { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"../locales/*.locale.json\";\nimport { announce } from \"@react-aria/live-announcer\";\nimport { useList } from \"@/index/default\";\nimport { useDebounceCallback } from \"usehooks-ts\";\nimport { useEffect } from \"react\";\n\nconst announceDebounceMs = 600;\n\nexport const useAriaAnnounceSearchState = (): void => {\n  const formatter = useLocalizedStringFormatter(locales);\n  const list = useList();\n  const debouncedAnnounce = useDebounceCallback(announce, announceDebounceMs);\n\n  const searchTerm = list.search?.value;\n  const resultCount = list.batches.getTotalItemsCount();\n  const isLoading = list.loader.loaderState.useIsLoading();\n\n  useEffect(() => {\n    if (isLoading || !searchTerm) {\n      debouncedAnnounce.cancel();\n      return;\n    }\n\n    const text = formatter.format(\n      resultCount > 0\n        ? \"list.search.announce.result\"\n        : \"list.search.announce.noResult\",\n      {\n        resultCount,\n        searchTerm,\n      },\n    );\n\n    debouncedAnnounce(text, \"polite\");\n  }, [searchTerm, resultCount, isLoading]);\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,kBAAqB,GAAA,GAAA;AAEpB,MAAM,6BAA6B,MAAY;AACpD,EAAM,MAAA,SAAA,GAAY,4BAA4B,OAAO,CAAA;AACrD,EAAA,MAAM,OAAO,OAAQ,EAAA;AACrB,EAAM,MAAA,iBAAA,GAAoB,mBAAoB,CAAA,QAAA,EAAU,kBAAkB,CAAA;AAE1E,EAAM,MAAA,UAAA,GAAa,KAAK,MAAQ,EAAA,KAAA;AAChC,EAAM,MAAA,WAAA,GAAc,IAAK,CAAA,OAAA,CAAQ,kBAAmB,EAAA;AACpD,EAAA,MAAM,SAAY,GAAA,IAAA,CAAK,MAAO,CAAA,WAAA,CAAY,YAAa,EAAA;AAEvD,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,SAAA,IAAa,CAAC,UAAY,EAAA;AAC5B,MAAA,iBAAA,CAAkB,MAAO,EAAA;AACzB,MAAA;AAAA;AAGF,IAAA,MAAM,OAAO,SAAU,CAAA,MAAA;AAAA,MACrB,WAAA,GAAc,IACV,6BACA,GAAA,+BAAA;AAAA,MACJ;AAAA,QACE,WAAA;AAAA,QACA;AAAA;AACF,KACF;AAEA,IAAA,iBAAA,CAAkB,MAAM,QAAQ,CAAA;AAAA,GAC/B,EAAA,CAAC,UAAY,EAAA,WAAA,EAAa,SAAS,CAAC,CAAA;AACzC;;;;"}

package/dist/js/components/src/components/List/views/EmptyView/EmptyView.mjs

@@ -5,7 +5,7 @@ import 'react';
 import { IllustratedMessage } from '../../../IllustratedMessage/IllustratedMessage.mjs';
 import '@tabler/icons-react';
 import '../../../Icon/Icon.mjs';
-import '../../../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../../../views/IconView.mjs';
 import { IconSearch } from '../../../Icon/components/icons/IconSearch.mjs';
 import { Heading } from '../../../Heading/Heading.mjs';
 import { Text } from '../../../Text/Text.mjs';

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

@@ -4,7 +4,7 @@ import { jsx } from 'react/jsx-runtime';
 import 'react';
 import '@tabler/icons-react';
 import '../Icon/Icon.mjs';
-import '../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../views/IconView.mjs';
 import { IconPending } from '../Icon/components/icons/IconPending.mjs';
 import styles from './LoadingSpinner.module.scss.mjs';
 import clsx from 'clsx';

package/dist/js/components/src/components/MarkdownEditor/components/Toolbar.mjs

@@ -5,7 +5,7 @@ import 'react';
 import styles from '../MarkdownEditor.module.scss.mjs';
 import { Icon } from '../../Icon/Icon.mjs';
 import { IconBold, IconItalic, IconStrikethrough, IconQuoteFilled, IconList, IconListNumbers } from '@tabler/icons-react';
-import '../../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../../views/IconView.mjs';
 import { IconCode } from '../../Icon/components/icons/IconCode.mjs';
 import { IconLink } from '../../Icon/components/icons/IconLink.mjs';
 import { ToolbarButton } from './ToolbarButton.mjs';

package/dist/js/components/src/components/MenuItem/components/MenuItemContent/MenuItemContent.mjs

@@ -7,7 +7,7 @@ import { PropsContextProvider } from '../../../../lib/propsContext/components/Pr
 import 'react';
 import '@tabler/icons-react';
 import '../../../Icon/Icon.mjs';
-import '../../../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../../../views/IconView.mjs';
 import { IconCheckboxChecked } from '../../../Icon/components/icons/IconCheckboxChecked.mjs';
 import { IconCheckboxEmpty } from '../../../Icon/components/icons/IconCheckboxEmpty.mjs';
 import { IconRadioOff } from '../../../Icon/components/icons/IconRadioOff.mjs';

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

@@ -6,7 +6,7 @@ import styles from './Message.module.scss.mjs';
 import 'react';
 import '@tabler/icons-react';
 import '../Icon/Icon.mjs';
-import '../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../views/IconView.mjs';
 import { IconContextMenu } from '../Icon/components/icons/IconContextMenu.mjs';
 import '../../lib/propsContext/propsContext.mjs';
 import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';

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

@@ -12,7 +12,7 @@ import { Action } from '../Action/Action.mjs';
 import 'react';
 import '@tabler/icons-react';
 import '../Icon/Icon.mjs';
-import '../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../views/IconView.mjs';
 import { IconClose } from '../Icon/components/icons/IconClose.mjs';
 import ButtonView from '../../views/ButtonView.mjs';
 

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

@@ -6,7 +6,7 @@ import { Button } from '../Button/Button.mjs';
 import 'react';
 import '@tabler/icons-react';
 import '../Icon/Icon.mjs';
-import '../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../views/IconView.mjs';
 import { IconClose } from '../Icon/components/icons/IconClose.mjs';
 import { Link } from '../Link/Link.mjs';
 import { dynamic } from '../../lib/propsContext/dynamicProps/dynamic.mjs';

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

@@ -12,7 +12,7 @@ import { Button } from '../Button/Button.mjs';
 import 'react';
 import '@tabler/icons-react';
 import '../Icon/Icon.mjs';
-import '../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../views/IconView.mjs';
 import { IconChevronDown } from '../Icon/components/icons/IconChevronDown.mjs';
 import { IconChevronUp } from '../Icon/components/icons/IconChevronUp.mjs';
 import { IconMinus } from '../Icon/components/icons/IconMinus.mjs';

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

@@ -8,10 +8,7 @@ import clsx from 'clsx';
 import styles from './Options.module.scss.mjs';
 import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
 import '../../lib/propsContext/propsContext.mjs';
-import '../../lib/propsContext/inherit/propsContextLevel.mjs';
-import '@react-aria/utils';
-import 'remeda';
-import 'dot-prop';
+import '../../lib/propsContext/components/PropsContextProvider.mjs';
 import '../../lib/viewComponentContext/viewComponentContext.mjs';
 
 const Options = flowComponent("Options", (props) => {

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

@@ -1 +1 @@
-{"version":3,"file":"Options.mjs","sources":["../../../../../../src/components/Options/Options.tsx"],"sourcesContent":["import { type FC } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport { Popover, type PopoverProps } from \"@/components/Popover/Popover\";\nimport clsx from \"clsx\";\nimport styles from \"./Options.module.scss\";\nimport type { OverlayController } from \"@/lib/controller\";\nimport type { OptionProps } from \"@/components/Option\";\nimport { flowComponent } from \"@/index/internal\";\n\nexport interface OptionsProps\n  extends Pick<Aria.ListBoxProps<OptionProps>, \"renderEmptyState\" | \"onAction\">,\n    PopoverProps {\n  controller: OverlayController;\n}\n\nexport const Options: FC<OptionsProps> = flowComponent(\"Options\", (props) => {\n  const {\n    className,\n    children,\n    controller,\n    renderEmptyState,\n    onAction,\n    ...restPopoverProps\n  } = props;\n\n  const rootClassName = clsx(styles.options, className);\n\n  return (\n    <Popover\n      className={styles.popover}\n      controller={controller}\n      {...restPopoverProps}\n    >\n      <Aria.ListBox\n        onAction={onAction}\n        className={rootClassName}\n        renderEmptyState={renderEmptyState}\n      >\n        {children}\n      </Aria.ListBox>\n    </Popover>\n  );\n});\n\nexport default Options;\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAeO,MAAM,OAA4B,GAAA,aAAA,CAAc,SAAW,EAAA,CAAC,KAAU,KAAA;AAC3E,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,gBAAA;AAAA,IACA,QAAA;AAAA,IACA,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EAAA,MAAM,aAAgB,GAAA,IAAA,CAAK,MAAO,CAAA,OAAA,EAAS,SAAS,CAAA;AAEpD,EACE,uBAAA,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,WAAW,MAAO,CAAA,OAAA;AAAA,MAClB,UAAA;AAAA,MACC,GAAG,gBAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAAC,IAAK,CAAA,OAAA;AAAA,QAAL;AAAA,UACC,QAAA;AAAA,UACA,SAAW,EAAA,aAAA;AAAA,UACX,gBAAA;AAAA,UAEC;AAAA;AAAA;AACH;AAAA,GACF;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Options.mjs","sources":["../../../../../../src/components/Options/Options.tsx"],"sourcesContent":["import { type FC } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport { Popover, type PopoverProps } from \"@/components/Popover/Popover\";\nimport clsx from \"clsx\";\nimport styles from \"./Options.module.scss\";\nimport type { OverlayController } from \"@/lib/controller\";\nimport type { OptionProps } from \"@/components/Option\";\nimport { flowComponent } from \"@/index/internal\";\n\nexport interface OptionsProps\n  extends Pick<Aria.ListBoxProps<OptionProps>, \"renderEmptyState\" | \"onAction\">,\n    PopoverProps {\n  controller: OverlayController;\n}\n\nexport const Options: FC<OptionsProps> = flowComponent(\"Options\", (props) => {\n  const {\n    className,\n    children,\n    controller,\n    renderEmptyState,\n    onAction,\n    ...restPopoverProps\n  } = props;\n\n  const rootClassName = clsx(styles.options, className);\n\n  return (\n    <Popover\n      className={styles.popover}\n      controller={controller}\n      {...restPopoverProps}\n    >\n      <Aria.ListBox\n        onAction={onAction}\n        className={rootClassName}\n        renderEmptyState={renderEmptyState}\n      >\n        {children}\n      </Aria.ListBox>\n    </Popover>\n  );\n});\n\nexport default Options;\n"],"names":[],"mappings":";;;;;;;;;;;AAeO,MAAM,OAA4B,GAAA,aAAA,CAAc,SAAW,EAAA,CAAC,KAAU,KAAA;AAC3E,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,gBAAA;AAAA,IACA,QAAA;AAAA,IACA,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EAAA,MAAM,aAAgB,GAAA,IAAA,CAAK,MAAO,CAAA,OAAA,EAAS,SAAS,CAAA;AAEpD,EACE,uBAAA,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,WAAW,MAAO,CAAA,OAAA;AAAA,MAClB,UAAA;AAAA,MACC,GAAG,gBAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAAC,IAAK,CAAA,OAAA;AAAA,QAAL;AAAA,UACC,QAAA;AAAA,UACA,SAAW,EAAA,aAAA;AAAA,UACX,gBAAA;AAAA,UAEC;AAAA;AAAA;AACH;AAAA,GACF;AAEJ,CAAC;;;;"}

package/dist/js/components/src/components/OverlayTrigger/components/MenuTrigger/MenuTrigger.mjs

@@ -5,10 +5,7 @@ import * as Aria from 'react-aria-components';
 import 'react';
 import { flowComponent } from '../../../../lib/componentFactory/flowComponent.mjs';
 import '../../../../lib/propsContext/propsContext.mjs';
-import '../../../../lib/propsContext/inherit/propsContextLevel.mjs';
-import '@react-aria/utils';
-import 'remeda';
-import 'dot-prop';
+import '../../../../lib/propsContext/components/PropsContextProvider.mjs';
 import '../../../../lib/viewComponentContext/viewComponentContext.mjs';
 
 const MenuTrigger = flowComponent(

package/dist/js/components/src/components/OverlayTrigger/components/MenuTrigger/MenuTrigger.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MenuTrigger.mjs","sources":["../../../../../../../../src/components/OverlayTrigger/components/MenuTrigger/MenuTrigger.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { ComponentProps, FC } from \"react\";\nimport { flowComponent, type FlowComponentProps } from \"@/index/internal\";\n\nexport type MenuTriggerProps = ComponentProps<typeof Aria.MenuTrigger> &\n  FlowComponentProps;\n\n/** @flr-generate all */\nexport const MenuTrigger: FC<MenuTriggerProps> = flowComponent(\n  \"MenuTrigger\",\n  (props) => {\n    return <Aria.MenuTrigger {...props} />;\n  },\n  { type: \"provider\" },\n);\n\nexport default MenuTrigger;\n"],"names":[],"mappings":";;;;;;;;;;;AAQO,MAAM,WAAoC,GAAA,aAAA;AAAA,EAC/C,aAAA;AAAA,EACA,CAAC,KAAU,KAAA;AACT,IAAA,uBAAQ,GAAA,CAAA,IAAA,CAAK,WAAL,EAAA,EAAkB,GAAG,KAAO,EAAA,CAAA;AAAA,GACtC;AAAA,EACA,EAAE,MAAM,UAAW;AACrB;;;;"}
+{"version":3,"file":"MenuTrigger.mjs","sources":["../../../../../../../../src/components/OverlayTrigger/components/MenuTrigger/MenuTrigger.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { ComponentProps, FC } from \"react\";\nimport { flowComponent, type FlowComponentProps } from \"@/index/internal\";\n\nexport type MenuTriggerProps = ComponentProps<typeof Aria.MenuTrigger> &\n  FlowComponentProps;\n\n/** @flr-generate all */\nexport const MenuTrigger: FC<MenuTriggerProps> = flowComponent(\n  \"MenuTrigger\",\n  (props) => {\n    return <Aria.MenuTrigger {...props} />;\n  },\n  { type: \"provider\" },\n);\n\nexport default MenuTrigger;\n"],"names":[],"mappings":";;;;;;;;AAQO,MAAM,WAAoC,GAAA,aAAA;AAAA,EAC/C,aAAA;AAAA,EACA,CAAC,KAAU,KAAA;AACT,IAAA,uBAAQ,GAAA,CAAA,IAAA,CAAK,WAAL,EAAA,EAAkB,GAAG,KAAO,EAAA,CAAA;AAAA,GACtC;AAAA,EACA,EAAE,MAAM,UAAW;AACrB;;;;"}

package/dist/js/components/src/components/PasswordCreationField/components/TogglePasswordVisibilityButton/TogglePasswordVisibilityButton.mjs

@@ -7,7 +7,7 @@ import { Tooltip } from '../../../Tooltip/Tooltip.mjs';
 import { Button } from '../../../Button/Button.mjs';
 import '@tabler/icons-react';
 import '../../../Icon/Icon.mjs';
-import '../../../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../../../views/IconView.mjs';
 import { IconHide } from '../../../Icon/components/icons/IconHide.mjs';
 import { IconShow } from '../../../Icon/components/icons/IconShow.mjs';
 import { Action } from '../../../Action/Action.mjs';

package/dist/js/components/src/components/RadioGroup/components/Radio/Radio.mjs

@@ -7,7 +7,7 @@ import clsx from 'clsx';
 import 'react';
 import '@tabler/icons-react';
 import '../../../Icon/Icon.mjs';
-import '../../../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../../../views/IconView.mjs';
 import { IconRadioOff } from '../../../Icon/components/icons/IconRadioOff.mjs';
 import { IconRadioOn } from '../../../Icon/components/icons/IconRadioOn.mjs';
 import { flowComponent } from '../../../../lib/componentFactory/flowComponent.mjs';

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

@@ -4,7 +4,7 @@ import { jsx } from 'react/jsx-runtime';
 import 'react';
 import '@tabler/icons-react';
 import '../Icon/Icon.mjs';
-import '../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../views/IconView.mjs';
 import { IconStar } from '../Icon/components/icons/IconStar.mjs';
 import { IconStarFilled } from '../Icon/components/icons/IconStarFilled.mjs';
 import styles from './Rating.module.scss.mjs';

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

@@ -13,7 +13,7 @@ import { Button } from '../Button/Button.mjs';
 import 'react';
 import '@tabler/icons-react';
 import '../Icon/Icon.mjs';
-import '../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../views/IconView.mjs';
 import { IconClose } from '../Icon/components/icons/IconClose.mjs';
 import { IconSearch } from '../Icon/components/icons/IconSearch.mjs';
 import locales from '../../../../_virtual/_.locale.json@e940efc6da10fdf09417eb079b65a343.mjs';

package/dist/js/components/src/components/SegmentedControl/components/Segment/Segment.mjs

@@ -7,7 +7,7 @@ import clsx from 'clsx';
 import 'react';
 import '@tabler/icons-react';
 import '../../../Icon/Icon.mjs';
-import '../../../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../../../views/IconView.mjs';
 import { IconCheck } from '../../../Icon/components/icons/IconCheck.mjs';
 import { flowComponent } from '../../../../lib/componentFactory/flowComponent.mjs';
 

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

@@ -11,7 +11,7 @@ import clsx from 'clsx';
 import 'react';
 import '@tabler/icons-react';
 import '../Icon/Icon.mjs';
-import '../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../views/IconView.mjs';
 import { IconChevronDown } from '../Icon/components/icons/IconChevronDown.mjs';
 import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
 import { Options } from '../Options/Options.mjs';

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

@@ -11,7 +11,7 @@ import { Button } from '../Button/Button.mjs';
 import 'react';
 import '@tabler/icons-react';
 import '../Icon/Icon.mjs';
-import '../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../views/IconView.mjs';
 import { IconMinus } from '../Icon/components/icons/IconMinus.mjs';
 import { IconPlus } from '../Icon/components/icons/IconPlus.mjs';
 import locales from '../../../../_virtual/_.locale.json@3ed2dc50f997451bdd85a713c54e1025.mjs';

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

@@ -7,7 +7,7 @@ import clsx from 'clsx';
 import 'react';
 import '@tabler/icons-react';
 import '../Icon/Icon.mjs';
-import '../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../views/IconView.mjs';
 import { IconCheck } from '../Icon/components/icons/IconCheck.mjs';
 import { IconClose } from '../Icon/components/icons/IconClose.mjs';
 import { Label } from '../Label/Label.mjs';

package/dist/js/components/src/components/Tabs/components/TabList/TabList.mjs

@@ -9,7 +9,7 @@ import { useObserveOverflow } from '../../../../lib/hooks/dom/useObserveOverflow
 import { Button } from '../../../Button/Button.mjs';
 import '@tabler/icons-react';
 import '../../../Icon/Icon.mjs';
-import '../../../../lib/viewComponentContext/viewComponentContext.mjs';
+import '../../../../views/IconView.mjs';
 import { IconContextMenu } from '../../../Icon/components/icons/IconContextMenu.mjs';
 import clsx from 'clsx';
 import { TabTitleCollapsed } from '../TabTitle/TabTitleCollapsed.mjs';

package/dist/js/components/src/integrations/react-hook-form/components/Field/Field.mjs

@@ -5,7 +5,7 @@ import { useFormContext } from '../context/formContext.mjs';
 import { dynamic } from '../../../../lib/propsContext/dynamicProps/dynamic.mjs';
 import '../../../../lib/propsContext/propsContext.mjs';
 import { PropsContextProvider } from '../../../../lib/propsContext/components/PropsContextProvider.mjs';
-import { useController } from 'react-hook-form';
+import { useController, useWatch } from 'react-hook-form';
 import FieldErrorView from '../../../../views/FieldErrorView.mjs';
 import { useLocalizedStringFormatter } from 'react-aria';
 import locales from '../../../../../../_virtual/_.locale.json@72ba2ce40f190df671686fec50c04ddf.mjs';
@@ -33,7 +33,10 @@ function Field(props) {
     }
   });
   const formContext = useFormContext();
-  const value = formContext.form.watch(name) ?? controller.field.value;
+  const value = useWatch({
+    control: formContext.form.control,
+    name
+  }) ?? controller.field.value;
   const fieldProps = {
     ...inheritProps,
     ...controller.field,

package/dist/js/components/src/integrations/react-hook-form/components/Field/Field.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Field.mjs","sources":["../../../../../../../../src/integrations/react-hook-form/components/Field/Field.tsx"],"sourcesContent":["import { useFormContext } from \"@/integrations/react-hook-form/components/context/formContext\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { dynamic, PropsContextProvider } from \"@/lib/propsContext\";\nimport type { PropsWithChildren } from \"react\";\nimport {\n  type ControllerProps,\n  type FieldValues,\n  useController,\n  type UseFormReturn,\n} from \"react-hook-form\";\nimport FieldErrorView from \"@/views/FieldErrorView\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"./locales/*.locale.json\";\nimport { inheritProps } from \"@/lib/propsContext/inherit/types\";\n\nexport interface FieldProps<T extends FieldValues>\n  extends Omit<ControllerProps<T>, \"render\">,\n    PropsWithChildren {}\n\nexport function Field<T extends FieldValues>(props: FieldProps<T>) {\n  const { children, name, defaultValue, ...rest } = props;\n\n  const stringFormatter = useLocalizedStringFormatter(locales);\n\n  const controller = useController({\n    ...props,\n    rules: {\n      ...props.rules,\n      minLength:\n        typeof rest.rules?.minLength === \"number\"\n          ? {\n              value: rest.rules.minLength,\n              message: stringFormatter.format(\"minLength\", {\n                number: rest.rules.minLength,\n              }),\n            }\n          : rest.rules?.minLength,\n      maxLength:\n        typeof rest.rules?.maxLength === \"number\"\n          ? {\n              value: rest.rules.maxLength,\n              message: stringFormatter.format(\"maxLength\", {\n                number: rest.rules.maxLength,\n              }),\n            }\n          : rest.rules?.maxLength,\n    },\n  });\n  const formContext = useFormContext<T>();\n  /**\n   * We don't use controller.field.value here, because it doesn't update when\n   * the form value is updated outside of this field (e.g. when setting values\n   * with form.setValue or resetting the form), and the Field unmounts in\n   * between. This is generally a feature of React Hook Form, but this breaks\n   * dynamic forms where fields are conditionally rendered.\n   *\n   * By using formContext.form.watch(name), we ensure that the field value is\n   * always in sync with the form state. See:\n   * https://react-hook-form.com/api/usecontroller/controller/\n   */\n  const value = formContext.form.watch(name) ?? controller.field.value;\n\n  const fieldProps = {\n    ...inheritProps,\n    ...controller.field,\n    value,\n    name,\n    form: formContext.id,\n    isRequired: !!rest.rules?.required,\n    validationBehavior: \"aria\" as const,\n    defaultValue,\n    isInvalid: controller.fieldState.invalid,\n    children: dynamic((p) => {\n      if (controller.fieldState.invalid) {\n        return (\n          <>\n            {p.children}\n            <FieldErrorView>\n              {controller.fieldState.error?.message}\n            </FieldErrorView>\n          </>\n        );\n      }\n\n      return p.children;\n    }),\n  };\n\n  const { value: ignoredValue, ...fieldPropsWithoutValue } = fieldProps;\n\n  const propsContext: PropsContext = {\n    SearchField: fieldProps,\n    TextField: fieldProps,\n    TextArea: fieldProps,\n    MarkdownEditor: fieldProps,\n    Checkbox: {\n      ...fieldProps,\n      isSelected: value,\n    },\n    CheckboxGroup: fieldProps,\n    CheckboxButton: {\n      ...fieldProps,\n      isSelected: value,\n    },\n    FileField: fieldProps,\n    FileDropZone: fieldProps,\n    NumberField: fieldProps,\n    RadioGroup: fieldProps,\n    Switch: {\n      ...fieldProps,\n      isSelected: value,\n    },\n    Slider: fieldProps,\n    PasswordCreationField: fieldProps,\n    DatePicker: fieldProps,\n    DateRangePicker: fieldProps,\n    TimeField: fieldProps,\n    SegmentedControl: fieldProps,\n    Select: {\n      ...fieldProps,\n      selectedKey: value,\n    },\n    ComboBox: {\n      ...fieldPropsWithoutValue,\n      selectedKey: value,\n    },\n  };\n\n  return (\n    <PropsContextProvider\n      props={propsContext}\n      dependencies={[controller.fieldState, controller.field, value]}\n    >\n      {children}\n    </PropsContextProvider>\n  );\n}\n\nexport const typedField = <T extends FieldValues>(\n  ignoredForm: UseFormReturn<T> | UseFormReturn<T>[\"control\"],\n): typeof Field<T> => Field;\n\nexport default Field;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Field.mjs","sources":["../../../../../../../../src/integrations/react-hook-form/components/Field/Field.tsx"],"sourcesContent":["import { useFormContext } from \"@/integrations/react-hook-form/components/context/formContext\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { dynamic, PropsContextProvider } from \"@/lib/propsContext\";\nimport type { PropsWithChildren } from \"react\";\nimport {\n  type ControllerProps,\n  type FieldValues,\n  useController,\n  type UseFormReturn,\n  useWatch,\n} from \"react-hook-form\";\nimport FieldErrorView from \"@/views/FieldErrorView\";\nimport { useLocalizedStringFormatter } from \"react-aria\";\nimport locales from \"./locales/*.locale.json\";\nimport { inheritProps } from \"@/lib/propsContext/inherit/types\";\n\nexport interface FieldProps<T extends FieldValues>\n  extends Omit<ControllerProps<T>, \"render\">,\n    PropsWithChildren {}\n\nexport function Field<T extends FieldValues>(props: FieldProps<T>) {\n  const { children, name, defaultValue, ...rest } = props;\n\n  const stringFormatter = useLocalizedStringFormatter(locales);\n\n  const controller = useController({\n    ...props,\n    rules: {\n      ...props.rules,\n      minLength:\n        typeof rest.rules?.minLength === \"number\"\n          ? {\n              value: rest.rules.minLength,\n              message: stringFormatter.format(\"minLength\", {\n                number: rest.rules.minLength,\n              }),\n            }\n          : rest.rules?.minLength,\n      maxLength:\n        typeof rest.rules?.maxLength === \"number\"\n          ? {\n              value: rest.rules.maxLength,\n              message: stringFormatter.format(\"maxLength\", {\n                number: rest.rules.maxLength,\n              }),\n            }\n          : rest.rules?.maxLength,\n    },\n  });\n  const formContext = useFormContext<T>();\n  /**\n   * We don't use controller.field.value here, because it doesn't update when\n   * the form value is updated outside of this field (e.g. when setting values\n   * with form.setValue or resetting the form), and the Field unmounts in\n   * between. This is generally a feature of React Hook Form, but this breaks\n   * dynamic forms where fields are conditionally rendered.\n   *\n   * By using formContext.form.watch(name), we ensure that the field value is\n   * always in sync with the form state. See:\n   * https://react-hook-form.com/api/usecontroller/controller/\n   */\n  const value =\n    useWatch({\n      control: formContext.form.control,\n      name,\n    }) ?? controller.field.value;\n\n  const fieldProps = {\n    ...inheritProps,\n    ...controller.field,\n    value,\n    name,\n    form: formContext.id,\n    isRequired: !!rest.rules?.required,\n    validationBehavior: \"aria\" as const,\n    defaultValue,\n    isInvalid: controller.fieldState.invalid,\n    children: dynamic((p) => {\n      if (controller.fieldState.invalid) {\n        return (\n          <>\n            {p.children}\n            <FieldErrorView>\n              {controller.fieldState.error?.message}\n            </FieldErrorView>\n          </>\n        );\n      }\n\n      return p.children;\n    }),\n  };\n\n  const { value: ignoredValue, ...fieldPropsWithoutValue } = fieldProps;\n\n  const propsContext: PropsContext = {\n    SearchField: fieldProps,\n    TextField: fieldProps,\n    TextArea: fieldProps,\n    MarkdownEditor: fieldProps,\n    Checkbox: {\n      ...fieldProps,\n      isSelected: value,\n    },\n    CheckboxGroup: fieldProps,\n    CheckboxButton: {\n      ...fieldProps,\n      isSelected: value,\n    },\n    FileField: fieldProps,\n    FileDropZone: fieldProps,\n    NumberField: fieldProps,\n    RadioGroup: fieldProps,\n    Switch: {\n      ...fieldProps,\n      isSelected: value,\n    },\n    Slider: fieldProps,\n    PasswordCreationField: fieldProps,\n    DatePicker: fieldProps,\n    DateRangePicker: fieldProps,\n    TimeField: fieldProps,\n    SegmentedControl: fieldProps,\n    Select: {\n      ...fieldProps,\n      selectedKey: value,\n    },\n    ComboBox: {\n      ...fieldPropsWithoutValue,\n      selectedKey: value,\n    },\n  };\n\n  return (\n    <PropsContextProvider\n      props={propsContext}\n      dependencies={[controller.fieldState, controller.field, value]}\n    >\n      {children}\n    </PropsContextProvider>\n  );\n}\n\nexport const typedField = <T extends FieldValues>(\n  ignoredForm: UseFormReturn<T> | UseFormReturn<T>[\"control\"],\n): typeof Field<T> => Field;\n\nexport default Field;\n"],"names":[],"mappings":"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"}

package/dist/js/components/src/lib/componentFactory/flowComponent.mjs

@@ -1,28 +1,30 @@
 "use client"
 /* */
 import { jsx } from 'react/jsx-runtime';
-import { cloneElement } from 'react';
+import { memo, useMemo, cloneElement } from 'react';
 import { TunnelEntry } from '@mittwald/react-tunnel';
 import { SlotContextProvider } from '../slotContext/SlotContextProvider.mjs';
 import { useProps } from '../hooks/useProps.mjs';
 import { useComponentPropsContext } from '../propsContext/propsContext.mjs';
 import { increaseNestingLevel } from '../propsContext/nestedPropsContext/lib.mjs';
-import ComponentPropsContextProviderView from '../../views/ComponentPropsContextProviderView.mjs';
 import { ComponentPropsContextProvider } from '../propsContext/components/ComponentPropsContextProvider.mjs';
+import ComponentPropsContextProviderView from '../../views/ComponentPropsContextProviderView.mjs';
 
 function flowComponent(componentName, ImplementationComponentType, options = {}) {
   const { type = "ui", isRemoteComponent = false } = options;
   const propsContextLevelMode = type === "ui" ? "increment" : "keep";
+  const MemoizedImplementationComponentType = memo(ImplementationComponentType);
   function Component(props) {
     const { tunnelId, wrapWith, ...propsWithContext } = useProps(
       componentName,
       props
     );
     const implementationTypeProps = propsWithContext;
-    const componentProps = useComponentPropsContext(componentName) ?? {};
+    const emptyProps = useMemo(() => ({}), []);
+    const componentProps = useComponentPropsContext(componentName) ?? emptyProps;
     increaseNestingLevel(componentProps);
     ImplementationComponentType.displayName = `FlowComponentImpl(${componentName})`;
-    let element = /* @__PURE__ */ jsx(ImplementationComponentType, { ...implementationTypeProps });
+    let element = /* @__PURE__ */ jsx(MemoizedImplementationComponentType, { ...implementationTypeProps });
     if (isRemoteComponent) {
       element = /* @__PURE__ */ jsx(
         ComponentPropsContextProvider,
@@ -54,7 +56,7 @@ function flowComponent(componentName, ImplementationComponentType, options = {})
     return element;
   }
   Component.displayName = `FlowComponent(${componentName})`;
-  return Component;
+  return memo(Component);
 }
 
 export { flowComponent };

package/dist/js/components/src/lib/componentFactory/flowComponent.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"flowComponent.mjs","sources":["../../../../../../src/lib/componentFactory/flowComponent.tsx"],"sourcesContent":["import type {\n  FlowComponentName,\n  FlowComponentProps as FlowComponentPropsOfName,\n} from \"@/components/propTypes\";\nimport type {\n  ComponentProps,\n  ComponentType,\n  ReactElement,\n  ReactNode,\n  RefAttributes,\n  FunctionComponent,\n} from \"react\";\nimport { cloneElement } from \"react\";\nimport type { PropsWithTunnel } from \"@/lib/types/props\";\nimport { TunnelEntry } from \"@mittwald/react-tunnel\";\nimport SlotContextProvider from \"@/lib/slotContext/SlotContextProvider\";\nimport { useProps } from \"@/lib/hooks/useProps\";\nimport { useComponentPropsContext } from \"@/lib/propsContext/propsContext\";\nimport { increaseNestingLevel } from \"@/lib/propsContext/nestedPropsContext/lib\";\nimport ComponentPropsContextProviderView from \"@/views/ComponentPropsContextProviderView\";\nimport { ComponentPropsContextProvider } from \"@/components/ComponentPropsContextProvider\";\nimport type { PropsContextLevelMode } from \"@/lib/propsContext/inherit/types\";\n\ntype RefType<T> = T extends RefAttributes<infer R> ? R : undefined;\n\nexport interface FlowComponentProps<R = HTMLDivElement>\n  extends PropsWithTunnel,\n    RefAttributes<R> {\n  wrapWith?: ReactElement;\n}\n\ntype FlowComponentImplementationProps<C extends FlowComponentName> = Omit<\n  FlowComponentPropsOfName<C>,\n  keyof FlowComponentProps\n> &\n  RefAttributes<RefType<FlowComponentPropsOfName<C>>>;\n\ntype FlowComponentImplementationType<C extends FlowComponentName> =\n  ComponentType<FlowComponentImplementationProps<C>>;\n\ntype FlowComponentType<C extends FlowComponentName> = FunctionComponent<\n  FlowComponentPropsOfName<C> &\n    RefAttributes<RefType<FlowComponentPropsOfName<C>>>\n>;\n\ntype FlowComponentProvisionType = \"provider\" | \"ui\";\n\ninterface Options {\n  type?: FlowComponentProvisionType;\n  isRemoteComponent?: boolean;\n}\n\nexport function flowComponent<C extends FlowComponentName>(\n  componentName: C,\n  ImplementationComponentType: FlowComponentImplementationType<C>,\n  options: Options = {},\n): FlowComponentType<C> {\n  type Props = FlowComponentPropsOfName<C> &\n    RefAttributes<RefType<FlowComponentPropsOfName<C>>>;\n\n  const { type = \"ui\", isRemoteComponent = false } = options;\n\n  const propsContextLevelMode: PropsContextLevelMode =\n    type === \"ui\" ? \"increment\" : \"keep\";\n\n  function Component(props: Props) {\n    const { tunnelId, wrapWith, ...propsWithContext } = useProps(\n      componentName,\n      props as FlowComponentPropsOfName<C>,\n    ) as FlowComponentProps<RefType<FlowComponentPropsOfName<C>>>;\n\n    const implementationTypeProps = propsWithContext as ComponentProps<\n      typeof ImplementationComponentType\n    >;\n\n    const componentProps = useComponentPropsContext(componentName) ?? {};\n    increaseNestingLevel(componentProps);\n\n    ImplementationComponentType.displayName = `FlowComponentImpl(${componentName})`;\n\n    let element: ReactNode = (\n      <ImplementationComponentType {...implementationTypeProps} />\n    );\n\n    if (isRemoteComponent) {\n      element = (\n        <ComponentPropsContextProvider\n          componentProps={componentProps}\n          levelModel={propsContextLevelMode}\n        >\n          {element}\n        </ComponentPropsContextProvider>\n      );\n    } else {\n      /**\n       * In case of a Flow component that does not have a remote counterpart\n       * (like the List component), the ComponentPropsContext must be applied on\n       * the host side, so that nesting and inheritance is working correctly.\n       */\n      element = (\n        <ComponentPropsContextProviderView\n          componentProps={componentProps}\n          levelModel={propsContextLevelMode}\n        >\n          {element}\n        </ComponentPropsContextProviderView>\n      );\n    }\n\n    if (\"slot\" in props && !!props.slot && typeof props.slot === \"string\") {\n      element = (\n        <SlotContextProvider slot={props.slot} component={componentName}>\n          {element}\n        </SlotContextProvider>\n      );\n    }\n\n    if (wrapWith) {\n      element = cloneElement(wrapWith, undefined, element);\n    }\n\n    if (tunnelId) {\n      element = <TunnelEntry id={tunnelId}>{element}</TunnelEntry>;\n    }\n\n    return element;\n  }\n\n  Component.displayName = `FlowComponent(${componentName})`;\n  return Component;\n}\n"],"names":[],"mappings":";;;;;;;;;;AAoDO,SAAS,aACd,CAAA,aAAA,EACA,2BACA,EAAA,OAAA,GAAmB,EACG,EAAA;AAItB,EAAA,MAAM,EAAE,IAAA,GAAO,IAAM,EAAA,iBAAA,GAAoB,OAAU,GAAA,OAAA;AAEnD,EAAM,MAAA,qBAAA,GACJ,IAAS,KAAA,IAAA,GAAO,WAAc,GAAA,MAAA;AAEhC,EAAA,SAAS,UAAU,KAAc,EAAA;AAC/B,IAAA,MAAM,EAAE,QAAA,EAAU,QAAU,EAAA,GAAG,kBAAqB,GAAA,QAAA;AAAA,MAClD,aAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,uBAA0B,GAAA,gBAAA;AAIhC,IAAA,MAAM,cAAiB,GAAA,wBAAA,CAAyB,aAAa,CAAA,IAAK,EAAC;AACnE,IAAA,oBAAA,CAAqB,cAAc,CAAA;AAEnC,IAA4B,2BAAA,CAAA,WAAA,GAAc,qBAAqB,aAAa,CAAA,CAAA,CAAA;AAE5E,IAAA,IAAI,OACF,mBAAA,GAAA,CAAC,2BAA6B,EAAA,EAAA,GAAG,uBAAyB,EAAA,CAAA;AAG5D,IAAA,IAAI,iBAAmB,EAAA;AACrB,MACE,OAAA,mBAAA,GAAA;AAAA,QAAC,6BAAA;AAAA,QAAA;AAAA,UACC,cAAA;AAAA,UACA,UAAY,EAAA,qBAAA;AAAA,UAEX,QAAA,EAAA;AAAA;AAAA,OACH;AAAA,KAEG,MAAA;AAML,MACE,OAAA,mBAAA,GAAA;AAAA,QAAC,iCAAA;AAAA,QAAA;AAAA,UACC,cAAA;AAAA,UACA,UAAY,EAAA,qBAAA;AAAA,UAEX,QAAA,EAAA;AAAA;AAAA,OACH;AAAA;AAIJ,IAAI,IAAA,MAAA,IAAU,SAAS,CAAC,CAAC,MAAM,IAAQ,IAAA,OAAO,KAAM,CAAA,IAAA,KAAS,QAAU,EAAA;AACrE,MAAA,OAAA,uBACG,mBAAoB,EAAA,EAAA,IAAA,EAAM,MAAM,IAAM,EAAA,SAAA,EAAW,eAC/C,QACH,EAAA,OAAA,EAAA,CAAA;AAAA;AAIJ,IAAA,IAAI,QAAU,EAAA;AACZ,MAAU,OAAA,GAAA,YAAA,CAAa,QAAU,EAAA,MAAA,EAAW,OAAO,CAAA;AAAA;AAGrD,IAAA,IAAI,QAAU,EAAA;AACZ,MAAA,OAAA,mBAAW,GAAA,CAAA,WAAA,EAAA,EAAY,EAAI,EAAA,QAAA,EAAW,QAAQ,EAAA,OAAA,EAAA,CAAA;AAAA;AAGhD,IAAO,OAAA,OAAA;AAAA;AAGT,EAAU,SAAA,CAAA,WAAA,GAAc,iBAAiB,aAAa,CAAA,CAAA,CAAA;AACtD,EAAO,OAAA,SAAA;AACT;;;;"}
+{"version":3,"file":"flowComponent.mjs","sources":["../../../../../../src/lib/componentFactory/flowComponent.tsx"],"sourcesContent":["import type {\n  FlowComponentName,\n  FlowComponentProps as FlowComponentPropsOfName,\n} from \"@/components/propTypes\";\nimport type {\n  ComponentProps,\n  ComponentType,\n  ReactElement,\n  ReactNode,\n  RefAttributes,\n  FunctionComponent,\n} from \"react\";\nimport { cloneElement, memo, useMemo } from \"react\";\nimport type { PropsWithTunnel } from \"@/lib/types/props\";\nimport { TunnelEntry } from \"@mittwald/react-tunnel\";\nimport SlotContextProvider from \"@/lib/slotContext/SlotContextProvider\";\nimport { useProps } from \"@/lib/hooks/useProps\";\nimport { useComponentPropsContext } from \"@/lib/propsContext/propsContext\";\nimport { increaseNestingLevel } from \"@/lib/propsContext/nestedPropsContext/lib\";\nimport { ComponentPropsContextProvider } from \"@/components/ComponentPropsContextProvider\";\nimport type { PropsContextLevelMode } from \"@/lib/propsContext/inherit/types\";\nimport ComponentPropsContextProviderView from \"@/views/ComponentPropsContextProviderView\";\n\ntype RefType<T> = T extends RefAttributes<infer R> ? R : undefined;\n\nexport interface FlowComponentProps<R = HTMLDivElement>\n  extends PropsWithTunnel,\n    RefAttributes<R> {\n  wrapWith?: ReactElement;\n}\n\ntype FlowComponentImplementationProps<C extends FlowComponentName> = Omit<\n  FlowComponentPropsOfName<C>,\n  keyof FlowComponentProps\n> &\n  RefAttributes<RefType<FlowComponentPropsOfName<C>>>;\n\ntype FlowComponentImplementationType<C extends FlowComponentName> =\n  ComponentType<FlowComponentImplementationProps<C>>;\n\ntype FlowComponentType<C extends FlowComponentName> = FunctionComponent<\n  FlowComponentPropsOfName<C> &\n    RefAttributes<RefType<FlowComponentPropsOfName<C>>>\n>;\n\ntype FlowComponentProvisionType = \"provider\" | \"ui\";\n\ninterface Options {\n  type?: FlowComponentProvisionType;\n  isRemoteComponent?: boolean;\n}\n\nexport function flowComponent<C extends FlowComponentName>(\n  componentName: C,\n  ImplementationComponentType: FlowComponentImplementationType<C>,\n  options: Options = {},\n): FlowComponentType<C> {\n  type Props = FlowComponentPropsOfName<C> &\n    RefAttributes<RefType<FlowComponentPropsOfName<C>>>;\n\n  const { type = \"ui\", isRemoteComponent = false } = options;\n\n  const propsContextLevelMode: PropsContextLevelMode =\n    type === \"ui\" ? \"increment\" : \"keep\";\n\n  const MemoizedImplementationComponentType = memo(ImplementationComponentType);\n\n  function Component(props: Props) {\n    const { tunnelId, wrapWith, ...propsWithContext } = useProps(\n      componentName,\n      props as FlowComponentPropsOfName<C>,\n    ) as FlowComponentProps<RefType<FlowComponentPropsOfName<C>>>;\n\n    const implementationTypeProps = propsWithContext as ComponentProps<\n      typeof ImplementationComponentType\n    >;\n\n    const emptyProps = useMemo(() => ({}), []);\n    const componentProps =\n      useComponentPropsContext(componentName) ?? emptyProps;\n    increaseNestingLevel(componentProps);\n\n    ImplementationComponentType.displayName = `FlowComponentImpl(${componentName})`;\n\n    let element: ReactNode = (\n      <MemoizedImplementationComponentType {...implementationTypeProps} />\n    );\n\n    if (isRemoteComponent) {\n      element = (\n        <ComponentPropsContextProvider\n          componentProps={componentProps}\n          levelModel={propsContextLevelMode}\n        >\n          {element}\n        </ComponentPropsContextProvider>\n      );\n    } else {\n      /**\n       * In case of a Flow component that does not have a remote counterpart\n       * (like the List component), the ComponentPropsContext must be applied on\n       * the host side, so that nesting and inheritance is working correctly.\n       */\n      element = (\n        <ComponentPropsContextProviderView\n          componentProps={componentProps}\n          levelModel={propsContextLevelMode}\n        >\n          {element}\n        </ComponentPropsContextProviderView>\n      );\n    }\n\n    if (\"slot\" in props && !!props.slot && typeof props.slot === \"string\") {\n      element = (\n        <SlotContextProvider slot={props.slot} component={componentName}>\n          {element}\n        </SlotContextProvider>\n      );\n    }\n\n    if (wrapWith) {\n      element = cloneElement(wrapWith, undefined, element);\n    }\n\n    if (tunnelId) {\n      element = <TunnelEntry id={tunnelId}>{element}</TunnelEntry>;\n    }\n    return element;\n  }\n\n  Component.displayName = `FlowComponent(${componentName})`;\n  return memo(Component);\n}\n"],"names":[],"mappings":";;;;;;;;;;AAoDO,SAAS,aACd,CAAA,aAAA,EACA,2BACA,EAAA,OAAA,GAAmB,EACG,EAAA;AAItB,EAAA,MAAM,EAAE,IAAA,GAAO,IAAM,EAAA,iBAAA,GAAoB,OAAU,GAAA,OAAA;AAEnD,EAAM,MAAA,qBAAA,GACJ,IAAS,KAAA,IAAA,GAAO,WAAc,GAAA,MAAA;AAEhC,EAAM,MAAA,mCAAA,GAAsC,KAAK,2BAA2B,CAAA;AAE5E,EAAA,SAAS,UAAU,KAAc,EAAA;AAC/B,IAAA,MAAM,EAAE,QAAA,EAAU,QAAU,EAAA,GAAG,kBAAqB,GAAA,QAAA;AAAA,MAClD,aAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,uBAA0B,GAAA,gBAAA;AAIhC,IAAA,MAAM,aAAa,OAAQ,CAAA,OAAO,EAAC,CAAA,EAAI,EAAE,CAAA;AACzC,IAAM,MAAA,cAAA,GACJ,wBAAyB,CAAA,aAAa,CAAK,IAAA,UAAA;AAC7C,IAAA,oBAAA,CAAqB,cAAc,CAAA;AAEnC,IAA4B,2BAAA,CAAA,WAAA,GAAc,qBAAqB,aAAa,CAAA,CAAA,CAAA;AAE5E,IAAA,IAAI,OACF,mBAAA,GAAA,CAAC,mCAAqC,EAAA,EAAA,GAAG,uBAAyB,EAAA,CAAA;AAGpE,IAAA,IAAI,iBAAmB,EAAA;AACrB,MACE,OAAA,mBAAA,GAAA;AAAA,QAAC,6BAAA;AAAA,QAAA;AAAA,UACC,cAAA;AAAA,UACA,UAAY,EAAA,qBAAA;AAAA,UAEX,QAAA,EAAA;AAAA;AAAA,OACH;AAAA,KAEG,MAAA;AAML,MACE,OAAA,mBAAA,GAAA;AAAA,QAAC,iCAAA;AAAA,QAAA;AAAA,UACC,cAAA;AAAA,UACA,UAAY,EAAA,qBAAA;AAAA,UAEX,QAAA,EAAA;AAAA;AAAA,OACH;AAAA;AAIJ,IAAI,IAAA,MAAA,IAAU,SAAS,CAAC,CAAC,MAAM,IAAQ,IAAA,OAAO,KAAM,CAAA,IAAA,KAAS,QAAU,EAAA;AACrE,MAAA,OAAA,uBACG,mBAAoB,EAAA,EAAA,IAAA,EAAM,MAAM,IAAM,EAAA,SAAA,EAAW,eAC/C,QACH,EAAA,OAAA,EAAA,CAAA;AAAA;AAIJ,IAAA,IAAI,QAAU,EAAA;AACZ,MAAU,OAAA,GAAA,YAAA,CAAa,QAAU,EAAA,MAAA,EAAW,OAAO,CAAA;AAAA;AAGrD,IAAA,IAAI,QAAU,EAAA;AACZ,MAAA,OAAA,mBAAW,GAAA,CAAA,WAAA,EAAA,EAAY,EAAI,EAAA,QAAA,EAAW,QAAQ,EAAA,OAAA,EAAA,CAAA;AAAA;AAEhD,IAAO,OAAA,OAAA;AAAA;AAGT,EAAU,SAAA,CAAA,WAAA,GAAc,iBAAiB,aAAa,CAAA,CAAA,CAAA;AACtD,EAAA,OAAO,KAAK,SAAS,CAAA;AACvB;;;;"}

package/dist/js/components/src/lib/hooks/useProps.mjs

@@ -9,12 +9,13 @@ import 'react';
 import { isFlowComponentName } from '../propsContext/isFlowComponentName.mjs';
 import 'react/jsx-runtime';
 import '@mittwald/react-tunnel';
-import '../slotContext/slotContext.mjs';
+import '../slotContext/SlotContextProvider.mjs';
 import { isInheritedPropsContextKey } from '../propsContext/inherit/lib.mjs';
 import { areChildrenEmpty } from '../react/areChildrenEmpty.mjs';
 import { isNestingLevelKey } from '../propsContext/nestedPropsContext/lib.mjs';
-import '../propsContext/inherit/propsContextLevel.mjs';
-import 'dot-prop';
+import '../propsContext/components/ComponentPropsContextProvider.mjs';
+import '../../views/ComponentPropsContextProviderView.mjs';
+import '../propsContext/components/PropsContextProvider.mjs';
 import '../viewComponentContext/viewComponentContext.mjs';
 
 const withoutChildren = (props) => {

package/dist/js/components/src/lib/hooks/useProps.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useProps.mjs","sources":["../../../../../../src/lib/hooks/useProps.ts"],"sourcesContent":["import {\n  type FlowComponentName,\n  type FlowComponentProps,\n} from \"@/components/propTypes\";\nimport { mergeProps } from \"@react-aria/utils\";\nimport { resolveDynamicProps } from \"@/lib/propsContext/dynamicProps/resolveDynamicProps\";\nimport { useComponentPropsContext } from \"@/lib/propsContext/propsContext\";\nimport { omitBy } from \"remeda\";\nimport isDynamicProp from \"@/lib/propsContext/dynamicProps/lib\";\nimport { isFlowComponentName } from \"@/index/internal\";\nimport { isInheritedPropsContextKey } from \"@/lib/propsContext/inherit/lib\";\nimport { areChildrenEmpty } from \"@/lib/react/areChildrenEmpty\";\nimport { isNestingLevelKey } from \"@/lib/propsContext/nestedPropsContext/lib\";\n\nconst withoutChildren = <C extends FlowComponentName>(\n  props: FlowComponentProps<C>,\n) => {\n  if (\"children\" in props) {\n    if (areChildrenEmpty(props.children)) {\n      const { children: ignored, ...rest } = props;\n      return rest as FlowComponentProps<C>;\n    }\n  }\n  return props;\n};\n\nexport const useProps = <C extends FlowComponentName>(\n  component: C,\n  localProps: FlowComponentProps<C>,\n): FlowComponentProps<C> => {\n  localProps = withoutChildren(localProps);\n\n  const componentPropsContext = useComponentPropsContext(component);\n\n  const withResolvedDynamicProps = componentPropsContext\n    ? resolveDynamicProps(componentPropsContext, localProps)\n    : undefined;\n\n  const withoutInternalProps = componentPropsContext\n    ? omitBy(\n        componentPropsContext,\n        (value, key) =>\n          isFlowComponentName(key) ||\n          isInheritedPropsContextKey(key) ||\n          isNestingLevelKey(key) ||\n          isDynamicProp(value),\n      )\n    : undefined;\n\n  return mergeProps(\n    withoutInternalProps,\n    localProps,\n    withResolvedDynamicProps,\n  ) as FlowComponentProps<C>;\n};\n\nexport default useProps;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAcA,MAAM,eAAA,GAAkB,CACtB,KACG,KAAA;AACH,EAAA,IAAI,cAAc,KAAO,EAAA;AACvB,IAAI,IAAA,gBAAA,CAAiB,KAAM,CAAA,QAAQ,CAAG,EAAA;AACpC,MAAA,MAAM,EAAE,QAAA,EAAU,OAAS,EAAA,GAAG,MAAS,GAAA,KAAA;AACvC,MAAO,OAAA,IAAA;AAAA;AACT;AAEF,EAAO,OAAA,KAAA;AACT,CAAA;AAEa,MAAA,QAAA,GAAW,CACtB,SAAA,EACA,UAC0B,KAAA;AAC1B,EAAA,UAAA,GAAa,gBAAgB,UAAU,CAAA;AAEvC,EAAM,MAAA,qBAAA,GAAwB,yBAAyB,SAAS,CAAA;AAEhE,EAAA,MAAM,wBAA2B,GAAA,qBAAA,GAC7B,mBAAoB,CAAA,qBAAA,EAAuB,UAAU,CACrD,GAAA,MAAA;AAEJ,EAAA,MAAM,uBAAuB,qBACzB,GAAA,MAAA;AAAA,IACE,qBAAA;AAAA,IACA,CAAC,KAAA,EAAO,GACN,KAAA,mBAAA,CAAoB,GAAG,CAAA,IACvB,0BAA2B,CAAA,GAAG,CAC9B,IAAA,iBAAA,CAAkB,GAAG,CAAA,IACrB,cAAc,KAAK;AAAA,GAEvB,GAAA,MAAA;AAEJ,EAAO,OAAA,UAAA;AAAA,IACL,oBAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}
+{"version":3,"file":"useProps.mjs","sources":["../../../../../../src/lib/hooks/useProps.ts"],"sourcesContent":["import {\n  type FlowComponentName,\n  type FlowComponentProps,\n} from \"@/components/propTypes\";\nimport { mergeProps } from \"@react-aria/utils\";\nimport { resolveDynamicProps } from \"@/lib/propsContext/dynamicProps/resolveDynamicProps\";\nimport { useComponentPropsContext } from \"@/lib/propsContext/propsContext\";\nimport { omitBy } from \"remeda\";\nimport isDynamicProp from \"@/lib/propsContext/dynamicProps/lib\";\nimport { isFlowComponentName } from \"@/index/internal\";\nimport { isInheritedPropsContextKey } from \"@/lib/propsContext/inherit/lib\";\nimport { areChildrenEmpty } from \"@/lib/react/areChildrenEmpty\";\nimport { isNestingLevelKey } from \"@/lib/propsContext/nestedPropsContext/lib\";\n\nconst withoutChildren = <C extends FlowComponentName>(\n  props: FlowComponentProps<C>,\n) => {\n  if (\"children\" in props) {\n    if (areChildrenEmpty(props.children)) {\n      const { children: ignored, ...rest } = props;\n      return rest as FlowComponentProps<C>;\n    }\n  }\n  return props;\n};\n\nexport const useProps = <C extends FlowComponentName>(\n  component: C,\n  localProps: FlowComponentProps<C>,\n): FlowComponentProps<C> => {\n  localProps = withoutChildren(localProps);\n\n  const componentPropsContext = useComponentPropsContext(component);\n\n  const withResolvedDynamicProps = componentPropsContext\n    ? resolveDynamicProps(componentPropsContext, localProps)\n    : undefined;\n\n  const withoutInternalProps = componentPropsContext\n    ? omitBy(\n        componentPropsContext,\n        (value, key) =>\n          isFlowComponentName(key) ||\n          isInheritedPropsContextKey(key) ||\n          isNestingLevelKey(key) ||\n          isDynamicProp(value),\n      )\n    : undefined;\n\n  return mergeProps(\n    withoutInternalProps,\n    localProps,\n    withResolvedDynamicProps,\n  ) as FlowComponentProps<C>;\n};\n\nexport default useProps;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAcA,MAAM,eAAA,GAAkB,CACtB,KACG,KAAA;AACH,EAAA,IAAI,cAAc,KAAO,EAAA;AACvB,IAAI,IAAA,gBAAA,CAAiB,KAAM,CAAA,QAAQ,CAAG,EAAA;AACpC,MAAA,MAAM,EAAE,QAAA,EAAU,OAAS,EAAA,GAAG,MAAS,GAAA,KAAA;AACvC,MAAO,OAAA,IAAA;AAAA;AACT;AAEF,EAAO,OAAA,KAAA;AACT,CAAA;AAEa,MAAA,QAAA,GAAW,CACtB,SAAA,EACA,UAC0B,KAAA;AAC1B,EAAA,UAAA,GAAa,gBAAgB,UAAU,CAAA;AAEvC,EAAM,MAAA,qBAAA,GAAwB,yBAAyB,SAAS,CAAA;AAEhE,EAAA,MAAM,wBAA2B,GAAA,qBAAA,GAC7B,mBAAoB,CAAA,qBAAA,EAAuB,UAAU,CACrD,GAAA,MAAA;AAEJ,EAAA,MAAM,uBAAuB,qBACzB,GAAA,MAAA;AAAA,IACE,qBAAA;AAAA,IACA,CAAC,KAAA,EAAO,GACN,KAAA,mBAAA,CAAoB,GAAG,CAAA,IACvB,0BAA2B,CAAA,GAAG,CAC9B,IAAA,iBAAA,CAAkB,GAAG,CAAA,IACrB,cAAc,KAAK;AAAA,GAEvB,GAAA,MAAA;AAEJ,EAAO,OAAA,UAAA;AAAA,IACL,oBAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}

package/dist/js/components/src/lib/propsContext/components/ClearPropsContext.mjs

@@ -3,14 +3,15 @@
 import { jsx } from 'react/jsx-runtime';
 import 'react';
 import '@mittwald/react-tunnel';
-import '../../slotContext/slotContext.mjs';
+import '../../slotContext/SlotContextProvider.mjs';
 import '@react-aria/utils';
 import { propsContext } from '../propsContext.mjs';
 import 'remeda';
-import '../inherit/propsContextLevel.mjs';
-import { PropsContextLevelProvider } from '../inherit/PropsContextLevelProvider.mjs';
-import 'dot-prop';
+import './ComponentPropsContextProvider.mjs';
+import '../../../views/ComponentPropsContextProviderView.mjs';
+import './PropsContextProvider.mjs';
 import '../../viewComponentContext/viewComponentContext.mjs';
+import { PropsContextLevelProvider } from '../inherit/PropsContextLevelProvider.mjs';
 
 const ClearPropsContext = (props) => {
   const { children } = props;