@webiny/app-admin 0.0.0-unstable.6f45466a1d → 0.0.0-unstable.7be00a75a9

package/features/formModel/FormModelFactory.d.ts

@@ -0,0 +1,11 @@
+import { type IFormModelFactory, type IFormModelConfig, type IFormModel, type IFieldBuilderRegistry, type IRuleEvaluator } from "./abstractions.js";
+declare class FormModelFactoryImpl implements IFormModelFactory {
+    private evaluators;
+    private registry;
+    constructor(evaluators: IRuleEvaluator[], registry: IFieldBuilderRegistry);
+    create<T = Record<string, any>>(config: IFormModelConfig): IFormModel<T>;
+}
+export declare const FormModelFactory: typeof FormModelFactoryImpl & {
+    __abstraction: import("@webiny/di").Abstraction<IFormModelFactory>;
+};
+export {};

package/features/formModel/FormModelFactory.js

@@ -0,0 +1,33 @@
+import { FormModel } from "./FormModel.js";
+import { FieldBuilderRegistry, FormModelFactory, RuleEvaluator } from "./abstractions.js";
+class FormModelFactoryImpl {
+    constructor(evaluators, registry){
+        this.evaluators = evaluators;
+        this.registry = registry;
+    }
+    create(config) {
+        const provided = config.ruleEvaluators ?? [];
+        return new FormModel({
+            ...config,
+            ruleEvaluators: [
+                ...this.evaluators,
+                ...provided
+            ]
+        }, this.registry);
+    }
+}
+const FormModelFactory_FormModelFactory = FormModelFactory.createImplementation({
+    implementation: FormModelFactoryImpl,
+    dependencies: [
+        [
+            RuleEvaluator,
+            {
+                multiple: true
+            }
+        ],
+        FieldBuilderRegistry
+    ]
+});
+export { FormModelFactory_FormModelFactory as FormModelFactory };
+
+//# sourceMappingURL=FormModelFactory.js.map

package/features/formModel/FormModelFactory.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"features/formModel/FormModelFactory.js","sources":["../../../src/features/formModel/FormModelFactory.ts"],"sourcesContent":["import { FormModel } from \"./FormModel.js\";\nimport {\n    FormModelFactory as Abstraction,\n    FieldBuilderRegistry,\n    RuleEvaluator,\n    type IFormModelFactory,\n    type IFormModelConfig,\n    type IFormModel,\n    type IFieldBuilderRegistry,\n    type IRuleEvaluator\n} from \"./abstractions.js\";\n\nclass FormModelFactoryImpl implements IFormModelFactory {\n    constructor(\n        private evaluators: IRuleEvaluator[],\n        private registry: IFieldBuilderRegistry\n    ) {}\n\n    create<T = Record<string, any>>(config: IFormModelConfig): IFormModel<T> {\n        const provided = config.ruleEvaluators ?? [];\n        return new FormModel(\n            {\n                ...config,\n                ruleEvaluators: [...this.evaluators, ...provided]\n            },\n            this.registry\n        ) as IFormModel<T>;\n    }\n}\n\nexport const FormModelFactory = Abstraction.createImplementation({\n    implementation: FormModelFactoryImpl,\n    dependencies: [[RuleEvaluator, { multiple: true }], FieldBuilderRegistry]\n});\n"],"names":["FormModelFactoryImpl","evaluators","registry","config","provided","FormModel","FormModelFactory","Abstraction","RuleEvaluator","FieldBuilderRegistry"],"mappings":";;AAYA,MAAMA;IACF,YACYC,UAA4B,EAC5BC,QAA+B,CACzC;aAFUD,UAAU,GAAVA;aACAC,QAAQ,GAARA;IACT;IAEH,OAAgCC,MAAwB,EAAiB;QACrE,MAAMC,WAAWD,OAAO,cAAc,IAAI,EAAE;QAC5C,OAAO,IAAIE,UACP;YACI,GAAGF,MAAM;YACT,gBAAgB;mBAAI,IAAI,CAAC,UAAU;mBAAKC;aAAS;QACrD,GACA,IAAI,CAAC,QAAQ;IAErB;AACJ;AAEO,MAAME,oCAAmBC,iBAAAA,oBAAgC,CAAC;IAC7D,gBAAgBP;IAChB,cAAc;QAAC;YAACQ;YAAe;gBAAE,UAAU;YAAK;SAAE;QAAEC;KAAqB;AAC7E"}

