@headless-adminapp/fluent 0.0.17-alpha.53 → 0.0.17-alpha.55

package/PageBoard/BoardColumnUI.js

@@ -1,31 +1,26 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Body1Strong, tokens } from '@fluentui/react-components';
-import { BoardColumnContext } from '@headless-adminapp/app/board/context';
-import { useBoardColumnConfig, useBoardColumnData, useBoardColumnDataState, useBoardConfig, } from '@headless-adminapp/app/board/hooks';
-import { useBaseCommandHandlerContext } from '@headless-adminapp/app/command/hooks';
-import { ScrollbarWithMoreDataRequest } from '@headless-adminapp/app/components/ScrollbarWithMoreDataRequest';
-import { useContextSelector } from '@headless-adminapp/app/mutable/context';
-import { useMemo, useRef } from 'react';
-import { useDrop } from 'react-dnd';
-import { BoardColumnCard } from './BoardColumnCard';
-import { BoardingColumnCardLoading } from './BoardingColumnCardLoading';
-export const BoardColumnUI = () => {
-    const data = useBoardColumnData();
-    const dataState = useBoardColumnDataState();
-    const fetchNextPage = useContextSelector(BoardColumnContext, (state) => state.fetchNextPage);
-    const { columnId, acceptSourceIds, title, updateFn } = useBoardColumnConfig();
-    const { PreviewComponent, schema, columnConfigs } = useBoardConfig();
-    const baseContext = useBaseCommandHandlerContext();
-    const ref = useRef(null);
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BoardColumnUI = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_components_1 = require("@fluentui/react-components");
+const context_1 = require("@headless-adminapp/app/board/context");
+const hooks_1 = require("@headless-adminapp/app/board/hooks");
+const hooks_2 = require("@headless-adminapp/app/command/hooks");
+const ScrollbarWithMoreDataRequest_1 = require("@headless-adminapp/app/components/ScrollbarWithMoreDataRequest");
+const context_2 = require("@headless-adminapp/app/mutable/context");
+const react_1 = require("react");
+const DndProvider_1 = require("../components/DndProvider");
+const BoardColumnCard_1 = require("./BoardColumnCard");
+const BoardingColumnCardLoading_1 = require("./BoardingColumnCardLoading");
+const BoardColumnUI = () => {
+    const data = (0, hooks_1.useBoardColumnData)();
+    const dataState = (0, hooks_1.useBoardColumnDataState)();
+    const fetchNextPage = (0, context_2.useContextSelector)(context_1.BoardColumnContext, (state) => state.fetchNextPage);
+    const { columnId, acceptSourceIds, title, updateFn } = (0, hooks_1.useBoardColumnConfig)();
+    const { PreviewComponent, schema, columnConfigs } = (0, hooks_1.useBoardConfig)();
+    const baseContext = (0, hooks_2.useBaseCommandHandlerContext)();
+    const { useDrop } = (0, DndProvider_1.useDndContext)();
+    const ref = (0, react_1.useRef)(null);
     const [{ handlerId, over, canDrop }, drop] = useDrop({
         accept: acceptSourceIds,
         collect(monitor) {
@@ -36,42 +31,46 @@ export const BoardColumnUI = () => {
             };
         },
         drop: (item) => {
-            (() => __awaiter(void 0, void 0, void 0, function* () {
-                yield (updateFn === null || updateFn === void 0 ? void 0 : updateFn(Object.assign(Object.assign({}, baseContext), { primaryControl: {
+            (async () => {
+                await updateFn?.({
+                    ...baseContext,
+                    primaryControl: {
                         logicalName: schema.logicalName,
                         id: item.id,
                         schema: schema,
-                    } })));
-            }))().catch(console.error);
+                    },
+                });
+            })().catch(console.error);
         },
     });
-    const canDrag = useMemo(() => {
+    const canDrag = (0, react_1.useMemo)(() => {
         return columnConfigs.some((config) => config.acceptSourceIds.length > 0);
     }, [columnConfigs]);
     drop(ref);
-    return (_jsxs("div", { ref: ref, style: {
+    return ((0, jsx_runtime_1.jsxs)("div", { ref: ref, style: {
             display: 'flex',
             flexDirection: 'column',
             flex: 1,
-            borderRadius: tokens.borderRadiusXLarge,
+            borderRadius: react_components_1.tokens.borderRadiusXLarge,
             outline: over
-                ? `2px dashed ${tokens.colorBrandBackground}`
+                ? `2px dashed ${react_components_1.tokens.colorBrandBackground}`
                 : canDrop
-                    ? `2px dashed ${tokens.colorNeutralStroke1}`
+                    ? `2px dashed ${react_components_1.tokens.colorNeutralStroke1}`
                     : 'none',
             outlineOffset: -5,
-            paddingTop: tokens.spacingVerticalS,
-        }, "data-handler-id": handlerId, children: [_jsx("div", { style: {
+            paddingTop: react_components_1.tokens.spacingVerticalS,
+        }, "data-handler-id": handlerId, children: [(0, jsx_runtime_1.jsx)("div", { style: {
                     display: 'flex',
-                    paddingInline: tokens.spacingHorizontalS,
+                    paddingInline: react_components_1.tokens.spacingHorizontalS,
                     alignItems: 'center',
-                }, children: _jsxs("div", { style: { display: 'flex', alignItems: 'center', width: '100%' }, children: [_jsx(Body1Strong, { children: title }), _jsx("div", { style: { flex: 1 } })] }) }), _jsx(ScrollbarWithMoreDataRequest, { data: data === null || data === void 0 ? void 0 : data.records, hasMore: dataState === null || dataState === void 0 ? void 0 : dataState.hasNextPage, onRequestMore: () => {
+                }, children: (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', alignItems: 'center', width: '100%' }, children: [(0, jsx_runtime_1.jsx)(react_components_1.Body1Strong, { children: title }), (0, jsx_runtime_1.jsx)("div", { style: { flex: 1 } })] }) }), (0, jsx_runtime_1.jsx)(ScrollbarWithMoreDataRequest_1.ScrollbarWithMoreDataRequest, { data: data?.records, hasMore: dataState?.hasNextPage, onRequestMore: () => {
                     fetchNextPage();
-                }, children: _jsxs("div", { style: {
+                }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
                         display: 'flex',
                         flexDirection: 'column',
-                        gap: tokens.spacingHorizontalM,
-                        padding: tokens.spacingHorizontalS,
-                    }, children: [data === null || data === void 0 ? void 0 : data.records.map((record, index) => (_jsx(BoardColumnCard, { record: record, index: index, columnId: columnId, canDrag: canDrag, PreviewComponent: PreviewComponent, schema: schema }, index))), dataState.isFetching &&
-                            Array.from({ length: 5 }).map((_, index) => (_jsx(BoardingColumnCardLoading, {}, index)))] }) })] }));
+                        gap: react_components_1.tokens.spacingHorizontalM,
+                        padding: react_components_1.tokens.spacingHorizontalS,
+                    }, children: [data?.records.map((record, index) => ((0, jsx_runtime_1.jsx)(BoardColumnCard_1.BoardColumnCard, { record: record, index: index, columnId: columnId, canDrag: canDrag, PreviewComponent: PreviewComponent, schema: schema }, index))), dataState.isFetching &&
+                            Array.from({ length: 5 }).map((_, index) => ((0, jsx_runtime_1.jsx)(BoardingColumnCardLoading_1.BoardingColumnCardLoading, {}, index)))] }) })] }));
 };
