fastapi-rtk 2.7.1 → 2.8.0

package/dist/jsonforms/esm/complex/MantineArrayControl/MantineArrayControl.mjs

@@ -1,8 +1,9 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { rankWith, or, isObjectArrayControl, isPrimitiveArrayControl } from "@jsonforms/core";
 import { withJsonFormsArrayLayoutProps, withTranslateProps, withArrayTranslationProps } from "@jsonforms/react";
-import { MantineThemeProvider, Box } from "@mantine/core";
+import { Box, MantineThemeProvider } from "@mantine/core";
 import { useState, useCallback } from "react";
+import { useContextProps } from "../../hooks/useContextProps.mjs";
 import { useThemeCustomizer } from "../../hooks/useThemeCustomizer.mjs";
 import { isEnumArrayArrayControl } from "../../testers/isEnumArrayArrayControl.mjs";
 import { isFilesControl } from "../../testers/isFilesControl.mjs";
@@ -53,17 +54,21 @@ const Component = (props) => {
     )
   ] });
 };
-const FileArrayComponent = (props) => /* @__PURE__ */ jsx(
-  MantineThemeProvider,
-  {
-    theme: useThemeCustomizer({
-      "Table.Header.Validation": {
-        component: /* @__PURE__ */ jsx(Box, { style: { display: "none" } })
-      }
-    }),
-    children: /* @__PURE__ */ jsx(Component, { ...props })
-  }
-);
+const FileArrayComponent = (props) => {
+  const [HiddenBox, _hiddenBoxProps] = useContextProps(
+    "Array.File.HiddenValidation",
+    "Array.File.HiddenValidation",
+    { style: { display: "none" } },
+    props,
+    { withAllProps: false }
+  );
+  const theme = useThemeCustomizer({
+    "Table.Header.Validation": {
+      component: HiddenBox === void 0 ? /* @__PURE__ */ jsx(Box, { ..._hiddenBoxProps }) : HiddenBox
+    }
+  });
+  return /* @__PURE__ */ jsx(MantineThemeProvider, { theme, children: /* @__PURE__ */ jsx(Component, { ...props }) });
+};
 const mantineArrayControlTester = rankWith(
   1,
   or(isObjectArrayControl, isPrimitiveArrayControl, isEnumArrayArrayControl, isJsonArrayControl)

package/dist/jsonforms/esm/complex/MantineTableControl/MantineTableControl.mjs

@@ -1,4 +1,4 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { deepMerge } from "fastapi-rtk/utils";
 import { encode, Resolve, Paths, formatErrorMessage, errorsAt } from "@jsonforms/core";
 import { DispatchCell, useJsonForms } from "@jsonforms/react";
@@ -66,8 +66,18 @@ const getValidColumnProps = (scopedSchema) => {
   return [""];
 };
 const EmptyTable = (props) => {
-  const { numColumns, translations } = props;
-  return /* @__PURE__ */ jsx(Table.Tr, { children: /* @__PURE__ */ jsx(NoBorderTableCell, { colSpan: numColumns, children: /* @__PURE__ */ jsx(Text, { ta: "center", children: translations.noDataMessage }) }) });
+  const { numColumns, translations, path } = props;
+  const [EmptyComponent, _emptyProps] = useContextProps(
+    "Table.Empty",
+    `${path}.Empty`,
+    {
+      colSpan: numColumns,
+      children: /* @__PURE__ */ jsx(NoBorderTableCell, { colSpan: numColumns, children: /* @__PURE__ */ jsx(Text, { ta: "center", children: translations.noDataMessage }) })
+    },
+    props,
+    { withAllProps: false }
+  );
+  return EmptyComponent === void 0 ? /* @__PURE__ */ jsx(Table.Tr, { ..._emptyProps }) : EmptyComponent;
 };
 const TableHeaderCell = React.memo(function TableHeaderCell2(props) {
   const { title, rowPath, propName, index } = props;
@@ -119,24 +129,57 @@ const NonEmptyCellComponent = React.memo(function NonEmptyCellComponent2(props)
     [path, propName]
   );
   const index = useMemo(() => path.split(".").slice(-1)[0], [path]);
+  const rowIndex = useMemo(() => path.split(".")[originalPath.split(".").length], [path, originalPath]);
   const generalRowProps = useProps("Table.Row", {}, {});
   const arrayRowProps = useProps(originalPath, {}, {});
   const indexedRowProps = useProps(`Table.Row.${index}`, {}, {});
+  const propRowProps = useProps(propName ? `${originalPath}.${propName}` : path, {}, {});
+  const numberedRowProps = useProps(propName ? `Table.Row.${rowIndex}.${propName}` : `Table.Row.${rowIndex}`, {}, {});
   const specificRowProps = useProps(path, {}, {});
   const { component, props: _props } = useMemo(
     // #MUSTASSERT user-configured MantineThemeProvider row overrides flow through deepMerge as `{}`; narrow to the RowOverride shape consumed below
-    () => deepMerge(generalRowProps, arrayRowProps, indexedRowProps, specificRowProps),
-    [generalRowProps, arrayRowProps, indexedRowProps, specificRowProps]
+    () => deepMerge(
+      generalRowProps,
+      arrayRowProps,
+      indexedRowProps,
+      propRowProps,
+      numberedRowProps,
+      specificRowProps
+    ),
+    [generalRowProps, arrayRowProps, indexedRowProps, propRowProps, numberedRowProps, specificRowProps]
   );
   const theme = useThemeCustomizer({ [path]: { component, props: _props } });
   const [, _tdProps] = useContextProps("Table.Row.Td", `${originalPath}.Td`, { maw: 0 }, props, {
     withAllProps: false
   });
-  const [, __tdProps] = useContextProps(`Table.Row.${index}.Td`, `${path}.Td`, { maw: 0 }, props, {
+  const [, __tdProps] = useContextProps(
+    `Table.Row.${index}.Td`,
+    propName ? `${originalPath}.${propName}.Td` : `${path}.Td`,
+    {},
+    props,
+    {
+      withAllProps: false,
+      withComponentProps: false
+    }
+  );
+  const [, ___tdProps] = useContextProps(`${path}.Td`, `${path}.Td`, {}, props, {
     withAllProps: false,
     withComponentProps: false
   });
-  const tdProps = useMemo(() => deepMerge(_tdProps, __tdProps), [_tdProps, __tdProps]);
+  const [, _numberedTdProps] = useContextProps(
+    propName ? `Table.Row.${rowIndex}.${propName}.Td` : `Table.Row.${rowIndex}.Td`,
+    propName ? `Table.Row.${rowIndex}.${propName}.Td` : `Table.Row.${rowIndex}.Td`,
+    {},
+    props,
+    {
+      withAllProps: false,
+      withComponentProps: false
+    }
+  );
+  const tdProps = useMemo(
+    () => deepMerge(_tdProps, __tdProps, _numberedTdProps, ___tdProps),
+    [_tdProps, __tdProps, _numberedTdProps, ___tdProps]
+  );
   return /* @__PURE__ */ jsx(MantineThemeProvider, { theme, children: /* @__PURE__ */ jsx(NoBorderTableCell, { ...tdProps, children: schema.properties ? /* @__PURE__ */ jsx(
     DispatchCell,
     {
@@ -180,9 +223,19 @@ const NonEmptyRowComponent = (props) => {
     withAllProps: false
   });
   const trProps = useMemo(() => deepMerge(_trProps, __trProps), [_trProps, __trProps]);
+  const [ActionsComponent, _actionsProps] = useContextProps(
+    "Table.Row.Actions",
+    `${childPath}.Row.Actions`,
+    {
+      style: showSortButtons ? styles.fixedCell : styles.fixedCellSmall,
+      children: NavigationComponent
+    },
+    props,
+    { withAllProps: false }
+  );
   return /* @__PURE__ */ jsxs(Table.Tr, { ...trProps, children: [
     generateCells(NonEmptyCell, schema, childPath, enabled, cells),
-    NavigationComponent ? /* @__PURE__ */ jsx(NoBorderTableCell, { style: showSortButtons ? styles.fixedCell : styles.fixedCellSmall, children: NavigationComponent }) : null
+    NavigationComponent ? ActionsComponent === void 0 ? /* @__PURE__ */ jsx(NoBorderTableCell, { ..._actionsProps }) : ActionsComponent : null
   ] }, childPath);
 };
 const NonEmptyRow = React.memo(NonEmptyRowComponent);
@@ -203,7 +256,7 @@ const TableRows = (props) => {
   } = props;
   const isEmptyTable = data === 0;
   if (isEmptyTable) {
-    return /* @__PURE__ */ jsx(EmptyTable, { numColumns: getValidColumnProps(schema).length + 1, translations });
+    return /* @__PURE__ */ jsx(EmptyTable, { numColumns: getValidColumnProps(schema).length + 1, translations, path });
   }
   const appliedUiSchemaOptions = merge({}, config, uischema.options);
   return range(data).map((index) => {
@@ -254,13 +307,32 @@ const MantineTableControl = memo(function MantineTableControl2(props) {
   const headerCells = isObjectSchema ? generateCells(TableHeaderCell, schema, path, enabled, cells) : void 0;
   const isEnabled = enabled && !doDisableAdd;
   const headerErrors = useArrayHeaderErrors(path, schema);
-  const [Component, _props] = useContextProps("Table", `${path}.Table`, {}, props, { withAllProps: false });
-  if (!visible) {
-    return null;
-  }
-  if (Component === void 0) {
-    return /* @__PURE__ */ jsxs(Table, { ..._props, children: [
-      /* @__PURE__ */ jsxs(Table.Thead, { children: [
+  const [HeaderActionsComponent, _headerActionsProps] = useContextProps(
+    "Table.Header.Actions",
+    `${path}.Header.Actions`,
+    {},
+    props,
+    { withAllProps: false }
+  );
+  const headerActionsEl = HeaderActionsComponent === void 0 ? /* @__PURE__ */ jsx(Table.Th, { ..._headerActionsProps }) : HeaderActionsComponent;
+  const [HeaderTrComponent, _headerTrProps] = useContextProps(
+    "Table.Header.Tr",
+    `${path}.Header.Tr`,
+    {
+      children: /* @__PURE__ */ jsxs(Fragment, { children: [
+        headerCells,
+        isEnabled ? headerActionsEl : null
+      ] })
+    },
+    props,
+    { withAllProps: false }
+  );
+  const headerTrEl = HeaderTrComponent === void 0 ? /* @__PURE__ */ jsx(Table.Tr, { ..._headerTrProps }) : HeaderTrComponent;
+  const [TheadComponent, _theadProps] = useContextProps(
+    "Table.Thead",
+    `${path}.Thead`,
+    {
+      children: /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx(
           TableToolbar,
           {
@@ -277,15 +349,37 @@ const MantineTableControl = memo(function MantineTableControl2(props) {
             translations
           }
         ),
-        isObjectSchema && /* @__PURE__ */ jsxs(Table.Tr, { children: [
-          headerCells,
-          isEnabled ? /* @__PURE__ */ jsx(Table.Th, {}) : null
-        ] })
-      ] }),
-      /* @__PURE__ */ jsx(Table.Tbody, { children: /* @__PURE__ */ jsx(TableRows, { ...props, disableRemove: doDisableRemove }) })
-    ] });
+        isObjectSchema && headerTrEl
+      ] })
+    },
+    props,
+    { withAllProps: false }
+  );
+  const theadEl = TheadComponent === void 0 ? /* @__PURE__ */ jsx(Table.Thead, { ..._theadProps }) : TheadComponent;
+  const [TbodyComponent, _tbodyProps] = useContextProps(
+    "Table.Tbody",
+    `${path}.Tbody`,
+    { children: /* @__PURE__ */ jsx(TableRows, { ...props, disableRemove: doDisableRemove }) },
+    props,
+    { withAllProps: false }
+  );
+  const tbodyEl = TbodyComponent === void 0 ? /* @__PURE__ */ jsx(Table.Tbody, { ..._tbodyProps }) : TbodyComponent;
+  const [Component, _props] = useContextProps(
+    "Table",
+    `${path}.Table`,
+    {
+      children: /* @__PURE__ */ jsxs(Fragment, { children: [
+        theadEl,
+        tbodyEl
+      ] })
+    },
+    props,
+    { withAllProps: false }
+  );
+  if (!visible) {
+    return null;
   }
-  return Component;
+  return Component === void 0 ? /* @__PURE__ */ jsx(Table, { ..._props }) : Component;
 });
 export {
   MantineTableControl,

package/dist/jsonforms/esm/complex/MantineTableControl/TableToolbar.mjs

@@ -1,7 +1,8 @@
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { createDefaultValue } from "@jsonforms/core";
 import { Table } from "@mantine/core";
 import { memo } from "react";
+import { useContextProps } from "../../hooks/useContextProps.mjs";
 import { useToolbarComponent } from "../../hooks/useToolbarComponent.mjs";
 import { NoBorderTableCell } from "./NoBorderTableCell.mjs";
 const fixedCellSmall = {
@@ -16,10 +17,35 @@ const TableToolbar = memo(function TableToolbar2(props) {
     onAdd: addItem(path, createDefaultValue(schema, rootSchema)),
     ...props
   });
-  return /* @__PURE__ */ jsxs(Table.Tr, { children: [
-    /* @__PURE__ */ jsx(NoBorderTableCell, { p: 0, colSpan: numColumns, children: ToolbarComponent }),
-    enabled && ToolbarAdd && /* @__PURE__ */ jsx(NoBorderTableCell, { p: 0, align: "right", style: fixedCellSmall, children: ToolbarAdd })
-  ] });
+  const [ToolbarCell, _toolbarCellProps] = useContextProps(
+    "Table.Header.Toolbar.Cell",
+    `${path}.Header.Toolbar.Cell`,
+    { p: 0, colSpan: numColumns, children: ToolbarComponent },
+    props,
+    { withAllProps: false }
+  );
+  const [ToolbarAddCell, _toolbarAddCellProps] = useContextProps(
+    "Table.Header.Toolbar.Add",
+    `${path}.Header.Toolbar.Add`,
+    { p: 0, align: "right", style: fixedCellSmall, children: ToolbarAdd },
+    props,
+    { withAllProps: false }
+  );
+  const toolbarCellEl = ToolbarCell === void 0 ? /* @__PURE__ */ jsx(NoBorderTableCell, { ..._toolbarCellProps }) : ToolbarCell;
+  const toolbarAddCellEl = ToolbarAddCell === void 0 ? /* @__PURE__ */ jsx(NoBorderTableCell, { ..._toolbarAddCellProps }) : ToolbarAddCell;
+  const [ToolbarTr, _toolbarTrProps] = useContextProps(
+    "Table.Header.Toolbar",
+    `${path}.Header.Toolbar`,
+    {
+      children: /* @__PURE__ */ jsxs(Fragment, { children: [
+        toolbarCellEl,
+        enabled && ToolbarAdd && toolbarAddCellEl
+      ] })
+    },
+    props,
+    { withAllProps: false }
+  );
+  return ToolbarTr === void 0 ? /* @__PURE__ */ jsx(Table.Tr, { ..._toolbarTrProps }) : ToolbarTr;
 });
 export {
   TableToolbar

package/dist/jsonforms/esm/hooks/useContextProps.mjs

@@ -11,13 +11,11 @@ function useContextProps(name, path, componentProps, jsonFormsProps, { withAllPr
     () => deepMerge(withAllProps ? allProps : void 0, _componentProps, contextProps),
     [_componentProps, allProps, contextProps, withAllProps]
   );
-  return [
-    parseFromValuesOrFunc(component, { componentProps, jsonFormsProps }),
-    {
-      ...withComponentProps ? componentProps : {},
-      ...parseFromValuesOrFunc(props, { componentProps, jsonFormsProps })
-    }
-  ];
+  const mergedProps = {
+    ...withComponentProps ? componentProps : {},
+    ...parseFromValuesOrFunc(props, { componentProps, jsonFormsProps })
+  };
+  return [parseFromValuesOrFunc(component, { componentProps: mergedProps, jsonFormsProps }), mergedProps];
 }
 export {
   useContextProps

package/dist/jsonforms/esm/hooks/useNavigationComponent.mjs

@@ -1,6 +1,6 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useContextProps } from "./useContextProps.mjs";
-import { useProps, Grid, ActionIcon } from "@mantine/core";
+import { useProps, ActionIcon, Grid } from "@mantine/core";
 import { useMemo } from "react";
 import ForwardRef$1 from "../_virtual/arrow-down.mjs";
 import ForwardRef from "../_virtual/arrow-up.mjs";
@@ -18,7 +18,8 @@ const useNavigationComponent = (props) => {
       ["aria-label"]: translations == null ? void 0 : translations.upAriaLabel,
       onClick: onUp,
       disabled: !enableUp,
-      ...iconProps
+      ...iconProps,
+      children: /* @__PURE__ */ jsx(ForwardRef, {})
     },
     rest,
     { withAllProps: false }
@@ -31,7 +32,8 @@ const useNavigationComponent = (props) => {
       ["aria-label"]: translations == null ? void 0 : translations.downAriaLabel,
       onClick: onDown,
       disabled: !enableDown,
-      ...iconProps
+      ...iconProps,
+      children: /* @__PURE__ */ jsx(ForwardRef$1, {})
     },
     rest,
     { withAllProps: false }
@@ -44,22 +46,44 @@ const useNavigationComponent = (props) => {
       title: translations == null ? void 0 : translations.removeTooltip,
       ["aria-label"]: translations == null ? void 0 : translations.removeAriaLabel,
       onClick: onDelete,
-      ...iconProps
+      ...iconProps,
+      children: /* @__PURE__ */ jsx(ForwardRef$2, {})
     },
     rest,
     { withAllProps: false }
   );
+  const [ComponentUpCol, _up_col_props] = useContextProps(
+    `${componentName}.${componentIdentifier}.Up.Col`,
+    `${childPath}.${componentIdentifier}.Up.Col`,
+    { span: "content", children: /* @__PURE__ */ jsx(ActionIcon, { ..._up_props }) },
+    rest,
+    { withAllProps: false }
+  );
+  const [ComponentDownCol, _down_col_props] = useContextProps(
+    `${componentName}.${componentIdentifier}.Down.Col`,
+    `${childPath}.${componentIdentifier}.Down.Col`,
+    { span: "content", children: /* @__PURE__ */ jsx(ActionIcon, { ..._down_props }) },
+    rest,
+    { withAllProps: false }
+  );
+  const [ComponentRemoveCol, _remove_col_props] = useContextProps(
+    `${componentName}.${componentIdentifier}.Remove.Col`,
+    `${childPath}.${componentIdentifier}.Remove.Col`,
+    { span: "content", children: /* @__PURE__ */ jsx(ActionIcon, { ..._remove_props }) },
+    rest,
+    { withAllProps: false }
+  );
   const ActionIconUp = useMemo(
-    () => ComponentUp === void 0 ? /* @__PURE__ */ jsx(Grid.Col, { span: "content", children: /* @__PURE__ */ jsx(ActionIcon, { ..._up_props, children: /* @__PURE__ */ jsx(ForwardRef, {}) }) }) : ComponentUp,
-    [ComponentUp, _up_props]
+    () => ComponentUp === void 0 ? ComponentUpCol === void 0 ? /* @__PURE__ */ jsx(Grid.Col, { ..._up_col_props }) : ComponentUpCol : ComponentUp,
+    [ComponentUp, ComponentUpCol, _up_col_props]
   );
   const ActionIconDown = useMemo(
-    () => ComponentDown === void 0 ? /* @__PURE__ */ jsx(Grid.Col, { span: "content", children: /* @__PURE__ */ jsx(ActionIcon, { ..._down_props, children: /* @__PURE__ */ jsx(ForwardRef$1, {}) }) }) : ComponentDown,
-    [ComponentDown, _down_props]
+    () => ComponentDown === void 0 ? ComponentDownCol === void 0 ? /* @__PURE__ */ jsx(Grid.Col, { ..._down_col_props }) : ComponentDownCol : ComponentDown,
+    [ComponentDown, ComponentDownCol, _down_col_props]
   );
   const ActionIconRemove = useMemo(
-    () => ComponentRemove === void 0 ? /* @__PURE__ */ jsx(Grid.Col, { span: "content", children: /* @__PURE__ */ jsx(ActionIcon, { ..._remove_props, children: /* @__PURE__ */ jsx(ForwardRef$2, {}) }) }) : ComponentRemove,
-    [ComponentRemove, _remove_props]
+    () => ComponentRemove === void 0 ? ComponentRemoveCol === void 0 ? /* @__PURE__ */ jsx(Grid.Col, { ..._remove_col_props }) : ComponentRemoveCol : ComponentRemove,
+    [ComponentRemove, ComponentRemoveCol, _remove_col_props]
   );
   const SortButtons = useMemo(
     () => /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -74,10 +98,21 @@ const useNavigationComponent = (props) => {
   );
   const enableRemove = useMemo(() => !disableRemove && !!ActionIconRemove, [disableRemove, ActionIconRemove]);
   const showComponent = useMemo(() => enableSort || enableRemove, [enableSort, enableRemove]);
-  return showComponent ? /* @__PURE__ */ jsxs(Grid, { justify: "flex-end", align: "center", children: [
-    enableSort && SortButtons,
-    enableRemove && ActionIconRemove
-  ] }) : void 0;
+  const [ComponentGrid, _grid_props] = useContextProps(
+    `${componentName}.${componentIdentifier}.Grid`,
+    `${childPath}.${componentIdentifier}.Grid`,
+    {
+      justify: "flex-end",
+      align: "center",
+      children: /* @__PURE__ */ jsxs(Fragment, { children: [
+        enableSort && SortButtons,
+        enableRemove && ActionIconRemove
+      ] })
+    },
+    rest,
+    { withAllProps: false }
+  );
+  return showComponent ? ComponentGrid === void 0 ? /* @__PURE__ */ jsx(Grid, { ..._grid_props }) : ComponentGrid : void 0;
 };
 export {
   useNavigationComponent

package/dist/jsonforms/esm/hooks/useToolbarComponent.mjs

@@ -1,4 +1,4 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useContextProps } from "./useContextProps.mjs";
 import { useProps, Input, ActionIcon, Flex, Tooltip, Indicator, Stack, Text } from "@mantine/core";
 import ForwardRef$1 from "../_virtual/exclamation-circle.mjs";
@@ -64,7 +64,8 @@ const useToolbarComponent = (props) => {
       id: "tooltip-add",
       title: translations == null ? void 0 : translations.addTooltip,
       onClick: onAdd,
-      ...iconProps
+      ...iconProps,
+      children: /* @__PURE__ */ jsx(ForwardRef, {})
     },
     rest,
     {}
@@ -72,18 +73,37 @@ const useToolbarComponent = (props) => {
   const TextLabel = ComponentLabel === void 0 ? (_label_props == null ? void 0 : _label_props.value) ? /* @__PURE__ */ jsx(Input.Label, { children: _label_props == null ? void 0 : _label_props.value }) : null : ComponentLabel;
   const TextDescription = ComponentDescription === void 0 ? (_description_props == null ? void 0 : _description_props.value) ? /* @__PURE__ */ jsx(Input.Description, { children: _description_props == null ? void 0 : _description_props.value }) : null : ComponentDescription;
   const IconValidation = ComponentValidation === void 0 ? /* @__PURE__ */ jsx(ValidationIcon, { ..._validation_props }) : ComponentValidation;
-  const ActionIconAdd = ComponentAdd === void 0 ? /* @__PURE__ */ jsx(ActionIcon, { ..._add_props, children: /* @__PURE__ */ jsx(ForwardRef, {}) }) : ComponentAdd;
-  return [
-    // eslint-disable-next-line react/jsx-key
-    /* @__PURE__ */ jsxs(Input.Wrapper, { children: [
-      /* @__PURE__ */ jsxs(Flex, { justify: "flex-start", align: "center", gap: "sm", children: [
+  const ActionIconAdd = ComponentAdd === void 0 ? /* @__PURE__ */ jsx(ActionIcon, { ..._add_props }) : ComponentAdd;
+  const [ComponentFlex, _flex_props] = useContextProps(
+    `${componentName}.${componentIdentifier}.Flex`,
+    `${path}.${componentIdentifier}.Flex`,
+    {
+      justify: "flex-start",
+      align: "center",
+      gap: "sm",
+      children: /* @__PURE__ */ jsxs(Fragment, { children: [
         TextLabel,
         IconValidation
-      ] }),
-      TextDescription
-    ] }),
-    ActionIconAdd
-  ];
+      ] })
+    },
+    rest,
+    { withAllProps: false }
+  );
+  const flexEl = ComponentFlex === void 0 ? /* @__PURE__ */ jsx(Flex, { ..._flex_props }) : ComponentFlex;
+  const [ComponentWrapper, _wrapper_props] = useContextProps(
+    `${componentName}.${componentIdentifier}.Wrapper`,
+    `${path}.${componentIdentifier}.Wrapper`,
+    {
+      children: /* @__PURE__ */ jsxs(Fragment, { children: [
+        flexEl,
+        TextDescription
+      ] })
+    },
+    rest,
+    { withAllProps: false }
+  );
+  const wrapperEl = ComponentWrapper === void 0 ? /* @__PURE__ */ jsx(Input.Wrapper, { ..._wrapper_props }) : ComponentWrapper;
+  return [wrapperEl, ActionIconAdd];
 };
 export {
   useToolbarComponent

package/dist/jsonforms/esm/labels/MantineLabelRenderer.mjs

@@ -2,12 +2,20 @@ import { jsx } from "react/jsx-runtime";
 import { rankWith, isLabelable } from "@jsonforms/core";
 import { withJsonFormsLabelProps } from "@jsonforms/react";
 import { Title } from "@mantine/core";
+import { useContextProps } from "../hooks/useContextProps.mjs";
 const Component = (props) => {
   const { text, visible } = props;
+  const [CustomComponent, _props] = useContextProps(
+    "Label",
+    `Label.${text}`,
+    { fw: "bold", size: "xl", children: text },
+    props,
+    { withAllProps: false }
+  );
   if (!visible) {
     return null;
   }
-  return /* @__PURE__ */ jsx(Title, { fw: "bold", size: "xl", children: text });
+  return CustomComponent === void 0 ? /* @__PURE__ */ jsx(Title, { ..._props }) : CustomComponent;
 };
 const mantineLabelTester = rankWith(1, isLabelable);
 const MantineLabelRenderer = withJsonFormsLabelProps(Component);

package/dist/jsonforms/esm/layouts/Array/ArrayToolbar.mjs

@@ -1,6 +1,7 @@
-import { jsxs } from "react/jsx-runtime";
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { Group } from "@mantine/core";
 import React from "react";
+import { useContextProps } from "../../hooks/useContextProps.mjs";
 import { useToolbarComponent } from "../../hooks/useToolbarComponent.mjs";
 const ArrayLayoutToolbar = React.memo(function ArrayLayoutToolbar2(props) {
   const { addItem, path, enabled, createDefault } = props;
@@ -10,10 +11,20 @@ const ArrayLayoutToolbar = React.memo(function ArrayLayoutToolbar2(props) {
     onAdd: addItem(path, createDefault()),
     ...props
   });
-  return /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
-    ToolbarComponent,
-    enabled && ToolbarAdd
-  ] });
+  const [ToolbarGroup, _toolbarGroupProps] = useContextProps(
+    "Array.Header.Group",
+    `${path}.Header.Group`,
+    {
+      justify: "space-between",
+      children: /* @__PURE__ */ jsxs(Fragment, { children: [
+        ToolbarComponent,
+        enabled && ToolbarAdd
+      ] })
+    },
+    props,
+    { withAllProps: false }
+  );
+  return ToolbarGroup === void 0 ? /* @__PURE__ */ jsx(Group, { ..._toolbarGroupProps }) : ToolbarGroup;
 });
 export {
   ArrayLayoutToolbar

package/dist/jsonforms/esm/layouts/Array/ExpandPanelRenderer.mjs

@@ -1,9 +1,10 @@
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { createId, removeId, findUISchema, Paths, computeChildLabel, update, moveDown, moveUp } from "@jsonforms/core";
 import { JsonFormsDispatch, withJsonFormsContext } from "@jsonforms/react";
-import { Accordion, Center, Group, Stack, Avatar } from "@mantine/core";
+import { Avatar, Stack, Group, Accordion, Center } from "@mantine/core";
 import merge from "../../_virtual/merge.mjs";
 import React, { useState, useEffect, useMemo, useCallback } from "react";
+import { useContextProps } from "../../hooks/useContextProps.mjs";
 import { useNavigationComponent } from "../../hooks/useNavigationComponent.mjs";
 const Component = (props) => {
   const [labelHtmlId] = useState(createId("expand-panel"));
@@ -45,24 +46,88 @@ const Component = (props) => {
     showSortButtons,
     ...props
   });
-  return /* @__PURE__ */ jsxs(Accordion.Item, { value: childPath, children: [
-    /* @__PURE__ */ jsx(Center, { children: /* @__PURE__ */ jsx(Accordion.Control, { component: "div", icon: /* @__PURE__ */ jsx(Avatar, { children: index + 1 }), children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", pr: "md", children: [
-      /* @__PURE__ */ jsx(Stack, { children: childLabel }),
-      NavigationComponent
-    ] }) }) }),
-    /* @__PURE__ */ jsx(Accordion.Panel, { children: /* @__PURE__ */ jsx(
-      JsonFormsDispatch,
-      {
-        enabled,
-        schema,
-        uischema: foundUISchema,
-        path: childPath,
-        renderers,
-        cells
-      },
-      childPath
-    ) })
-  ] });
+  const [AvatarComp, _avatarProps] = useContextProps(
+    "Array.Item.Avatar",
+    `${childPath}.Item.Avatar`,
+    { children: index + 1 },
+    props,
+    { withAllProps: false }
+  );
+  const avatarEl = AvatarComp === void 0 ? /* @__PURE__ */ jsx(Avatar, { ..._avatarProps }) : AvatarComp;
+  const [StackComp, _stackProps] = useContextProps(
+    "Array.Item.Stack",
+    `${childPath}.Item.Stack`,
+    { children: childLabel },
+    props,
+    { withAllProps: false }
+  );
+  const stackEl = StackComp === void 0 ? /* @__PURE__ */ jsx(Stack, { ..._stackProps }) : StackComp;
+  const [GroupComp, _groupProps] = useContextProps(
+    "Array.Item.Group",
+    `${childPath}.Item.Group`,
+    {
+      justify: "space-between",
+      pr: "md",
+      children: /* @__PURE__ */ jsxs(Fragment, { children: [
+        stackEl,
+        NavigationComponent
+      ] })
+    },
+    props,
+    { withAllProps: false }
+  );
+  const groupEl = GroupComp === void 0 ? /* @__PURE__ */ jsx(Group, { ..._groupProps }) : GroupComp;
+  const [ControlComp, _controlProps] = useContextProps(
+    "Array.Item.Control",
+    `${childPath}.Item.Control`,
+    { component: "div", icon: avatarEl, children: groupEl },
+    props,
+    { withAllProps: false }
+  );
+  const controlEl = ControlComp === void 0 ? /* @__PURE__ */ jsx(Accordion.Control, { ..._controlProps }) : ControlComp;
+  const [CenterComp, _centerProps] = useContextProps(
+    "Array.Item.Center",
+    `${childPath}.Item.Center`,
+    { children: controlEl },
+    props,
+    { withAllProps: false }
+  );
+  const centerEl = CenterComp === void 0 ? /* @__PURE__ */ jsx(Center, { ..._centerProps }) : CenterComp;
+  const [PanelComp, _panelProps] = useContextProps(
+    "Array.Item.Panel",
+    `${childPath}.Item.Panel`,
+    {
+      children: /* @__PURE__ */ jsx(
+        JsonFormsDispatch,
+        {
+          enabled,
+          schema,
+          uischema: foundUISchema,
+          path: childPath,
+          renderers,
+          cells
+        },
+        childPath
+      )
+    },
+    props,
+    { withAllProps: false }
+  );
+  const panelEl = PanelComp === void 0 ? /* @__PURE__ */ jsx(Accordion.Panel, { ..._panelProps }) : PanelComp;
+  const [ItemComp, _itemProps] = useContextProps(
+    "Array.Item.Accordion",
+    `${childPath}.Item.Accordion`,
+    {
+      value: childPath,
+      children: /* @__PURE__ */ jsxs(Fragment, { children: [
+        centerEl,
+        panelEl
+      ] })
+    },
+    props,
+    { withAllProps: false }
+  );
+  return ItemComp === void 0 ? /* @__PURE__ */ jsx(Accordion.Item, { value: childPath, ..._itemProps }) : ItemComp;
 };
 const MemoComponent = React.memo(Component);
 const useCtxDispatchToExpandPanelProps = (dispatch) => ({