package/features/formModel/FormView.d.ts

@@ -0,0 +1,46 @@
+import React from "react";
+import type { IFormVM, LayoutNodeVM, IFieldVM, ITabsNodeVM } from "./abstractions.js";
+import type { Icon } from "../../components/IconPicker/types.js";
+export declare function renderTabIcon(icon: Icon | undefined): React.ReactElement | undefined;
+/**
+ * A field renderer component receives a FieldVM and renders the appropriate UI.
+ */
+export type FieldRendererComponent = React.ComponentType<{
+    field: IFieldVM;
+}>;
+/**
+ * Map of renderer keys to React components for fields.
+ * Lookup order: `{type}:{renderer}` → `{type}`.
+ */
+export type FieldRenderers = Record<string, FieldRendererComponent>;
+/**
+ * Map of renderer keys to React components for layout nodes.
+ */
+export type LayoutRenderers = Record<string, React.ComponentType<any>>;
+interface FormViewRenderers {
+    fieldRenderers: FieldRenderers;
+    layoutRenderers: LayoutRenderers;
+}
+declare const useFormViewRenderers: () => FormViewRenderers;
+export { useFormViewRenderers };
+interface FormViewProps {
+    name: string;
+    form: IFormVM;
+    renderers?: FieldRenderers;
+    layoutRenderers?: LayoutRenderers;
+}
+/**
+ * Generic form view that walks layout nodes and renders fields.
+ * This component is stateless — it reads from the FormVM and delegates to renderers.
+ */
+export declare const FormView: (({ name, form, renderers, layoutRenderers }: FormViewProps) => React.JSX.Element) & {
+    displayName: string;
+};
+export declare const LayoutNodeRenderer: (({ node }: {
+    node: LayoutNodeVM;
+}) => React.JSX.Element | null) & {
+    displayName: string;
+};
+export interface TabsNodeRendererProps {
+    node: ITabsNodeVM;
+}

package/features/formModel/FormView.js