+exports.BoardColumnUI = BoardColumnUI;

package/PageBoard/BoardingColumnCardLoading.js

@@ -1,17 +1,20 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Skeleton, SkeletonItem, tokens } from '@fluentui/react-components';
-export function BoardingColumnCardLoading() {
-    return (_jsxs(Skeleton, { style: {
-            backgroundColor: tokens.colorNeutralBackground1,
-            borderRadius: tokens.borderRadiusLarge,
-            padding: tokens.spacingHorizontalM,
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BoardingColumnCardLoading = BoardingColumnCardLoading;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_components_1 = require("@fluentui/react-components");
+function BoardingColumnCardLoading() {
+    return ((0, jsx_runtime_1.jsxs)(react_components_1.Skeleton, { style: {
+            backgroundColor: react_components_1.tokens.colorNeutralBackground1,
+            borderRadius: react_components_1.tokens.borderRadiusLarge,
+            padding: react_components_1.tokens.spacingHorizontalM,
             display: 'flex',
             flexDirection: 'column',
-            gap: tokens.spacingVerticalM,
-        }, children: [_jsx(SkeletonItem, { style: {
+            gap: react_components_1.tokens.spacingVerticalM,
+        }, children: [(0, jsx_runtime_1.jsx)(react_components_1.SkeletonItem, { style: {
                     height: 16,
                     width: '100%',
-                } }), _jsx(SkeletonItem, { style: {
+                } }), (0, jsx_runtime_1.jsx)(react_components_1.SkeletonItem, { style: {
                     height: 16,
                     width: '50%',
                 } })] }));

package/PageBoard/Header.js

@@ -1,36 +1,31 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Header = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
 // eslint-disable-next-line simple-import-sort/imports
-import { Button, Caption1, SearchBox, Subtitle2, tokens, } from '@fluentui/react-components';
-import { useQueryClient } from '@tanstack/react-query';
-import { useSearchText, useBoardSchema, } from '@headless-adminapp/app/board/hooks';
-import { Icons } from '@headless-adminapp/icons';
-import { useAppStrings } from '../App/AppStringContext';
-export const Header = ({ title, subtitle }) => {
-    const client = useQueryClient();
-    const schema = useBoardSchema();
-    const [searchText, setSearchText] = useSearchText();
-    const appStrings = useAppStrings();
-    const refresh = () => __awaiter(void 0, void 0, void 0, function* () {
-        yield client.invalidateQueries({
+const react_components_1 = require("@fluentui/react-components");
+const react_query_1 = require("@tanstack/react-query");
+const hooks_1 = require("@headless-adminapp/app/board/hooks");
+const icons_1 = require("@headless-adminapp/icons");
+const AppStringContext_1 = require("../App/AppStringContext");
+const Header = ({ title, subtitle }) => {
+    const client = (0, react_query_1.useQueryClient)();
+    const schema = (0, hooks_1.useBoardSchema)();
+    const [searchText, setSearchText] = (0, hooks_1.useSearchText)();
+    const appStrings = (0, AppStringContext_1.useAppStrings)();
+    const refresh = async () => {
+        await client.invalidateQueries({
             queryKey: ['data', 'retriveRecords', schema.logicalName],
         });
-    });
-    return (_jsxs("div", { style: {
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", { style: {
             display: 'flex',
             alignItems: 'center',
-            gap: tokens.spacingHorizontalM,
-        }, children: [_jsx("div", { style: { flex: 1 }, children: _jsx("div", { children: _jsxs("div", { style: { display: 'flex', flexDirection: 'column' }, children: [_jsx(Subtitle2, { style: { color: tokens.colorNeutralForeground1 }, children: title }), _jsx(Caption1, { style: { color: tokens.colorNeutralForeground2 }, children: subtitle })] }) }) }), _jsxs("div", { style: {
+            gap: react_components_1.tokens.spacingHorizontalM,
+        }, children: [(0, jsx_runtime_1.jsx)("div", { style: { flex: 1 }, children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column' }, children: [(0, jsx_runtime_1.jsx)(react_components_1.Subtitle2, { style: { color: react_components_1.tokens.colorNeutralForeground1 }, children: title }), (0, jsx_runtime_1.jsx)(react_components_1.Caption1, { style: { color: react_components_1.tokens.colorNeutralForeground2 }, children: subtitle })] }) }) }), (0, jsx_runtime_1.jsxs)("div", { style: {
                     display: 'flex',
                     alignItems: 'center',
-                    gap: tokens.spacingHorizontalS,
-                }, children: [_jsx(SearchBox, { appearance: "filled-darker", placeholder: appStrings.searchPlaceholder, value: searchText, onChange: (e, data) => setSearchText(data.value) }), _jsx(Button, { appearance: "subtle", icon: _jsx(Icons.Refresh, { size: 20 }), onClick: refresh })] })] }));
+                    gap: react_components_1.tokens.spacingHorizontalS,
+                }, children: [(0, jsx_runtime_1.jsx)(react_components_1.SearchBox, { appearance: "filled-darker", placeholder: appStrings.searchPlaceholder, value: searchText, onChange: (e, data) => setSearchText(data.value) }), (0, jsx_runtime_1.jsx)(react_components_1.Button, { appearance: "subtle", icon: (0, jsx_runtime_1.jsx)(icons_1.Icons.Refresh, { size: 20 }), onClick: refresh })] })] }));
 };
+exports.Header = Header;

package/PageBoard/PageBoard.js

@@ -1,44 +1,46 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { tokens } from '@fluentui/react-components';
-import { BoardContext, } from '@headless-adminapp/app/board/context';
-import { useCreateContextStore, } from '@headless-adminapp/app/mutable/context';
-import { useEffect } from 'react';
-import { DndProvider } from 'react-dnd';
-import { HTML5Backend } from 'react-dnd-html5-backend';
-import { BoardColumn } from './BoardColumn';
-import { Header } from './Header';
-export function PageBoard(props) {
-    const contextValue = useCreateContextStore({
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PageBoard = PageBoard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_components_1 = require("@fluentui/react-components");
+const context_1 = require("@headless-adminapp/app/board/context");
+const context_2 = require("@headless-adminapp/app/mutable/context");
+const react_1 = require("react");
+const DndProvider_1 = require("../components/DndProvider");
+const BoardColumn_1 = require("./BoardColumn");
+const Header_1 = require("./Header");
+function PageBoard(props) {
+    const contextValue = (0, context_2.useCreateContextStore)({
         config: props.config,
         searchText: '',
     });
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         contextValue.setValue({
             config: props.config,
             searchText: '',
         });
     }, [contextValue, props.config]);
-    return (_jsx(BoardContext.Provider, { value: contextValue, children: _jsx(DndProvider, { backend: HTML5Backend, children: _jsxs("div", { style: {
+    return ((0, jsx_runtime_1.jsx)(context_1.BoardContext.Provider, { value: contextValue, children: (0, jsx_runtime_1.jsx)(DndProvider_1.DndProvider, { children: (0, jsx_runtime_1.jsxs)("div", { style: {
                     display: 'flex',
                     flexDirection: 'column',
                     flex: 1,
-                    gap: tokens.spacingVerticalM,
-                    padding: tokens.spacingHorizontalL,
-                    background: tokens.colorNeutralBackground3,
-                }, children: [_jsx("div", { children: _jsx("div", { style: {
+                    gap: react_components_1.tokens.spacingVerticalM,
+                    padding: react_components_1.tokens.spacingHorizontalL,
+                    background: react_components_1.tokens.colorNeutralBackground3,
+                }, children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("div", { style: {
                                 display: 'flex',
                                 flexDirection: 'column',
-                                background: tokens.colorNeutralBackground1,
-                                borderRadius: tokens.borderRadiusLarge,
-                                paddingBlock: tokens.spacingVerticalM,
-                                paddingInline: tokens.spacingHorizontalM,
-                                gap: tokens.spacingVerticalM,
-                                boxShadow: tokens.shadow4,
-                            }, children: _jsx(Header, { title: props.config.title, subtitle: props.config.description }) }) }), _jsx("div", { style: {
+                                background: react_components_1.tokens.colorNeutralBackground1,
+                                borderRadius: react_components_1.tokens.borderRadiusLarge,
+                                paddingBlock: react_components_1.tokens.spacingVerticalM,
+                                paddingInline: react_components_1.tokens.spacingHorizontalM,
+                                gap: react_components_1.tokens.spacingVerticalM,
+                                boxShadow: react_components_1.tokens.shadow4,
+                            }, children: (0, jsx_runtime_1.jsx)(Header_1.Header, { title: props.config.title, subtitle: props.config.description }) }) }), (0, jsx_runtime_1.jsx)("div", { style: {
                             display: 'flex',
                             flexDirection: 'row',
                             flex: 1,
                             marginInline: -6,
-                            marginTop: tokens.spacingVerticalM,
-                        }, children: props.config.columnConfigs.map((config) => (_jsx(BoardColumn, { config: config }, config.columnId))) })] }) }) }));
+                            marginTop: react_components_1.tokens.spacingVerticalM,
+                        }, children: props.config.columnConfigs.map((config) => ((0, jsx_runtime_1.jsx)(BoardColumn_1.BoardColumn, { config: config }, config.columnId))) })] }) }) }));
 }

package/PageBoard/index.js

@@ -1 +1,5 @@
-export { PageBoard } from './PageBoard';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PageBoard = void 0;
+var PageBoard_1 = require("./PageBoard");
+Object.defineProperty(exports, "PageBoard", { enumerable: true, get: function () { return PageBoard_1.PageBoard; } });

package/PageEntityForm/CommandContainer.js

@@ -1,26 +1,29 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useDataFormSchema, useMainFormCommands, } from '@headless-adminapp/app/dataform/hooks';
-import { useIsMobile } from '@headless-adminapp/app/hooks';
-import { useContextSelector } from '@headless-adminapp/app/mutable';
-import { RecordSetContext } from '@headless-adminapp/app/recordset';
-import { useRecordSetVisibility } from '@headless-adminapp/app/recordset/hooks';
-import { useRouter } from '@headless-adminapp/app/route/hooks';
-import { Icons } from '@headless-adminapp/icons';
-import { useMemo } from 'react';
-import { OverflowCommandBar } from '../OverflowCommandBar';
-export const CommandContainer = () => {
-    const gridCommands = useMainFormCommands();
-    const router = useRouter();
-    const isMobile = useIsMobile();
-    const schema = useDataFormSchema();
-    const [recordSetVisible, setRecordSetVisible] = useRecordSetVisibility();
-    const recordSetContext = useContextSelector(RecordSetContext, (state) => state);
-    const extendedCommands = useMemo(() => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CommandContainer = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const hooks_1 = require("@headless-adminapp/app/dataform/hooks");
+const hooks_2 = require("@headless-adminapp/app/hooks");
+const mutable_1 = require("@headless-adminapp/app/mutable");
+const recordset_1 = require("@headless-adminapp/app/recordset");
+const hooks_3 = require("@headless-adminapp/app/recordset/hooks");
+const hooks_4 = require("@headless-adminapp/app/route/hooks");
+const icons_1 = require("@headless-adminapp/icons");
+const react_1 = require("react");
+const OverflowCommandBar_1 = require("../OverflowCommandBar");
+const CommandContainer = () => {
+    const gridCommands = (0, hooks_1.useMainFormCommands)();
+    const router = (0, hooks_4.useRouter)();
+    const isMobile = (0, hooks_2.useIsMobile)();
+    const schema = (0, hooks_1.useDataFormSchema)();
+    const [recordSetVisible, setRecordSetVisible] = (0, hooks_3.useRecordSetVisibility)();
+    const recordSetContext = (0, mutable_1.useContextSelector)(recordset_1.RecordSetContext, (state) => state);
+    const extendedCommands = (0, react_1.useMemo)(() => {
         return [
             [
                 {
                     type: 'icon',
-                    Icon: Icons.ArrowLeft,
+                    Icon: icons_1.Icons.ArrowLeft,
                     onClick: () => {
                         router.back();
                     },
@@ -33,7 +36,7 @@ export const CommandContainer = () => {
                     [
                         {
                             type: 'icon',
-                            Icon: Icons.ListLtr,
+                            Icon: icons_1.Icons.ListLtr,
                             onClick: () => {
                                 setRecordSetVisible(!recordSetVisible);
                             },
@@ -53,5 +56,6 @@ export const CommandContainer = () => {
         schema.logicalName,
         setRecordSetVisible,
     ]);
-    return _jsx(OverflowCommandBar, { commands: extendedCommands });
+    return (0, jsx_runtime_1.jsx)(OverflowCommandBar_1.OverflowCommandBar, { commands: extendedCommands });
 };
+exports.CommandContainer = CommandContainer;

package/PageEntityForm/FormTabRelated.js

@@ -1,35 +1,38 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { tokens } from '@fluentui/react-components';
-import { useDataFormSchema, useRecordId, } from '@headless-adminapp/app/dataform/hooks';
-import { FormTab } from '../form/layout/FormTab';
-import { SubgridControl } from './SubgridControl';
-export function FormTabRelated({ selectedRelatedItem }) {
-    const recordId = useRecordId();
-    const schema = useDataFormSchema();
-    return (_jsx(FormTab, { value: "related", noWrapper: true, children: _jsx("div", { style: {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormTabRelated = FormTabRelated;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_components_1 = require("@fluentui/react-components");
+const hooks_1 = require("@headless-adminapp/app/dataform/hooks");
+const FormTab_1 = require("../form/layout/FormTab");
+const SubgridControl_1 = require("./SubgridControl");
+function FormTabRelated({ selectedRelatedItem }) {
+    const recordId = (0, hooks_1.useRecordId)();
+    const schema = (0, hooks_1.useDataFormSchema)();
+    return ((0, jsx_runtime_1.jsx)(FormTab_1.FormTab, { value: "related", noWrapper: true, children: (0, jsx_runtime_1.jsx)("div", { style: {
                 display: 'flex',
                 flexDirection: 'column',
                 flex: 1,
-            }, children: _jsx("div", { style: {
+            }, children: (0, jsx_runtime_1.jsx)("div", { style: {
                     display: 'flex',
                     flexDirection: 'column',
                     flex: 1,
-                }, children: _jsx("div", { style: {
+                }, children: (0, jsx_runtime_1.jsx)("div", { style: {
                         display: 'flex',
                         flexDirection: 'column',
-                        boxShadow: tokens.shadow2,
-                        borderRadius: tokens.borderRadiusMedium,
-                        background: tokens.colorNeutralBackground1,
+                        boxShadow: react_components_1.tokens.shadow2,
+                        borderRadius: react_components_1.tokens.borderRadiusMedium,
+                        background: react_components_1.tokens.colorNeutralBackground1,
                         flex: 1,
-                    }, children: _jsx("div", { style: {
+                    }, children: (0, jsx_runtime_1.jsx)("div", { style: {
                             flex: 1,
                             display: 'flex',
                             flexDirection: 'column',
-                        }, children: _jsx("div", { style: {
+                        }, children: (0, jsx_runtime_1.jsx)("div", { style: {
                                 flex: 1,
                                 display: 'flex',
                                 flexDirection: 'column',
-                            }, children: !!selectedRelatedItem && (_jsx(SubgridControl, { logicalName: selectedRelatedItem.logicalName, allowViewSelection: true, associated: {
+                            }, children: !!selectedRelatedItem && ((0, jsx_runtime_1.jsx)(SubgridControl_1.SubgridControl, { logicalName: selectedRelatedItem.logicalName, allowViewSelection: true, associated: {
                                     logicalName: schema.logicalName,
                                     id: recordId,
                                     refAttributeName: selectedRelatedItem.attributeName,

package/PageEntityForm/PageEntityForm.js

@@ -1,26 +1,30 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { tokens } from '@fluentui/react-components';
-import { useLoadFormGridPage } from '@headless-adminapp/app/dataform/hooks';
-import { PageEntityFormProvider } from '@headless-adminapp/app/providers/PageEntityFormProvider';
-import { Icons } from '@headless-adminapp/icons';
-import { PageBroken } from '../components/PageBroken';
-import { PageLoading } from '../components/PageLoading';
-import { PageEntityFormDesktopContainer } from './PageEntityFormDesktopContainer';
-import { RecordSetNavigatorContainer } from './RecordSetNavigatorContainer';
-export const PageEntityForm = ({ logicalName, formId, recordId, }) => {
-    const result = useLoadFormGridPage(logicalName, formId);
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PageEntityForm = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_components_1 = require("@fluentui/react-components");
+const hooks_1 = require("@headless-adminapp/app/dataform/hooks");
+const PageEntityFormProvider_1 = require("@headless-adminapp/app/providers/PageEntityFormProvider");
+const icons_1 = require("@headless-adminapp/icons");
+const PageBroken_1 = require("../components/PageBroken");
+const PageLoading_1 = require("../components/PageLoading");
+const PageEntityFormDesktopContainer_1 = require("./PageEntityFormDesktopContainer");
+const RecordSetNavigatorContainer_1 = require("./RecordSetNavigatorContainer");
+const PageEntityForm = ({ logicalName, formId, recordId, }) => {
+    const result = (0, hooks_1.useLoadFormGridPage)(logicalName, formId);
     if (result.loading) {
-        return _jsx(PageLoading, {});
+        return (0, jsx_runtime_1.jsx)(PageLoading_1.PageLoading, {});
     }
     if (result.error) {
-        return (_jsx(PageBroken, { Icon: Icons.Error, title: result.title, message: result.message }));
+        return ((0, jsx_runtime_1.jsx)(PageBroken_1.PageBroken, { Icon: icons_1.Icons.Error, title: result.title, message: result.message }));
     }
     const { schema, form, commands } = result;
-    return (_jsx(PageEntityFormProvider, { schema: schema, form: form, recordId: recordId, commands: commands, children: _jsxs("div", { style: {
+    return ((0, jsx_runtime_1.jsx)(PageEntityFormProvider_1.PageEntityFormProvider, { schema: schema, form: form, recordId: recordId, commands: commands, children: (0, jsx_runtime_1.jsxs)("div", { style: {
                 display: 'flex',
                 flex: 1,
                 flexDirection: 'row',
-                backgroundColor: tokens.colorNeutralBackground2,
+                backgroundColor: react_components_1.tokens.colorNeutralBackground2,
                 overflow: 'hidden',
-            }, children: [_jsx(RecordSetNavigatorContainer, {}), _jsx(PageEntityFormDesktopContainer, {})] }) }));
+            }, children: [(0, jsx_runtime_1.jsx)(RecordSetNavigatorContainer_1.RecordSetNavigatorContainer, {}), (0, jsx_runtime_1.jsx)(PageEntityFormDesktopContainer_1.PageEntityFormDesktopContainer, {})] }) }));
 };
+exports.PageEntityForm = PageEntityForm;