@@ -0,0 +1,187 @@
+import react, { createContext, useContext, useMemo } from "react";
+import { observer } from "mobx-react-lite";
+import { Grid, IconButton, Tabs, Tooltip, useToast } from "@webiny/admin-ui";
+import { ReactComponent } from "@webiny/icons/content_copy.svg";
+import { ReactComponent as content_paste_svg_ReactComponent } from "@webiny/icons/content_paste.svg";
+import { DevToolsSection } from "@webiny/react-properties";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { DeveloperMode } from "../../components/DeveloperMode/DeveloperMode.js";
+import { useFieldRenderers } from "./useFieldRenderers.js";
+import { useLayoutRenderers } from "./useLayoutRenderers.js";
+function renderTabIcon(icon) {
+    if (!icon) return;
+    return /*#__PURE__*/ react.createElement(FontAwesomeIcon, {
+        icon: icon.name.split("/")
+    });
+}
+const FormViewRenderersContext = /*#__PURE__*/ createContext(null);
+const useFormViewRenderers = ()=>{
+    const ctx = useContext(FormViewRenderersContext);
+    if (!ctx) throw new Error("useFormViewRenderers must be used within a FormView.");
+    return ctx;
+};
+const FormView = observer(({ name, form, renderers, layoutRenderers })=>{
+    const defaultFieldRenderers = useFieldRenderers();
+    const defaultLayoutRenderers = useLayoutRenderers();
+    const value = useMemo(()=>({
+            fieldRenderers: renderers ?? defaultFieldRenderers,
+            layoutRenderers: layoutRenderers ?? defaultLayoutRenderers
+        }), [
+        renderers,
+        defaultFieldRenderers,
+        layoutRenderers,
+        defaultLayoutRenderers
+    ]);
+    return /*#__PURE__*/ react.createElement(FormViewRenderersContext.Provider, {
+        value: value
+    }, /*#__PURE__*/ react.createElement(DevToolsSection, {
+        name: name,
+        group: "Forms",
+        data: form.getData(),
+        views: "raw"
+    }), /*#__PURE__*/ react.createElement("div", {
+        className: "w-full relative flex flex-col gap-4"
+    }, /*#__PURE__*/ react.createElement(DevModeTools, {
+        form: form
+    }), form.layout.map((node, index)=>/*#__PURE__*/ react.createElement(LayoutNodeRenderer, {
+            key: index,
+            node: node
+        }))));
+});
+const LayoutNodeRenderer = observer(({ node })=>{
+    switch(node.type){
+        case "row":
+            return /*#__PURE__*/ react.createElement(RowNodeRenderer, {
+                node: node
+            });
+        case "separator":
+            return /*#__PURE__*/ react.createElement(FormView_SeparatorNodeRenderer, null);
+        case "tabs":
+            return /*#__PURE__*/ react.createElement(TabsNodeRenderer, {
+                node: node
+            });
+        case "element":
+            return /*#__PURE__*/ react.createElement(ElementNodeRenderer, {
+                node: node
+            });
+        default:
+            return null;
+    }
+});
+const RowNodeRenderer = observer(({ node })=>{
+    const { fieldRenderers } = useFormViewRenderers();
+    return /*#__PURE__*/ react.createElement(Grid, null, node.fields.map((field)=>{
+        const span = Math.floor(12 / node.fields.length);
+        return /*#__PURE__*/ react.createElement(Grid.Column, {
+            key: field.name,
+            span: span
+        }, /*#__PURE__*/ react.createElement(FieldRenderer, {
+            field: field,
+            renderers: fieldRenderers
+        }));
+    }));
+});
+const FieldRenderer = observer(({ field, renderers })=>{
+    const Renderer = field.renderer ? renderers[field.renderer] : void 0;
+    if (!Renderer) {
+        if ("development" === process.env.NODE_ENV) console.warn(`[FormView] No renderer found for field "${field.name}" (renderer: "${field.renderer || "none"}").`);
+        return null;
+    }
+    return /*#__PURE__*/ react.createElement(Renderer, {
+        field: field
+    });
+});
+const FormView_SeparatorNodeRenderer = observer(function() {
+    return /*#__PURE__*/ react.createElement("hr", {
+        className: "border-neutral-dimmed my-2"
+    });
+});
+const TabsNodeRenderer = observer(({ node })=>{
+    const { layoutRenderers } = useFormViewRenderers();
+    if (node.renderer) {
+        const CustomRenderer = layoutRenderers[node.renderer];
+        if (CustomRenderer) return /*#__PURE__*/ react.createElement(CustomRenderer, {
+            node: node
+        });
+    }
+    return /*#__PURE__*/ react.createElement(Tabs, {
+        value: node.activeTabId,
+        onValueChange: (id)=>node.setActiveTab(id),
+        tabs: node.tabs.map((tab)=>/*#__PURE__*/ react.createElement(Tabs.Tab, {
+                key: tab.id,
+                value: tab.id,
+                icon: renderTabIcon(tab.icon),
+                trigger: /*#__PURE__*/ react.createElement(react.Fragment, null, tab.label, tab.hasErrors && /*#__PURE__*/ react.createElement("span", {
+                    className: "ml-1 text-destructive-default text-xs"
+                }, "*")),
+                disabled: tab.disabled,
+                content: /*#__PURE__*/ react.createElement("div", {
+                    className: "flex flex-col gap-4 mt-md"
+                }, tab.layout.map((childNode, index)=>/*#__PURE__*/ react.createElement(LayoutNodeRenderer, {
+                        key: index,
+                        node: childNode
+                    })))
+            }))
+    });
+});
+const ElementNodeRenderer = observer(({ node })=>{
+    const { fieldRenderers } = useFormViewRenderers();
+    const Renderer = fieldRenderers[`element:${node.renderer}`];
+    if (!Renderer) {
+        if ("development" === process.env.NODE_ENV) console.warn(`[FormView] No renderer found for element "${node.renderer}".`);
+        return null;
+    }
+    return /*#__PURE__*/ react.createElement(Renderer, {
+        field: {
+            ...node.props
+        }
+    });
+});
+const DevModeTools = ({ form })=>{
+    const toast = useToast();
+    const handleCopy = ()=>{
+        const data = form.getData();
+        navigator.clipboard.writeText(JSON.stringify(data, null, 2));
+        toast.showSuccessToast({
+            title: "Form data copied to clipboard."
+        });
+    };
+    const handlePaste = async ()=>{
+        try {
+            const text = await navigator.clipboard.readText();
+            const data = JSON.parse(text);
+            form.setData(data);
+            toast.showSuccessToast({
+                title: "Form data imported from clipboard."
+            });
+        } catch  {
+            toast.showWarningToast({
+                title: "Failed to import. Make sure clipboard contains valid JSON."
+            });
+        }
+    };
+    return /*#__PURE__*/ react.createElement(DeveloperMode, null, /*#__PURE__*/ react.createElement("div", {
+        className: "absolute top-0 right-0 w-[200px] h-[80px] z-10 group/devtools"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "absolute top-0 right-0 flex gap-xs opacity-0 group-hover/devtools:opacity-100 transition-opacity"
+    }, /*#__PURE__*/ react.createElement(Tooltip, {
+        content: "Copy form data to clipboard",
+        trigger: /*#__PURE__*/ react.createElement(IconButton, {
+            variant: "secondary",
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            onClick: handleCopy,
+            size: "sm"
+        })
+    }), /*#__PURE__*/ react.createElement(Tooltip, {
+        content: "Paste form data from clipboard",
+        trigger: /*#__PURE__*/ react.createElement(IconButton, {
+            variant: "secondary",
+            icon: /*#__PURE__*/ react.createElement(content_paste_svg_ReactComponent, null),
+            onClick: handlePaste,
+            size: "sm"
+        })
+    }))));
+};
+export { FormView, LayoutNodeRenderer, renderTabIcon, useFormViewRenderers };
+
+//# sourceMappingURL=FormView.js.map

package/features/formModel/FormView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"features/formModel/FormView.js","sources":["../../../src/features/formModel/FormView.tsx"],"sourcesContent":["import React, { createContext, useContext, useMemo } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { Grid, IconButton, Tabs, Tooltip, useToast } from \"@webiny/admin-ui\";\nimport { ReactComponent as CopyIcon } from \"@webiny/icons/content_copy.svg\";\nimport { ReactComponent as PasteIcon } from \"@webiny/icons/content_paste.svg\";\nimport { DevToolsSection } from \"@webiny/react-properties\";\nimport type {\n    IFormVM,\n    LayoutNodeVM,\n    IRowNodeVM,\n    IFieldVM,\n    ITabsNodeVM,\n    IElementNodeVM\n} from \"./abstractions.js\";\nimport type { Icon } from \"~/components/IconPicker/types.js\";\nimport type { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { DeveloperMode } from \"~/components/DeveloperMode/DeveloperMode.js\";\nimport { useFieldRenderers } from \"~/features/formModel/useFieldRenderers.js\";\nimport { useLayoutRenderers } from \"~/features/formModel/useLayoutRenderers.js\";\n\nexport function renderTabIcon(icon: Icon | undefined): React.ReactElement | undefined {\n    if (!icon) {\n        return undefined;\n    }\n    return <FontAwesomeIcon icon={icon.name.split(\"/\") as IconProp} />;\n}\n\n/**\n * A field renderer component receives a FieldVM and renders the appropriate UI.\n */\nexport type FieldRendererComponent = React.ComponentType<{ field: IFieldVM }>;\n\n/**\n * Map of renderer keys to React components for fields.\n * Lookup order: `{type}:{renderer}` → `{type}`.\n */\nexport type FieldRenderers = Record<string, FieldRendererComponent>;\n\n/**\n * Map of renderer keys to React components for layout nodes.\n */\nexport type LayoutRenderers = Record<string, React.ComponentType<any>>;\n\ninterface FormViewRenderers {\n    fieldRenderers: FieldRenderers;\n    layoutRenderers: LayoutRenderers;\n}\n\nconst FormViewRenderersContext = createContext<FormViewRenderers | null>(null);\n\nconst useFormViewRenderers = (): FormViewRenderers => {\n    const ctx = useContext(FormViewRenderersContext);\n    if (!ctx) {\n        throw new Error(\"useFormViewRenderers must be used within a FormView.\");\n    }\n    return ctx;\n};\n\nexport { useFormViewRenderers };\n\ninterface FormViewProps {\n    name: string;\n    form: IFormVM;\n    renderers?: FieldRenderers;\n    layoutRenderers?: LayoutRenderers;\n}\n\n/**\n * Generic form view that walks layout nodes and renders fields.\n * This component is stateless — it reads from the FormVM and delegates to renderers.\n */\nexport const FormView = observer(({ name, form, renderers, layoutRenderers }: FormViewProps) => {\n    const defaultFieldRenderers = useFieldRenderers();\n    const defaultLayoutRenderers = useLayoutRenderers();\n\n    const value = useMemo(\n        () => ({\n            fieldRenderers: renderers ?? defaultFieldRenderers,\n            layoutRenderers: layoutRenderers ?? defaultLayoutRenderers\n        }),\n        [renderers, defaultFieldRenderers, layoutRenderers, defaultLayoutRenderers]\n    );\n\n    return (\n        <FormViewRenderersContext.Provider value={value}>\n            <DevToolsSection name={name} group=\"Forms\" data={form.getData()} views={\"raw\"} />\n            <div className=\"w-full relative flex flex-col gap-4\">\n                <DevModeTools form={form} />\n                {form.layout.map((node, index) => (\n                    <LayoutNodeRenderer key={index} node={node} />\n                ))}\n            </div>\n        </FormViewRenderersContext.Provider>\n    );\n});\n\nexport const LayoutNodeRenderer = observer(({ node }: { node: LayoutNodeVM }) => {\n    switch (node.type) {\n        case \"row\":\n            return <RowNodeRenderer node={node} />;\n        case \"separator\":\n            return <SeparatorNodeRenderer />;\n        case \"tabs\":\n            return <TabsNodeRenderer node={node} />;\n        case \"element\":\n            return <ElementNodeRenderer node={node} />;\n        default:\n            return null;\n    }\n});\n\nconst RowNodeRenderer = observer(({ node }: { node: IRowNodeVM }) => {\n    const { fieldRenderers } = useFormViewRenderers();\n\n    return (\n        <Grid>\n            {node.fields.map(field => {\n                const span = Math.floor(12 / node.fields.length) as React.ComponentProps<\n                    typeof Grid.Column\n                >[\"span\"];\n\n                return (\n                    <Grid.Column key={field.name} span={span}>\n                        <FieldRenderer field={field} renderers={fieldRenderers} />\n                    </Grid.Column>\n                );\n            })}\n        </Grid>\n    );\n});\n\ninterface FieldRendererProps {\n    field: IFieldVM;\n    renderers: FieldRenderers;\n}\n\nconst FieldRenderer = observer(({ field, renderers }: FieldRendererProps) => {\n    const Renderer = field.renderer ? renderers[field.renderer] : undefined;\n\n    if (!Renderer) {\n        if (process.env.NODE_ENV === \"development\") {\n            console.warn(\n                `[FormView] No renderer found for field \"${field.name}\" (renderer: \"${field.renderer || \"none\"}\").`\n            );\n        }\n        return null;\n    }\n\n    return <Renderer field={field} />;\n});\n\nconst SeparatorNodeRenderer = observer(function SeparatorNodeRenderer() {\n    return <hr className=\"border-neutral-dimmed my-2\" />;\n});\n\nexport interface TabsNodeRendererProps {\n    node: ITabsNodeVM;\n}\n\nconst TabsNodeRenderer = observer(({ node }: TabsNodeRendererProps) => {\n    const { layoutRenderers } = useFormViewRenderers();\n\n    if (node.renderer) {\n        const CustomRenderer = layoutRenderers[node.renderer];\n        if (CustomRenderer) {\n            return <CustomRenderer node={node} />;\n        }\n    }\n\n    return (\n        <Tabs\n            value={node.activeTabId}\n            onValueChange={id => node.setActiveTab(id)}\n            tabs={node.tabs.map(tab => (\n                <Tabs.Tab\n                    key={tab.id}\n                    value={tab.id}\n                    icon={renderTabIcon(tab.icon)}\n                    trigger={\n                        <>\n                            {tab.label}\n                            {tab.hasErrors && (\n                                <span className=\"ml-1 text-destructive-default text-xs\">*</span>\n                            )}\n                        </>\n                    }\n                    disabled={tab.disabled}\n                    content={\n                        <div className={\"flex flex-col gap-4 mt-md\"}>\n                            {tab.layout.map((childNode, index) => (\n                                <LayoutNodeRenderer key={index} node={childNode} />\n                            ))}\n                        </div>\n                    }\n                />\n            ))}\n        />\n    );\n});\n\nconst ElementNodeRenderer = observer(({ node }: { node: IElementNodeVM }) => {\n    const { fieldRenderers } = useFormViewRenderers();\n    const Renderer = fieldRenderers[`element:${node.renderer}`];\n\n    if (!Renderer) {\n        if (process.env.NODE_ENV === \"development\") {\n            console.warn(`[FormView] No renderer found for element \"${node.renderer}\".`);\n        }\n        return null;\n    }\n\n    return <Renderer field={{ ...node.props } as any} />;\n});\n\ninterface DevModelToolsProps {\n    form: IFormVM;\n}\n\nconst DevModeTools = ({ form }: DevModelToolsProps) => {\n    const toast = useToast();\n\n    const handleCopy = () => {\n        const data = form.getData();\n        navigator.clipboard.writeText(JSON.stringify(data, null, 2));\n        toast.showSuccessToast({ title: \"Form data copied to clipboard.\" });\n    };\n\n    const handlePaste = async () => {\n        try {\n            const text = await navigator.clipboard.readText();\n            const data = JSON.parse(text);\n            form.setData(data);\n            toast.showSuccessToast({ title: \"Form data imported from clipboard.\" });\n        } catch {\n            toast.showWarningToast({\n                title: \"Failed to import. Make sure clipboard contains valid JSON.\"\n            });\n        }\n    };\n    return (\n        <DeveloperMode>\n            <div className=\"absolute top-0 right-0 w-[200px] h-[80px] z-10 group/devtools\">\n                <div className=\"absolute top-0 right-0 flex gap-xs opacity-0 group-hover/devtools:opacity-100 transition-opacity\">\n                    <Tooltip\n                        content=\"Copy form data to clipboard\"\n                        trigger={\n                            <IconButton\n                                variant={\"secondary\"}\n                                icon={<CopyIcon />}\n                                onClick={handleCopy}\n                                size=\"sm\"\n                            />\n                        }\n                    />\n                    <Tooltip\n                        content=\"Paste form data from clipboard\"\n                        trigger={\n                            <IconButton\n                                variant={\"secondary\"}\n                                icon={<PasteIcon />}\n                                onClick={handlePaste}\n                                size=\"sm\"\n                            />\n                        }\n                    />\n                </div>\n            </div>\n        </DeveloperMode>\n    );\n};\n"],"names":["renderTabIcon","icon","FontAwesomeIcon","FormViewRenderersContext","createContext","useFormViewRenderers","ctx","useContext","Error","FormView","observer","name","form","renderers","layoutRenderers","defaultFieldRenderers","useFieldRenderers","defaultLayoutRenderers","useLayoutRenderers","value","useMemo","DevToolsSection","DevModeTools","node","index","LayoutNodeRenderer","RowNodeRenderer","SeparatorNodeRenderer","TabsNodeRenderer","ElementNodeRenderer","fieldRenderers","Grid","field","span","Math","FieldRenderer","Renderer","undefined","process","console","CustomRenderer","Tabs","id","tab","childNode","toast","useToast","handleCopy","data","navigator","JSON","handlePaste","text","DeveloperMode","Tooltip","IconButton","CopyIcon","PasteIcon"],"mappings":"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"}

package/features/formModel/LayoutBuilderFactory.d.ts

@@ -0,0 +1,61 @@
+import type { Icon } from "../../components/IconPicker/types.js";
+import type { IField, IFieldBuilder, ILayoutBuilder, ILayoutNodeBuilder, ILayoutNodeHandle, IRule, ITabBuilder, ITabDefinition, ITabDefinitionInput, ITabsBuilder, ITabsNode, LayoutNode, ILayoutNodeAccessHandle } from "./abstractions.js";
+interface TabBuilderInternal extends ITabBuilder {
+    _build(id: string): ITabDefinition;
+}
+export declare class TabBuilder implements TabBuilderInternal {
+    private _existing;
+    private _label;
+    private _description;
+    private _icon;
+    private _layoutFactory;
+    private _rules;
+    constructor(existing?: ITabDefinition);
+    label(text: string): this;
+    description(text: string): this;
+    icon(icon: Icon): this;
+    layout(factory: (l: ILayoutBuilder) => ILayoutNodeBuilder[]): this;
+    rules(r: IRule[]): this;
+    _build(id: string): ITabDefinition;
+}
+export declare class TabsBuilder implements ITabsBuilder {
+    private _id;
+    private _renderer;
+    private _rules;
+    private _pendingTabs;
+    private _lastAddedIdx;
+    constructor(id?: string);
+    renderer(name: string): this;
+    tab(tabId: string, configure: (tab: ITabBuilder) => void): this;
+    before(_target: string): this;
+    after(_target: string): this;
+    rules(r: IRule[]): this;
+    build(): ITabsNode;
+}
+export declare class TabsAccessBuilder implements ITabsBuilder {
+    private _node;
+    private _lastAddedIdx;
+    constructor(_node: ITabsNode);
+    renderer(name: string): this;
+    tab(tabId: string, configure: (tab: ITabBuilder) => void): this;
+    before(target: string): this;
+    after(target: string): this;
+    rules(r: IRule[]): this;
+    build(): ITabsNode;
+}
+export declare class LayoutBuilderFactory {
+    static create(): ILayoutBuilder;
+    static buildNodes(builders: ILayoutNodeBuilder[]): LayoutNode[];
+    static resolvePositionedRows(nodes: LayoutNode[]): LayoutNode[];
+    static resolveObjectInner(inner: ((layout: ILayoutBuilder) => ILayoutNodeBuilder[]) | Record<string, (layout: ILayoutBuilder) => ILayoutNodeBuilder[]>): LayoutNode[] | Record<string, LayoutNode[]>;
+    static createNodeHandle(node: LayoutNode): ILayoutNodeHandle;
+    static matchesNodeId(node: LayoutNode, nodeId: string): boolean;
+    static findNodeById(layout: LayoutNode[], nodeId: string): LayoutNode | undefined;
+    static resolveTabDefinition(input: ITabDefinitionInput): ITabDefinition;
+    static tabsNodeKey(node: ITabsNode): string;
+    static accessNode(layout: LayoutNode[], nodeId: string): ILayoutNodeAccessHandle;
+    static collectBuilders(fields: Map<string, IField>, builders: Map<string, IFieldBuilder> | Record<string, IFieldBuilder>, predicate: (builder: IFieldBuilder) => boolean, result: IFieldBuilder[]): void;
+    static collectFieldIds(layout: LayoutNode[]): string[];
+    static collectBuildersFlat(builders: Record<string, IFieldBuilder>, predicate: (builder: IFieldBuilder) => boolean, result: IFieldBuilder[]): void;
+}
+export {};