@webiny/app-admin 6.4.12-beta.5 → 6.5.0-beta.1

package/base/Admin.js

@@ -7,6 +7,7 @@ import { createUiStateProvider } from "./providers/UiStateProvider.js";
 import { createAdminUiStateProvider } from "./providers/AdminUiStateProvider.js";
 import { createUiProviders } from "./providers/UiProviders.js";
 import { createDialogsProvider } from "../components/Dialogs/DialogsContext.js";
+import { createDrawersProvider } from "../components/Drawers/DrawersContext.js";
 import { DefaultIcons, IconPickerConfigProvider } from "../components/IconPicker/config/index.js";
 import { createRootContainer } from "./createRootContainer.js";
 import { WcpProvider } from "../presentation/wcp/WcpProvider.js";
@@ -17,8 +18,12 @@ import { SecurityFeature } from "../features/security/SecurityFeature.js";
 import { FormModelFeature } from "../features/formModel/feature.js";
 import { AdminConfigPlugin, AdminConfigProvider } from "../config/AdminConfig.js";
 import { WebinySdkFeature } from "../features/webinySdk/feature.js";
+import { DateFormatterFeature } from "../features/dateFormatter/feature.js";
 import { ListPresenterFeature } from "../presentation/listPresenter/index.js";
-import { DebuggerFeature } from "../features/debugger/feature.js";
+import { SortableFeature } from "../presentation/sortable/index.js";
+import { NotificationsRenderer } from "../features/notifications/NotificationsRenderer.js";
+import { CommandPaletteFeature } from "../presentation/commandPalette/index.js";
+import { AdminCommandsFeature } from "../presentation/commandPalette/commands/feature.js";
 const container = createRootContainer();
 const Admin = ({ children, createApolloClient, createLegacyPlugins })=>{
     const uri = process.env.REACT_APP_GRAPHQL_API_URL;
@@ -28,15 +33,19 @@ const Admin = ({ children, createApolloClient, createLegacyPlugins })=>{
     plugins.register(...createLegacyPlugins(container));
     ApolloClientFeature.register(container, apolloClient);
     SecurityFeature.register(container);
+    DateFormatterFeature.register(container);
     FormModelFeature.register(container);
     WebinySdkFeature.register(container);
     ListPresenterFeature.register(container);
-    DebuggerFeature.register(container);
+    CommandPaletteFeature.register(container);
+    AdminCommandsFeature.register(container);
+    SortableFeature.register(container);
     const ApolloProvider = createApolloProvider(apolloClient);
     const UIProviders = createUiProviders();
     const UiStateProvider = createUiStateProvider();
     const AdminUiStateProvider = createAdminUiStateProvider();
     const DialogsProvider = createDialogsProvider();
+    const DrawersProvider = createDrawersProvider();
     const TenancyProvider = createTenancyProvider();
     return /*#__PURE__*/ react.createElement(DiContainerProvider, {
         container: container
@@ -50,11 +59,12 @@ const Admin = ({ children, createApolloClient, createLegacyPlugins })=>{
             UIProviders,
             UiStateProvider,
             DialogsProvider,
+            DrawersProvider,
             IconPickerConfigProvider,
             AdminUiStateProvider,
             TenancyProvider
         ]
-    }, /*#__PURE__*/ react.createElement(Base, null), /*#__PURE__*/ react.createElement(DefaultIcons, null), children))));
+    }, /*#__PURE__*/ react.createElement(Base, null), /*#__PURE__*/ react.createElement(DefaultIcons, null), /*#__PURE__*/ react.createElement(NotificationsRenderer, null), children))));
 };
 export { Admin };
 

package/base/Admin.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Admin.js","sources":["../../src/base/Admin.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Container } from \"@webiny/di\";\nimport { plugins } from \"@webiny/plugins\";\nimport { App, DiContainerProvider } from \"@webiny/app\";\nimport type { ApolloClientFactory } from \"./providers/ApolloProvider.js\";\nimport { createApolloProvider } from \"./providers/ApolloProvider.js\";\nimport { Base } from \"./Base.js\";\nimport { createUiStateProvider } from \"./providers/UiStateProvider.js\";\nimport { createAdminUiStateProvider } from \"./providers/AdminUiStateProvider.js\";\nimport { createUiProviders } from \"./providers/UiProviders.js\";\nimport { createDialogsProvider } from \"~/components/Dialogs/DialogsContext.js\";\nimport { DefaultIcons, IconPickerConfigProvider } from \"~/components/IconPicker/config/index.js\";\nimport { createRootContainer } from \"~/base/createRootContainer.js\";\nimport { WcpProvider } from \"~/presentation/wcp/WcpProvider.js\";\nimport { createTenancyProvider } from \"~/presentation/tenancy/createTenancyProvider.js\";\nimport { TelemetryAdminAppStart } from \"./TelemetryAdminAppStart.js\";\nimport { ApolloClientFeature } from \"~/features/apolloClient/feature.js\";\nimport { SecurityFeature } from \"~/features/security/SecurityFeature.js\";\nimport { FormModelFeature } from \"~/features/formModel/feature.js\";\nimport type { PluginCollection } from \"@webiny/plugins/types.js\";\nimport { AdminConfigPlugin, AdminConfigProvider } from \"~/config/AdminConfig.js\";\nimport { WebinySdkFeature } from \"~/features/webinySdk/feature.js\";\nimport { ListPresenterFeature } from \"~/presentation/listPresenter/index.js\";\nimport { DebuggerFeature } from \"~/features/debugger/feature.js\";\n\nexport interface AdminProps {\n    createApolloClient: ApolloClientFactory;\n    createLegacyPlugins: (container: Container) => PluginCollection;\n    children?: React.ReactNode;\n}\n\nconst container = createRootContainer();\n\nexport const Admin = ({ children, createApolloClient, createLegacyPlugins }: AdminProps) => {\n    const uri = process.env.REACT_APP_GRAPHQL_API_URL as string;\n    const apolloClient = createApolloClient({ uri });\n\n    plugins.register(...createLegacyPlugins(container));\n\n    ApolloClientFeature.register(container, apolloClient);\n    SecurityFeature.register(container);\n    FormModelFeature.register(container);\n    WebinySdkFeature.register(container);\n    ListPresenterFeature.register(container);\n    DebuggerFeature.register(container);\n\n    const ApolloProvider = createApolloProvider(apolloClient);\n    const UIProviders = createUiProviders();\n    const UiStateProvider = createUiStateProvider();\n    const AdminUiStateProvider = createAdminUiStateProvider();\n    const DialogsProvider = createDialogsProvider();\n    const TenancyProvider = createTenancyProvider();\n\n    return (\n        <DiContainerProvider container={container}>\n            <TelemetryAdminAppStart />\n            <ApolloProvider>\n                <WcpProvider>\n                    <App\n                        plugins={[AdminConfigPlugin]}\n                        routes={[]}\n                        providers={[\n                            AdminConfigProvider,\n                            UIProviders,\n                            UiStateProvider,\n                            DialogsProvider,\n                            IconPickerConfigProvider,\n                            AdminUiStateProvider,\n                            TenancyProvider\n                        ]}\n                    >\n                        <Base />\n                        <DefaultIcons />\n                        {children}\n                    </App>\n                </WcpProvider>\n            </ApolloProvider>\n        </DiContainerProvider>\n    );\n};\n"],"names":["container","createRootContainer","Admin","children","createApolloClient","createLegacyPlugins","uri","process","apolloClient","plugins","ApolloClientFeature","SecurityFeature","FormModelFeature","WebinySdkFeature","ListPresenterFeature","DebuggerFeature","ApolloProvider","createApolloProvider","UIProviders","createUiProviders","UiStateProvider","createUiStateProvider","AdminUiStateProvider","createAdminUiStateProvider","DialogsProvider","createDialogsProvider","TenancyProvider","createTenancyProvider","DiContainerProvider","TelemetryAdminAppStart","WcpProvider","App","AdminConfigPlugin","AdminConfigProvider","IconPickerConfigProvider","Base","DefaultIcons"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA+BA,MAAMA,YAAYC;AAEX,MAAMC,QAAQ,CAAC,EAAEC,QAAQ,EAAEC,kBAAkB,EAAEC,mBAAmB,EAAc;IACnF,MAAMC,MAAMC,QAAQ,GAAG,CAAC,yBAAyB;IACjD,MAAMC,eAAeJ,mBAAmB;QAAEE;IAAI;IAE9CG,QAAQ,QAAQ,IAAIJ,oBAAoBL;IAExCU,oBAAoB,QAAQ,CAACV,WAAWQ;IACxCG,gBAAgB,QAAQ,CAACX;IACzBY,iBAAiB,QAAQ,CAACZ;IAC1Ba,iBAAiB,QAAQ,CAACb;IAC1Bc,qBAAqB,QAAQ,CAACd;IAC9Be,gBAAgB,QAAQ,CAACf;IAEzB,MAAMgB,iBAAiBC,qBAAqBT;IAC5C,MAAMU,cAAcC;IACpB,MAAMC,kBAAkBC;IACxB,MAAMC,uBAAuBC;IAC7B,MAAMC,kBAAkBC;IACxB,MAAMC,kBAAkBC;IAExB,OAAO,WAAP,GACI,oBAACC,qBAAmBA;QAAC,WAAW5B;qBAC5B,oBAAC6B,wBAAsBA,OAAAA,WAAAA,GACvB,oBAACb,gBAAAA,MAAAA,WAAAA,GACG,oBAACc,aAAWA,MAAAA,WAAAA,GACR,oBAACC,KAAGA;QACA,SAAS;YAACC;SAAkB;QAC5B,QAAQ,EAAE;QACV,WAAW;YACPC;YACAf;YACAE;YACAI;YACAU;YACAZ;YACAI;SACH;qBAED,oBAACS,MAAIA,OAAAA,WAAAA,GACL,oBAACC,cAAYA,OACZjC;AAMzB"}
+{"version":3,"file":"base/Admin.js","sources":["../../src/base/Admin.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Container } from \"@webiny/di\";\nimport { plugins } from \"@webiny/plugins\";\nimport { App, DiContainerProvider } from \"@webiny/app\";\nimport type { ApolloClientFactory } from \"./providers/ApolloProvider.js\";\nimport { createApolloProvider } from \"./providers/ApolloProvider.js\";\nimport { Base } from \"./Base.js\";\nimport { createUiStateProvider } from \"./providers/UiStateProvider.js\";\nimport { createAdminUiStateProvider } from \"./providers/AdminUiStateProvider.js\";\nimport { createUiProviders } from \"./providers/UiProviders.js\";\nimport { createDialogsProvider } from \"~/components/Dialogs/DialogsContext.js\";\nimport { createDrawersProvider } from \"~/components/Drawers/DrawersContext.js\";\nimport { DefaultIcons, IconPickerConfigProvider } from \"~/components/IconPicker/config/index.js\";\nimport { createRootContainer } from \"~/base/createRootContainer.js\";\nimport { WcpProvider } from \"~/presentation/wcp/WcpProvider.js\";\nimport { createTenancyProvider } from \"~/presentation/tenancy/createTenancyProvider.js\";\nimport { TelemetryAdminAppStart } from \"./TelemetryAdminAppStart.js\";\nimport { ApolloClientFeature } from \"~/features/apolloClient/feature.js\";\nimport { SecurityFeature } from \"~/features/security/SecurityFeature.js\";\nimport { FormModelFeature } from \"~/features/formModel/feature.js\";\nimport type { PluginCollection } from \"@webiny/plugins/types.js\";\nimport { AdminConfigPlugin, AdminConfigProvider } from \"~/config/AdminConfig.js\";\nimport { WebinySdkFeature } from \"~/features/webinySdk/feature.js\";\nimport { DateFormatterFeature } from \"~/features/dateFormatter/feature.js\";\nimport { ListPresenterFeature } from \"~/presentation/listPresenter/index.js\";\nimport { SortableFeature } from \"~/presentation/sortable/index.js\";\nimport { NotificationsRenderer } from \"~/features/notifications/NotificationsRenderer.js\";\nimport { CommandPaletteFeature } from \"~/presentation/commandPalette/index.js\";\nimport { AdminCommandsFeature } from \"~/presentation/commandPalette/commands/feature.js\";\n\nexport interface AdminProps {\n    createApolloClient: ApolloClientFactory;\n    createLegacyPlugins: (container: Container) => PluginCollection;\n    children?: React.ReactNode;\n}\n\nconst container = createRootContainer();\n\nexport const Admin = ({ children, createApolloClient, createLegacyPlugins }: AdminProps) => {\n    const uri = process.env.REACT_APP_GRAPHQL_API_URL as string;\n    const apolloClient = createApolloClient({ uri });\n\n    plugins.register(...createLegacyPlugins(container));\n\n    ApolloClientFeature.register(container, apolloClient);\n    SecurityFeature.register(container);\n    DateFormatterFeature.register(container);\n    FormModelFeature.register(container);\n    WebinySdkFeature.register(container);\n    ListPresenterFeature.register(container);\n    CommandPaletteFeature.register(container);\n    AdminCommandsFeature.register(container);\n    SortableFeature.register(container);\n\n    const ApolloProvider = createApolloProvider(apolloClient);\n    const UIProviders = createUiProviders();\n    const UiStateProvider = createUiStateProvider();\n    const AdminUiStateProvider = createAdminUiStateProvider();\n    const DialogsProvider = createDialogsProvider();\n    const DrawersProvider = createDrawersProvider();\n    const TenancyProvider = createTenancyProvider();\n\n    return (\n        <DiContainerProvider container={container}>\n            <TelemetryAdminAppStart />\n            <ApolloProvider>\n                <WcpProvider>\n                    <App\n                        plugins={[AdminConfigPlugin]}\n                        routes={[]}\n                        providers={[\n                            AdminConfigProvider,\n                            UIProviders,\n                            UiStateProvider,\n                            DialogsProvider,\n                            DrawersProvider,\n                            IconPickerConfigProvider,\n                            AdminUiStateProvider,\n                            TenancyProvider\n                        ]}\n                    >\n                        <Base />\n                        <DefaultIcons />\n                        <NotificationsRenderer />\n                        {children}\n                    </App>\n                </WcpProvider>\n            </ApolloProvider>\n        </DiContainerProvider>\n    );\n};\n"],"names":["container","createRootContainer","Admin","children","createApolloClient","createLegacyPlugins","uri","process","apolloClient","plugins","ApolloClientFeature","SecurityFeature","DateFormatterFeature","FormModelFeature","WebinySdkFeature","ListPresenterFeature","CommandPaletteFeature","AdminCommandsFeature","SortableFeature","ApolloProvider","createApolloProvider","UIProviders","createUiProviders","UiStateProvider","createUiStateProvider","AdminUiStateProvider","createAdminUiStateProvider","DialogsProvider","createDialogsProvider","DrawersProvider","createDrawersProvider","TenancyProvider","createTenancyProvider","DiContainerProvider","TelemetryAdminAppStart","WcpProvider","App","AdminConfigPlugin","AdminConfigProvider","IconPickerConfigProvider","Base","DefaultIcons","NotificationsRenderer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,MAAMA,YAAYC;AAEX,MAAMC,QAAQ,CAAC,EAAEC,QAAQ,EAAEC,kBAAkB,EAAEC,mBAAmB,EAAc;IACnF,MAAMC,MAAMC,QAAQ,GAAG,CAAC,yBAAyB;IACjD,MAAMC,eAAeJ,mBAAmB;QAAEE;IAAI;IAE9CG,QAAQ,QAAQ,IAAIJ,oBAAoBL;IAExCU,oBAAoB,QAAQ,CAACV,WAAWQ;IACxCG,gBAAgB,QAAQ,CAACX;IACzBY,qBAAqB,QAAQ,CAACZ;IAC9Ba,iBAAiB,QAAQ,CAACb;IAC1Bc,iBAAiB,QAAQ,CAACd;IAC1Be,qBAAqB,QAAQ,CAACf;IAC9BgB,sBAAsB,QAAQ,CAAChB;IAC/BiB,qBAAqB,QAAQ,CAACjB;IAC9BkB,gBAAgB,QAAQ,CAAClB;IAEzB,MAAMmB,iBAAiBC,qBAAqBZ;IAC5C,MAAMa,cAAcC;IACpB,MAAMC,kBAAkBC;IACxB,MAAMC,uBAAuBC;IAC7B,MAAMC,kBAAkBC;IACxB,MAAMC,kBAAkBC;IACxB,MAAMC,kBAAkBC;IAExB,OAAO,WAAP,GACI,oBAACC,qBAAmBA;QAAC,WAAWjC;qBAC5B,oBAACkC,wBAAsBA,OAAAA,WAAAA,GACvB,oBAACf,gBAAAA,MAAAA,WAAAA,GACG,oBAACgB,aAAWA,MAAAA,WAAAA,GACR,oBAACC,KAAGA;QACA,SAAS;YAACC;SAAkB;QAC5B,QAAQ,EAAE;QACV,WAAW;YACPC;YACAjB;YACAE;YACAI;YACAE;YACAU;YACAd;YACAM;SACH;qBAED,oBAACS,MAAIA,OAAAA,WAAAA,GACL,oBAACC,cAAYA,OAAAA,WAAAA,GACb,oBAACC,uBAAqBA,OACrBvC;AAMzB"}

package/base/Base/DefaultFieldRenderers.js

@@ -24,12 +24,33 @@ import { FileUrlPickerRenderer } from "./FieldRenderers/FileUrlPickerRenderer.js
 import { MultiFilePickerRenderer } from "./FieldRenderers/MultiFilePickerRenderer.js";
 import { CodeEditorRenderer } from "./FieldRenderers/CodeEditorRenderer.js";
 import { LexicalRenderer } from "./FieldRenderers/LexicalRenderer.js";
-const DefaultFieldRenderers = ()=>/*#__PURE__*/ react.createElement(AdminConfig, null, /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+import { LexicalEditorsRenderer } from "./FieldRenderers/LexicalEditorsRenderer.js";
+import { PasswordInputRenderer } from "./FieldRenderers/PasswordInputRenderer.js";
+import { PermissionsRenderer } from "./FieldRenderers/PermissionsRenderer.js";
+import { RolesMultiSelectRenderer } from "./FieldRenderers/RolesMultiSelectRenderer.js";
+import { ApiKeyTokenRenderer } from "./FieldRenderers/ApiKeyTokenRenderer.js";
+import { MultiAutoCompleteRenderer } from "./FieldRenderers/MultiAutoCompleteRenderer.js";
+import { AutoCompleteRenderer } from "./FieldRenderers/AutoCompleteRenderer.js";
+import { MultiSelectRenderer } from "./FieldRenderers/MultiSelectRenderer.js";
+import { RegisterFeature } from "../../exports/admin.js";
+import { MultiValueDynamicZoneFeature } from "./FieldRenderers/ObjectRenderer/MultiValueDynamicZone/feature.js";
+const DefaultFieldRenderers = ()=>/*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(RegisterFeature, {
+        feature: MultiValueDynamicZoneFeature
+    }), /*#__PURE__*/ react.createElement(AdminConfig, null, /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
         name: "textInput",
         component: InputRenderer
     }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
         name: "textarea",
         component: TextareaRenderer
+    }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+        name: "select",
+        component: SelectRenderer
+    }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+        name: "autoComplete",
+        component: AutoCompleteRenderer
+    }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+        name: "multiSelect",
+        component: MultiSelectRenderer
     }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
         name: "dropdown",
         component: SelectRenderer
@@ -96,7 +117,25 @@ const DefaultFieldRenderers = ()=>/*#__PURE__*/ react.createElement(AdminConfig,
     }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
         name: "lexical",
         component: LexicalRenderer
-    }));
+    }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+        name: "lexicalEditors",
+        component: LexicalEditorsRenderer
+    }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+        name: "passwordInput",
+        component: PasswordInputRenderer
+    }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+        name: "permissions",
+        component: PermissionsRenderer
+    }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+        name: "rolesMultiSelect",
+        component: RolesMultiSelectRenderer
+    }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+        name: "apiKeyToken",
+        component: ApiKeyTokenRenderer
+    }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+        name: "multiAutoComplete",
+        component: MultiAutoCompleteRenderer
+    })));
 export { DefaultFieldRenderers };
 
 //# sourceMappingURL=DefaultFieldRenderers.js.map

package/base/Base/DefaultFieldRenderers.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Base/DefaultFieldRenderers.js","sources":["../../../src/base/Base/DefaultFieldRenderers.tsx"],"sourcesContent":["import React from \"react\";\nimport { AdminConfig } from \"~/config/AdminConfig.js\";\nimport { InputRenderer } from \"~/base/Base/FieldRenderers/InputRenderer.js\";\nimport { SelectRenderer } from \"~/base/Base/FieldRenderers/SelectRenderer.js\";\nimport { ObjectRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js\";\nimport { ObjectAccordionMultipleRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/ObjectAccordionMultipleRenderer.js\";\nimport { DynamicZoneRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/DynamicZoneRenderer.js\";\nimport { PassthroughRenderer } from \"~/base/Base/FieldRenderers/PassthroughRenderer.js\";\nimport { TextareaRenderer } from \"~/base/Base/FieldRenderers/TextareaRenderer.js\";\nimport { SwitchRenderer } from \"~/base/Base/FieldRenderers/SwitchRenderer.js\";\nimport { NumberInputRenderer } from \"~/base/Base/FieldRenderers/NumberInputRenderer.js\";\nimport { NumberInputsRenderer } from \"~/base/Base/FieldRenderers/NumberInputsRenderer.js\";\nimport { TextInputsRenderer } from \"~/base/Base/FieldRenderers/TextInputsRenderer.js\";\nimport { TextareasRenderer } from \"~/base/Base/FieldRenderers/TextareasRenderer.js\";\nimport { TagsRenderer } from \"~/base/Base/FieldRenderers/TagsRenderer.js\";\nimport { RadioButtonsRenderer } from \"~/base/Base/FieldRenderers/RadioButtonsRenderer.js\";\nimport { CheckboxesRenderer } from \"~/base/Base/FieldRenderers/CheckboxesRenderer.js\";\nimport { DateTimeRenderer } from \"~/base/Base/FieldRenderers/DateTimeRenderer.js\";\nimport { DateTimeInputsRenderer } from \"~/base/Base/FieldRenderers/DateTimeInputsRenderer.js\";\nimport { HiddenRenderer } from \"~/base/Base/FieldRenderers/HiddenRenderer.js\";\nimport { KeyValueTagsRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/KeyValueTagsRenderer.js\";\nimport { FilePickerRenderer } from \"~/base/Base/FieldRenderers/FilePickerRenderer.js\";\nimport { FileUrlPickerRenderer } from \"~/base/Base/FieldRenderers/FileUrlPickerRenderer.js\";\nimport { MultiFilePickerRenderer } from \"~/base/Base/FieldRenderers/MultiFilePickerRenderer.js\";\nimport { CodeEditorRenderer } from \"~/base/Base/FieldRenderers/CodeEditorRenderer.js\";\nimport { LexicalRenderer } from \"~/base/Base/FieldRenderers/LexicalRenderer.js\";\n\nexport const DefaultFieldRenderers = () => {\n    return (\n        <AdminConfig>\n            <AdminConfig.Form.FieldRenderer name={\"textInput\"} component={InputRenderer} />\n            <AdminConfig.Form.FieldRenderer name={\"textarea\"} component={TextareaRenderer} />\n            <AdminConfig.Form.FieldRenderer name={\"dropdown\"} component={SelectRenderer} />\n            <AdminConfig.Form.FieldRenderer\n                name={\"objectAccordionSingle\"}\n                component={ObjectRenderer}\n            />\n            <AdminConfig.Form.FieldRenderer\n                name={\"objectAccordionMultiple\"}\n                component={ObjectAccordionMultipleRenderer}\n            />\n            <AdminConfig.Form.FieldRenderer name={\"dynamicZone\"} component={DynamicZoneRenderer} />\n            <AdminConfig.Form.FieldRenderer name={\"passthrough\"} component={PassthroughRenderer} />\n            <AdminConfig.Form.FieldRenderer name={\"switch\"} component={SwitchRenderer} />\n            <AdminConfig.Form.FieldRenderer name={\"numberInput\"} component={NumberInputRenderer} />\n            <AdminConfig.Form.FieldRenderer\n                name={\"numberInputs\"}\n                component={NumberInputsRenderer}\n            />\n            <AdminConfig.Form.FieldRenderer name={\"textInputs\"} component={TextInputsRenderer} />\n            <AdminConfig.Form.FieldRenderer name={\"textareas\"} component={TextareasRenderer} />\n            <AdminConfig.Form.FieldRenderer name={\"tags\"} component={TagsRenderer} />\n            <AdminConfig.Form.FieldRenderer\n                name={\"radioButtons\"}\n                component={RadioButtonsRenderer}\n            />\n            <AdminConfig.Form.FieldRenderer name={\"checkboxes\"} component={CheckboxesRenderer} />\n            <AdminConfig.Form.FieldRenderer name={\"dateTimeInput\"} component={DateTimeRenderer} />\n            <AdminConfig.Form.FieldRenderer\n                name={\"dateTimeInputs\"}\n                component={DateTimeInputsRenderer}\n            />\n            <AdminConfig.Form.FieldRenderer name={\"hidden\"} component={HiddenRenderer} />\n            <AdminConfig.Form.FieldRenderer\n                name={\"keyValueTags\"}\n                component={KeyValueTagsRenderer}\n            />\n            <AdminConfig.Form.FieldRenderer name={\"filePicker\"} component={FilePickerRenderer} />\n            <AdminConfig.Form.FieldRenderer\n                name={\"multiFilePicker\"}\n                component={MultiFilePickerRenderer}\n            />\n            <AdminConfig.Form.FieldRenderer\n                name={\"fileUrlPicker\"}\n                component={FileUrlPickerRenderer}\n            />\n            <AdminConfig.Form.FieldRenderer name={\"codeEditor\"} component={CodeEditorRenderer} />\n            <AdminConfig.Form.FieldRenderer name={\"lexical\"} component={LexicalRenderer} />\n        </AdminConfig>\n    );\n};\n"],"names":["DefaultFieldRenderers","AdminConfig","InputRenderer","TextareaRenderer","SelectRenderer","ObjectRenderer","ObjectAccordionMultipleRenderer","DynamicZoneRenderer","PassthroughRenderer","SwitchRenderer","NumberInputRenderer","NumberInputsRenderer","TextInputsRenderer","TextareasRenderer","TagsRenderer","RadioButtonsRenderer","CheckboxesRenderer","DateTimeRenderer","DateTimeInputsRenderer","HiddenRenderer","KeyValueTagsRenderer","FilePickerRenderer","MultiFilePickerRenderer","FileUrlPickerRenderer","CodeEditorRenderer","LexicalRenderer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AA2BO,MAAMA,wBAAwB,IAC1B,WAAP,GACI,oBAACC,aAAWA,MAAAA,WAAAA,GACR,oBAACA,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAa,WAAWC;sBAC9D,oBAACD,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAY,WAAWE;sBAC7D,oBAACF,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAY,WAAWG;sBAC7D,oBAACH,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWI;sBAEf,oBAACJ,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWK;sBAEf,oBAACL,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAe,WAAWM;sBAChE,oBAACN,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAe,WAAWO;sBAChE,oBAACP,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAU,WAAWQ;sBAC3D,oBAACR,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAe,WAAWS;sBAChE,oBAACT,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWU;sBAEf,oBAACV,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAc,WAAWW;sBAC/D,oBAACX,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAa,WAAWY;sBAC9D,oBAACZ,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAQ,WAAWa;sBACzD,oBAACb,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWc;sBAEf,oBAACd,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAc,WAAWe;sBAC/D,oBAACf,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAiB,WAAWgB;sBAClE,oBAAChB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWiB;sBAEf,oBAACjB,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAU,WAAWkB;sBAC3D,oBAAClB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWmB;sBAEf,oBAACnB,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAc,WAAWoB;sBAC/D,oBAACpB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWqB;sBAEf,oBAACrB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWsB;sBAEf,oBAACtB,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAc,WAAWuB;sBAC/D,oBAACvB,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAW,WAAWwB"}
+{"version":3,"file":"base/Base/DefaultFieldRenderers.js","sources":["../../../src/base/Base/DefaultFieldRenderers.tsx"],"sourcesContent":["import React from \"react\";\nimport { AdminConfig } from \"~/config/AdminConfig.js\";\nimport { InputRenderer } from \"~/base/Base/FieldRenderers/InputRenderer.js\";\nimport { SelectRenderer } from \"~/base/Base/FieldRenderers/SelectRenderer.js\";\nimport { ObjectRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js\";\nimport { ObjectAccordionMultipleRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/ObjectAccordionMultipleRenderer.js\";\nimport { DynamicZoneRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/DynamicZoneRenderer.js\";\nimport { PassthroughRenderer } from \"~/base/Base/FieldRenderers/PassthroughRenderer.js\";\nimport { TextareaRenderer } from \"~/base/Base/FieldRenderers/TextareaRenderer.js\";\nimport { SwitchRenderer } from \"~/base/Base/FieldRenderers/SwitchRenderer.js\";\nimport { NumberInputRenderer } from \"~/base/Base/FieldRenderers/NumberInputRenderer.js\";\nimport { NumberInputsRenderer } from \"~/base/Base/FieldRenderers/NumberInputsRenderer.js\";\nimport { TextInputsRenderer } from \"~/base/Base/FieldRenderers/TextInputsRenderer.js\";\nimport { TextareasRenderer } from \"~/base/Base/FieldRenderers/TextareasRenderer.js\";\nimport { TagsRenderer } from \"~/base/Base/FieldRenderers/TagsRenderer.js\";\nimport { RadioButtonsRenderer } from \"~/base/Base/FieldRenderers/RadioButtonsRenderer.js\";\nimport { CheckboxesRenderer } from \"~/base/Base/FieldRenderers/CheckboxesRenderer.js\";\nimport { DateTimeRenderer } from \"~/base/Base/FieldRenderers/DateTimeRenderer.js\";\nimport { DateTimeInputsRenderer } from \"~/base/Base/FieldRenderers/DateTimeInputsRenderer.js\";\nimport { HiddenRenderer } from \"~/base/Base/FieldRenderers/HiddenRenderer.js\";\nimport { KeyValueTagsRenderer } from \"~/base/Base/FieldRenderers/ObjectRenderer/KeyValueTagsRenderer.js\";\nimport { FilePickerRenderer } from \"~/base/Base/FieldRenderers/FilePickerRenderer.js\";\nimport { FileUrlPickerRenderer } from \"~/base/Base/FieldRenderers/FileUrlPickerRenderer.js\";\nimport { MultiFilePickerRenderer } from \"~/base/Base/FieldRenderers/MultiFilePickerRenderer.js\";\nimport { CodeEditorRenderer } from \"~/base/Base/FieldRenderers/CodeEditorRenderer.js\";\nimport { LexicalRenderer } from \"~/base/Base/FieldRenderers/LexicalRenderer.js\";\nimport { LexicalEditorsRenderer } from \"~/base/Base/FieldRenderers/LexicalEditorsRenderer.js\";\nimport { PasswordInputRenderer } from \"~/base/Base/FieldRenderers/PasswordInputRenderer.js\";\nimport { PermissionsRenderer } from \"~/base/Base/FieldRenderers/PermissionsRenderer.js\";\nimport { RolesMultiSelectRenderer } from \"~/base/Base/FieldRenderers/RolesMultiSelectRenderer.js\";\nimport { ApiKeyTokenRenderer } from \"~/base/Base/FieldRenderers/ApiKeyTokenRenderer.js\";\nimport { MultiAutoCompleteRenderer } from \"~/base/Base/FieldRenderers/MultiAutoCompleteRenderer.js\";\nimport { AutoCompleteRenderer } from \"~/base/Base/FieldRenderers/AutoCompleteRenderer.js\";\nimport { MultiSelectRenderer } from \"~/base/Base/FieldRenderers/MultiSelectRenderer.js\";\nimport { RegisterFeature } from \"~/exports/admin.js\";\nimport { MultiValueDynamicZoneFeature } from \"~/base/Base/FieldRenderers/ObjectRenderer/MultiValueDynamicZone/feature.js\";\n\nexport const DefaultFieldRenderers = () => {\n    return (\n        <>\n            <RegisterFeature feature={MultiValueDynamicZoneFeature} />\n            <AdminConfig>\n                <AdminConfig.Form.FieldRenderer name={\"textInput\"} component={InputRenderer} />\n                <AdminConfig.Form.FieldRenderer name={\"textarea\"} component={TextareaRenderer} />\n                <AdminConfig.Form.FieldRenderer name={\"select\"} component={SelectRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"autoComplete\"}\n                    component={AutoCompleteRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"multiSelect\"}\n                    component={MultiSelectRenderer}\n                />\n                {/* @deprecated \"dropdown\" is for BC only./ */}\n                <AdminConfig.Form.FieldRenderer name={\"dropdown\"} component={SelectRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"objectAccordionSingle\"}\n                    component={ObjectRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"objectAccordionMultiple\"}\n                    component={ObjectAccordionMultipleRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"dynamicZone\"}\n                    component={DynamicZoneRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"passthrough\"}\n                    component={PassthroughRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"switch\"} component={SwitchRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"numberInput\"}\n                    component={NumberInputRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"numberInputs\"}\n                    component={NumberInputsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"textInputs\"}\n                    component={TextInputsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"textareas\"} component={TextareasRenderer} />\n                <AdminConfig.Form.FieldRenderer name={\"tags\"} component={TagsRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"radioButtons\"}\n                    component={RadioButtonsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"checkboxes\"}\n                    component={CheckboxesRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"dateTimeInput\"}\n                    component={DateTimeRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"dateTimeInputs\"}\n                    component={DateTimeInputsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"hidden\"} component={HiddenRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"keyValueTags\"}\n                    component={KeyValueTagsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"filePicker\"}\n                    component={FilePickerRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"multiFilePicker\"}\n                    component={MultiFilePickerRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"fileUrlPicker\"}\n                    component={FileUrlPickerRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"codeEditor\"}\n                    component={CodeEditorRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer name={\"lexical\"} component={LexicalRenderer} />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"lexicalEditors\"}\n                    component={LexicalEditorsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"passwordInput\"}\n                    component={PasswordInputRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"permissions\"}\n                    component={PermissionsRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"rolesMultiSelect\"}\n                    component={RolesMultiSelectRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"apiKeyToken\"}\n                    component={ApiKeyTokenRenderer}\n                />\n                <AdminConfig.Form.FieldRenderer\n                    name={\"multiAutoComplete\"}\n                    component={MultiAutoCompleteRenderer}\n                />\n            </AdminConfig>\n        </>\n    );\n};\n"],"names":["DefaultFieldRenderers","RegisterFeature","MultiValueDynamicZoneFeature","AdminConfig","InputRenderer","TextareaRenderer","SelectRenderer","AutoCompleteRenderer","MultiSelectRenderer","ObjectRenderer","ObjectAccordionMultipleRenderer","DynamicZoneRenderer","PassthroughRenderer","SwitchRenderer","NumberInputRenderer","NumberInputsRenderer","TextInputsRenderer","TextareasRenderer","TagsRenderer","RadioButtonsRenderer","CheckboxesRenderer","DateTimeRenderer","DateTimeInputsRenderer","HiddenRenderer","KeyValueTagsRenderer","FilePickerRenderer","MultiFilePickerRenderer","FileUrlPickerRenderer","CodeEditorRenderer","LexicalRenderer","LexicalEditorsRenderer","PasswordInputRenderer","PermissionsRenderer","RolesMultiSelectRenderer","ApiKeyTokenRenderer","MultiAutoCompleteRenderer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCO,MAAMA,wBAAwB,IAC1B,WAAP,GACI,wDACI,oBAACC,iBAAeA;QAAC,SAASC;sBAC1B,oBAACC,aAAWA,MAAAA,WAAAA,GACR,oBAACA,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAa,WAAWC;sBAC9D,oBAACD,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAY,WAAWE;sBAC7D,oBAACF,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAU,WAAWG;sBAC3D,oBAACH,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWI;sBAEf,oBAACJ,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWK;sBAGf,oBAACL,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAY,WAAWG;sBAC7D,oBAACH,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWM;sBAEf,oBAACN,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWO;sBAEf,oBAACP,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWQ;sBAEf,oBAACR,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWS;sBAEf,oBAACT,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAU,WAAWU;sBAC3D,oBAACV,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWW;sBAEf,oBAACX,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWY;sBAEf,oBAACZ,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWa;sBAEf,oBAACb,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAa,WAAWc;sBAC9D,oBAACd,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAQ,WAAWe;sBACzD,oBAACf,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWgB;sBAEf,oBAAChB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWiB;sBAEf,oBAACjB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWkB;sBAEf,oBAAClB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWmB;sBAEf,oBAACnB,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAU,WAAWoB;sBAC3D,oBAACpB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWqB;sBAEf,oBAACrB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWsB;sBAEf,oBAACtB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWuB;sBAEf,oBAACvB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWwB;sBAEf,oBAACxB,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWyB;sBAEf,oBAACzB,YAAY,IAAI,CAAC,aAAa;QAAC,MAAM;QAAW,WAAW0B;sBAC5D,oBAAC1B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAW2B;sBAEf,oBAAC3B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAW4B;sBAEf,oBAAC5B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAW6B;sBAEf,oBAAC7B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAW8B;sBAEf,oBAAC9B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAW+B;sBAEf,oBAAC/B,YAAY,IAAI,CAAC,aAAa;QAC3B,MAAM;QACN,WAAWgC"}

package/base/Base/FieldRenderers/ApiKeyTokenRenderer.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+export declare const ApiKeyTokenRenderer: React.ComponentType<{
+    field: import("../../..").IFieldVM;
+}>;

package/base/Base/FieldRenderers/ApiKeyTokenRenderer.js

@@ -0,0 +1,26 @@
+import react from "react";
+import { createFieldRenderer } from "../../../features/formModel/createFieldRenderer.js";
+import { Alert, CopyButton, Label, useToast } from "@webiny/admin-ui";
+const ApiKeyTokenRenderer = createFieldRenderer(({ field })=>{
+    const toast = useToast();
+    const token = field.value;
+    return /*#__PURE__*/ react.createElement("div", null, /*#__PURE__*/ react.createElement(Label, {
+        text: field.label || "Token",
+        hint: field.help
+    }), token ? /*#__PURE__*/ react.createElement("div", {
+        className: "py-sm pl-sm-extra pr-xs rounded-md mt-xs bg-neutral-disabled flex justify-between items-center"
+    }, /*#__PURE__*/ react.createElement("div", null, token), /*#__PURE__*/ react.createElement(CopyButton, {
+        variant: "ghost",
+        value: token,
+        onCopy: ()=>{
+            toast.showSuccessToast({
+                title: "Successfully copied!"
+            });
+        }
+    })) : /*#__PURE__*/ react.createElement(Alert, {
+        className: "mt-xs"
+    }, "Your token will be shown once you submit the form."));
+});
+export { ApiKeyTokenRenderer };
+
+//# sourceMappingURL=ApiKeyTokenRenderer.js.map

package/base/Base/FieldRenderers/ApiKeyTokenRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base/Base/FieldRenderers/ApiKeyTokenRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/ApiKeyTokenRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { Alert, CopyButton, Label, useToast } from \"@webiny/admin-ui\";\n\nexport const ApiKeyTokenRenderer = createFieldRenderer(({ field }) => {\n    const toast = useToast();\n    const token = field.value as string | undefined;\n\n    return (\n        <div>\n            <Label text={field.label || \"Token\"} hint={field.help} />\n            {token ? (\n                <div\n                    className={\n                        \"py-sm pl-sm-extra pr-xs rounded-md mt-xs bg-neutral-disabled flex justify-between items-center\"\n                    }\n                >\n                    <div>{token}</div>\n                    <CopyButton\n                        variant={\"ghost\"}\n                        value={token}\n                        onCopy={() => {\n                            toast.showSuccessToast({ title: \"Successfully copied!\" });\n                        }}\n                    />\n                </div>\n            ) : (\n                <Alert className={\"mt-xs\"}>\n                    {\"Your token will be shown once you submit the form.\"}\n                </Alert>\n            )}\n        </div>\n    );\n});\n"],"names":["ApiKeyTokenRenderer","createFieldRenderer","field","toast","useToast","token","Label","CopyButton","Alert"],"mappings":";;;AAIO,MAAMA,sBAAsBC,oBAAoB,CAAC,EAAEC,KAAK,EAAE;IAC7D,MAAMC,QAAQC;IACd,MAAMC,QAAQH,MAAM,KAAK;IAEzB,OAAO,WAAP,GACI,oBAAC,2BACG,oBAACI,OAAKA;QAAC,MAAMJ,MAAM,KAAK,IAAI;QAAS,MAAMA,MAAM,IAAI;QACpDG,QAAQ,WAARA,GACG,oBAAC;QACG,WACI;qBAGJ,oBAAC,aAAKA,QAAAA,WAAAA,GACN,oBAACE,YAAUA;QACP,SAAS;QACT,OAAOF;QACP,QAAQ;YACJF,MAAM,gBAAgB,CAAC;gBAAE,OAAO;YAAuB;QAC3D;wBAIR,oBAACK,OAAKA;QAAC,WAAW;OACb;AAKrB"}

package/base/Base/FieldRenderers/AutoCompleteRenderer.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+declare module "../../../features/formModel/abstractions.js" {
+    interface IFieldRendererRegistry {
+        autoComplete: {
+            fieldType: "text" | "number";
+            options: true;
+            settings: undefined;
+        };
+    }
+}
+export declare const AutoCompleteRenderer: React.ComponentType<{
+    field: import("~/features/formModel/index.js").IFieldVM;
+}>;

package/base/Base/FieldRenderers/AutoCompleteRenderer.js

@@ -0,0 +1,29 @@
+import react from "react";
+import { createFieldRenderer } from "../../../features/formModel/createFieldRenderer.js";
+import { AutoComplete } from "@webiny/admin-ui";
+const AutoCompleteRenderer = createFieldRenderer(({ field })=>{
+    const options = field.options ?? [];
+    return /*#__PURE__*/ react.createElement(AutoComplete, {
+        label: field.label,
+        hint: field.help,
+        placeholder: field.placeholder,
+        description: field.description,
+        note: field.note,
+        value: null != field.value ? String(field.value) : "",
+        onValueChange: (value)=>{
+            field.onChange(value);
+            field.onBlur();
+        },
+        required: field.required,
+        disabled: field.disabled,
+        validation: field.validation,
+        options: options.map((opt)=>({
+                label: opt.label,
+                value: String(opt.value),
+                disabled: opt.disabled
+            }))
+    });
+});
+export { AutoCompleteRenderer };
+
+//# sourceMappingURL=AutoCompleteRenderer.js.map

package/base/Base/FieldRenderers/AutoCompleteRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base/Base/FieldRenderers/AutoCompleteRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/AutoCompleteRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { AutoComplete } from \"@webiny/admin-ui\";\nimport type { IValueOption } from \"~/features/formModel/index.js\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        autoComplete: { fieldType: \"text\" | \"number\"; options: true; settings: undefined };\n    }\n}\n\nexport const AutoCompleteRenderer = createFieldRenderer(({ field }) => {\n    const options: IValueOption[] = field.options ?? [];\n\n    return (\n        <AutoComplete\n            label={field.label}\n            hint={field.help}\n            placeholder={field.placeholder}\n            description={field.description}\n            note={field.note}\n            value={field.value != null ? String(field.value) : \"\"}\n            onValueChange={value => {\n                field.onChange(value);\n                field.onBlur();\n            }}\n            required={field.required}\n            disabled={field.disabled}\n            validation={field.validation}\n            options={options.map(opt => ({\n                label: opt.label,\n                value: String(opt.value),\n                disabled: opt.disabled\n            }))}\n        />\n    );\n});\n"],"names":["AutoCompleteRenderer","createFieldRenderer","field","options","AutoComplete","String","value","opt"],"mappings":";;;AAWO,MAAMA,uBAAuBC,oBAAoB,CAAC,EAAEC,KAAK,EAAE;IAC9D,MAAMC,UAA0BD,MAAM,OAAO,IAAI,EAAE;IAEnD,OAAO,WAAP,GACI,oBAACE,cAAYA;QACT,OAAOF,MAAM,KAAK;QAClB,MAAMA,MAAM,IAAI;QAChB,aAAaA,MAAM,WAAW;QAC9B,aAAaA,MAAM,WAAW;QAC9B,MAAMA,MAAM,IAAI;QAChB,OAAOA,AAAe,QAAfA,MAAM,KAAK,GAAWG,OAAOH,MAAM,KAAK,IAAI;QACnD,eAAeI,CAAAA;YACXJ,MAAM,QAAQ,CAACI;YACfJ,MAAM,MAAM;QAChB;QACA,UAAUA,MAAM,QAAQ;QACxB,UAAUA,MAAM,QAAQ;QACxB,YAAYA,MAAM,UAAU;QAC5B,SAASC,QAAQ,GAAG,CAACI,CAAAA,MAAQ;gBACzB,OAAOA,IAAI,KAAK;gBAChB,OAAOF,OAAOE,IAAI,KAAK;gBACvB,UAAUA,IAAI,QAAQ;YAC1B;;AAGZ"}

package/base/Base/FieldRenderers/CheckboxesRenderer.js

@@ -6,6 +6,7 @@ const CheckboxesRenderer = createFieldRenderer(({ field })=>{
     const value = field.value ?? [];
     return /*#__PURE__*/ react.createElement(CheckboxGroup, {
         label: field.label,
+        hint: field.help,
         description: field.description,
         note: field.note,
         required: field.required,

package/base/Base/FieldRenderers/CheckboxesRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Base/FieldRenderers/CheckboxesRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/CheckboxesRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { CheckboxGroup } from \"@webiny/admin-ui\";\nimport type { IValueOption } from \"~/features/formModel/index.js\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        checkboxes: { fieldType: \"text\" | \"number\"; options: true; settings: undefined };\n    }\n}\n\nexport const CheckboxesRenderer = createFieldRenderer(({ field }) => {\n    const options: IValueOption[] = field.options ?? [];\n    const value = (field.value as (string | number)[]) ?? [];\n\n    return (\n        <CheckboxGroup\n            label={field.label}\n            description={field.description}\n            note={field.note}\n            required={field.required}\n            disabled={field.disabled}\n            validation={field.validation}\n            items={options.map(opt => ({\n                label: opt.label,\n                value: opt.value\n            }))}\n            value={value}\n            onChange={value => {\n                field.onChange(value);\n                field.onBlur();\n            }}\n        />\n    );\n});\n"],"names":["CheckboxesRenderer","createFieldRenderer","field","options","value","CheckboxGroup","opt"],"mappings":";;;AAWO,MAAMA,qBAAqBC,oBAAoB,CAAC,EAAEC,KAAK,EAAE;IAC5D,MAAMC,UAA0BD,MAAM,OAAO,IAAI,EAAE;IACnD,MAAME,QAASF,MAAM,KAAK,IAA4B,EAAE;IAExD,OAAO,WAAP,GACI,oBAACG,eAAaA;QACV,OAAOH,MAAM,KAAK;QAClB,aAAaA,MAAM,WAAW;QAC9B,MAAMA,MAAM,IAAI;QAChB,UAAUA,MAAM,QAAQ;QACxB,UAAUA,MAAM,QAAQ;QACxB,YAAYA,MAAM,UAAU;QAC5B,OAAOC,QAAQ,GAAG,CAACG,CAAAA,MAAQ;gBACvB,OAAOA,IAAI,KAAK;gBAChB,OAAOA,IAAI,KAAK;YACpB;QACA,OAAOF;QACP,UAAUA,CAAAA;YACNF,MAAM,QAAQ,CAACE;YACfF,MAAM,MAAM;QAChB;;AAGZ"}
+{"version":3,"file":"base/Base/FieldRenderers/CheckboxesRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/CheckboxesRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { CheckboxGroup } from \"@webiny/admin-ui\";\nimport type { IValueOption } from \"~/features/formModel/index.js\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        checkboxes: { fieldType: \"text\" | \"number\"; options: true; settings: undefined };\n    }\n}\n\nexport const CheckboxesRenderer = createFieldRenderer(({ field }) => {\n    const options: IValueOption[] = field.options ?? [];\n    const value = (field.value as (string | number)[]) ?? [];\n\n    return (\n        <CheckboxGroup\n            label={field.label}\n            hint={field.help}\n            description={field.description}\n            note={field.note}\n            required={field.required}\n            disabled={field.disabled}\n            validation={field.validation}\n            items={options.map(opt => ({\n                label: opt.label,\n                value: opt.value\n            }))}\n            value={value}\n            onChange={value => {\n                field.onChange(value);\n                field.onBlur();\n            }}\n        />\n    );\n});\n"],"names":["CheckboxesRenderer","createFieldRenderer","field","options","value","CheckboxGroup","opt"],"mappings":";;;AAWO,MAAMA,qBAAqBC,oBAAoB,CAAC,EAAEC,KAAK,EAAE;IAC5D,MAAMC,UAA0BD,MAAM,OAAO,IAAI,EAAE;IACnD,MAAME,QAASF,MAAM,KAAK,IAA4B,EAAE;IAExD,OAAO,WAAP,GACI,oBAACG,eAAaA;QACV,OAAOH,MAAM,KAAK;QAClB,MAAMA,MAAM,IAAI;QAChB,aAAaA,MAAM,WAAW;QAC9B,MAAMA,MAAM,IAAI;QAChB,UAAUA,MAAM,QAAQ;QACxB,UAAUA,MAAM,QAAQ;QACxB,YAAYA,MAAM,UAAU;QAC5B,OAAOC,QAAQ,GAAG,CAACG,CAAAA,MAAQ;gBACvB,OAAOA,IAAI,KAAK;gBAChB,OAAOA,IAAI,KAAK;YACpB;QACA,OAAOF;QACP,UAAUA,CAAAA;YACNF,MAAM,QAAQ,CAACE;YACfF,MAAM,MAAM;QAChB;;AAGZ"}

package/base/Base/FieldRenderers/DateTimeInputsRenderer.js

@@ -2,7 +2,7 @@ import react from "react";
 import { createFieldRenderer } from "../../../features/formModel/createFieldRenderer.js";
 import { ReactComponent } from "@webiny/icons/delete.svg";
 import { ReactComponent as add_svg_ReactComponent } from "@webiny/icons/add.svg";
-import { Button, DatePickerPrimitive, FormComponentDescription, IconButton, Separator } from "@webiny/admin-ui";
+import { Button, DatePickerPrimitive, FormComponentDescription, FormComponentErrorMessage, IconButton, Separator } from "@webiny/admin-ui";
 const PICKER_TYPE_MAP = {
     date: "date",
     time: "time",
@@ -59,6 +59,10 @@ const DateTimeInputsRenderer = createFieldRenderer(({ field })=>{
         icon: /*#__PURE__*/ react.createElement(add_svg_ReactComponent, null),
         text: field.rendererSettings?.addItemLabel ?? "Add Value",
         onClick: ()=>field.addItem("")
+    }), /*#__PURE__*/ react.createElement(FormComponentErrorMessage, {
+        text: field.validation.message,
+        invalid: false === field.validation.isValid,
+        disabled: field.disabled
     }));
 });
 export { DateTimeInputsRenderer };

package/base/Base/FieldRenderers/DateTimeInputsRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Base/FieldRenderers/DateTimeInputsRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/DateTimeInputsRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete.svg\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\nimport {\n    Button,\n    DatePickerPrimitive,\n    type DatePickerPrimitiveProps,\n    FormComponentDescription,\n    Separator\n} from \"@webiny/admin-ui\";\nimport { IconButton } from \"@webiny/admin-ui\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        dateTimeInputs: {\n            fieldType: \"datetime\";\n            settings: {\n                type:\n                    | \"date\"\n                    | \"time\"\n                    | \"dateTimeLocal\"\n                    | \"dateTimeTz\"\n                    | \"dateTimeWithoutTimezone\"\n                    | \"dateTimeWithTimezone\"\n                    | \"month\"\n                    | \"week\";\n                addItemLabel?: string;\n                displayFormat?: string;\n                weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n            };\n        };\n    }\n}\n\ntype StringPickerType = \"date\" | \"time\" | \"dateTimeLocal\" | \"dateTimeTz\" | \"month\" | \"week\";\n\nconst PICKER_TYPE_MAP: Record<string, StringPickerType> = {\n    date: \"date\",\n    time: \"time\",\n    dateTimeLocal: \"dateTimeLocal\",\n    dateTimeTz: \"dateTimeTz\",\n    dateTimeWithoutTimezone: \"dateTimeLocal\",\n    dateTimeWithTimezone: \"dateTimeTz\",\n    month: \"month\",\n    week: \"week\"\n};\n\nexport const DateTimeInputsRenderer = createFieldRenderer<\"dateTimeInputs\">(({ field }) => {\n    const values = (field.value as string[]) ?? [];\n    const settingsType = field.rendererSettings?.type ?? \"date\";\n    const pickerType: StringPickerType = PICKER_TYPE_MAP[settingsType] ?? \"date\";\n\n    const updateAt = (index: number, val: string | undefined) => {\n        const next = [...values];\n        next[index] = val ?? \"\";\n        field.onChange(next);\n    };\n\n    return (\n        <div className=\"flex flex-col gap-sm\">\n            <Separator labelPosition=\"start\" variant=\"accent\">\n                <span className=\"text-accent-primary text-lg font-semibold\">\n                    {`${field.label ?? \"\"} ${values.length ? `(${values.length})` : \"\"}`}\n                </span>\n            </Separator>\n            {field.description && <FormComponentDescription text={field.description} />}\n            {values.map((val, index) => (\n                <div key={index} className=\"flex items-center gap-sm\">\n                    <div className=\"flex-1\">\n                        <DatePickerPrimitive\n                            {...({\n                                type: pickerType,\n                                value: val || undefined,\n                                onChange: (v: string | undefined) => updateAt(index, v),\n                                disabled: field.disabled,\n                                displayFormat: field.rendererSettings?.displayFormat,\n                                weekStartsOn: field.rendererSettings?.weekStartsOn\n                            } as DatePickerPrimitiveProps)}\n                        />\n                    </div>\n                    <IconButton\n                        icon={<DeleteIcon />}\n                        onClick={e => {\n                            e.stopPropagation();\n                            field.removeItem(index);\n                        }}\n                        size=\"lg\"\n                        variant=\"ghost\"\n                    />\n                </div>\n            ))}\n            <Button\n                disabled={field.disabled}\n                variant=\"tertiary\"\n                icon={<AddIcon />}\n                text={field.rendererSettings?.addItemLabel ?? \"Add Value\"}\n                onClick={() => field.addItem(\"\")}\n            />\n        </div>\n    );\n});\n"],"names":["PICKER_TYPE_MAP","DateTimeInputsRenderer","createFieldRenderer","field","values","settingsType","pickerType","updateAt","index","val","next","Separator","FormComponentDescription","DatePickerPrimitive","undefined","v","IconButton","DeleteIcon","e","Button","AddIcon"],"mappings":";;;;;AAqCA,MAAMA,kBAAoD;IACtD,MAAM;IACN,MAAM;IACN,eAAe;IACf,YAAY;IACZ,yBAAyB;IACzB,sBAAsB;IACtB,OAAO;IACP,MAAM;AACV;AAEO,MAAMC,yBAAyBC,oBAAsC,CAAC,EAAEC,KAAK,EAAE;IAClF,MAAMC,SAAUD,MAAM,KAAK,IAAiB,EAAE;IAC9C,MAAME,eAAeF,MAAM,gBAAgB,EAAE,QAAQ;IACrD,MAAMG,aAA+BN,eAAe,CAACK,aAAa,IAAI;IAEtE,MAAME,WAAW,CAACC,OAAeC;QAC7B,MAAMC,OAAO;eAAIN;SAAO;QACxBM,IAAI,CAACF,MAAM,GAAGC,OAAO;QACrBN,MAAM,QAAQ,CAACO;IACnB;IAEA,OAAO,WAAP,GACI,oBAAC;QAAI,WAAU;qBACX,oBAACC,WAASA;QAAC,eAAc;QAAQ,SAAQ;qBACrC,oBAAC;QAAK,WAAU;OACX,GAAGR,MAAM,KAAK,IAAI,GAAG,CAAC,EAAEC,OAAO,MAAM,GAAG,CAAC,CAAC,EAAEA,OAAO,MAAM,CAAC,CAAC,CAAC,GAAG,IAAI,IAG3ED,MAAM,WAAW,IAAI,WAAJ,GAAI,oBAACS,0BAAwBA;QAAC,MAAMT,MAAM,WAAW;QACtEC,OAAO,GAAG,CAAC,CAACK,KAAKD,QAAAA,WAAAA,GACd,oBAAC;YAAI,KAAKA;YAAO,WAAU;yBACvB,oBAAC;YAAI,WAAU;yBACX,oBAACK,qBACQ;YACD,MAAMP;YACN,OAAOG,OAAOK;YACd,UAAU,CAACC,IAA0BR,SAASC,OAAOO;YACrD,UAAUZ,MAAM,QAAQ;YACxB,eAAeA,MAAM,gBAAgB,EAAE;YACvC,cAAcA,MAAM,gBAAgB,EAAE;QAC1C,mBAGR,oBAACa,YAAUA;YACP,oBAAM,oBAACC,gBAAUA;YACjB,SAASC,CAAAA;gBACLA,EAAE,eAAe;gBACjBf,MAAM,UAAU,CAACK;YACrB;YACA,MAAK;YACL,SAAQ;4BAIpB,oBAACW,QAAMA;QACH,UAAUhB,MAAM,QAAQ;QACxB,SAAQ;QACR,oBAAM,oBAACiB,wBAAOA;QACd,MAAMjB,MAAM,gBAAgB,EAAE,gBAAgB;QAC9C,SAAS,IAAMA,MAAM,OAAO,CAAC;;AAI7C"}
+{"version":3,"file":"base/Base/FieldRenderers/DateTimeInputsRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/DateTimeInputsRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete.svg\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\nimport {\n    Button,\n    DatePickerPrimitive,\n    type DatePickerPrimitiveProps,\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    Separator\n} from \"@webiny/admin-ui\";\nimport { IconButton } from \"@webiny/admin-ui\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        dateTimeInputs: {\n            fieldType: \"datetime\";\n            settings: {\n                type:\n                    | \"date\"\n                    | \"time\"\n                    | \"dateTimeLocal\"\n                    | \"dateTimeTz\"\n                    | \"dateTimeWithoutTimezone\"\n                    | \"dateTimeWithTimezone\"\n                    | \"month\"\n                    | \"week\";\n                addItemLabel?: string;\n                displayFormat?: string;\n                weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n            };\n        };\n    }\n}\n\ntype StringPickerType = \"date\" | \"time\" | \"dateTimeLocal\" | \"dateTimeTz\" | \"month\" | \"week\";\n\nconst PICKER_TYPE_MAP: Record<string, StringPickerType> = {\n    date: \"date\",\n    time: \"time\",\n    dateTimeLocal: \"dateTimeLocal\",\n    dateTimeTz: \"dateTimeTz\",\n    dateTimeWithoutTimezone: \"dateTimeLocal\",\n    dateTimeWithTimezone: \"dateTimeTz\",\n    month: \"month\",\n    week: \"week\"\n};\n\nexport const DateTimeInputsRenderer = createFieldRenderer<\"dateTimeInputs\">(({ field }) => {\n    const values = (field.value as string[]) ?? [];\n    const settingsType = field.rendererSettings?.type ?? \"date\";\n    const pickerType: StringPickerType = PICKER_TYPE_MAP[settingsType] ?? \"date\";\n\n    const updateAt = (index: number, val: string | undefined) => {\n        const next = [...values];\n        next[index] = val ?? \"\";\n        field.onChange(next);\n    };\n\n    return (\n        <div className=\"flex flex-col gap-sm\">\n            <Separator labelPosition=\"start\" variant=\"accent\">\n                <span className=\"text-accent-primary text-lg font-semibold\">\n                    {`${field.label ?? \"\"} ${values.length ? `(${values.length})` : \"\"}`}\n                </span>\n            </Separator>\n            {field.description && <FormComponentDescription text={field.description} />}\n            {values.map((val, index) => (\n                <div key={index} className=\"flex items-center gap-sm\">\n                    <div className=\"flex-1\">\n                        <DatePickerPrimitive\n                            {...({\n                                type: pickerType,\n                                value: val || undefined,\n                                onChange: (v: string | undefined) => updateAt(index, v),\n                                disabled: field.disabled,\n                                displayFormat: field.rendererSettings?.displayFormat,\n                                weekStartsOn: field.rendererSettings?.weekStartsOn\n                            } as DatePickerPrimitiveProps)}\n                        />\n                    </div>\n                    <IconButton\n                        icon={<DeleteIcon />}\n                        onClick={e => {\n                            e.stopPropagation();\n                            field.removeItem(index);\n                        }}\n                        size=\"lg\"\n                        variant=\"ghost\"\n                    />\n                </div>\n            ))}\n            <Button\n                disabled={field.disabled}\n                variant=\"tertiary\"\n                icon={<AddIcon />}\n                text={field.rendererSettings?.addItemLabel ?? \"Add Value\"}\n                onClick={() => field.addItem(\"\")}\n            />\n            <FormComponentErrorMessage\n                text={field.validation.message}\n                invalid={field.validation.isValid === false}\n                disabled={field.disabled}\n            />\n        </div>\n    );\n});\n"],"names":["PICKER_TYPE_MAP","DateTimeInputsRenderer","createFieldRenderer","field","values","settingsType","pickerType","updateAt","index","val","next","Separator","FormComponentDescription","DatePickerPrimitive","undefined","v","IconButton","DeleteIcon","e","Button","AddIcon","FormComponentErrorMessage"],"mappings":";;;;;AAsCA,MAAMA,kBAAoD;IACtD,MAAM;IACN,MAAM;IACN,eAAe;IACf,YAAY;IACZ,yBAAyB;IACzB,sBAAsB;IACtB,OAAO;IACP,MAAM;AACV;AAEO,MAAMC,yBAAyBC,oBAAsC,CAAC,EAAEC,KAAK,EAAE;IAClF,MAAMC,SAAUD,MAAM,KAAK,IAAiB,EAAE;IAC9C,MAAME,eAAeF,MAAM,gBAAgB,EAAE,QAAQ;IACrD,MAAMG,aAA+BN,eAAe,CAACK,aAAa,IAAI;IAEtE,MAAME,WAAW,CAACC,OAAeC;QAC7B,MAAMC,OAAO;eAAIN;SAAO;QACxBM,IAAI,CAACF,MAAM,GAAGC,OAAO;QACrBN,MAAM,QAAQ,CAACO;IACnB;IAEA,OAAO,WAAP,GACI,oBAAC;QAAI,WAAU;qBACX,oBAACC,WAASA;QAAC,eAAc;QAAQ,SAAQ;qBACrC,oBAAC;QAAK,WAAU;OACX,GAAGR,MAAM,KAAK,IAAI,GAAG,CAAC,EAAEC,OAAO,MAAM,GAAG,CAAC,CAAC,EAAEA,OAAO,MAAM,CAAC,CAAC,CAAC,GAAG,IAAI,IAG3ED,MAAM,WAAW,IAAI,WAAJ,GAAI,oBAACS,0BAAwBA;QAAC,MAAMT,MAAM,WAAW;QACtEC,OAAO,GAAG,CAAC,CAACK,KAAKD,QAAAA,WAAAA,GACd,oBAAC;YAAI,KAAKA;YAAO,WAAU;yBACvB,oBAAC;YAAI,WAAU;yBACX,oBAACK,qBACQ;YACD,MAAMP;YACN,OAAOG,OAAOK;YACd,UAAU,CAACC,IAA0BR,SAASC,OAAOO;YACrD,UAAUZ,MAAM,QAAQ;YACxB,eAAeA,MAAM,gBAAgB,EAAE;YACvC,cAAcA,MAAM,gBAAgB,EAAE;QAC1C,mBAGR,oBAACa,YAAUA;YACP,oBAAM,oBAACC,gBAAUA;YACjB,SAASC,CAAAA;gBACLA,EAAE,eAAe;gBACjBf,MAAM,UAAU,CAACK;YACrB;YACA,MAAK;YACL,SAAQ;4BAIpB,oBAACW,QAAMA;QACH,UAAUhB,MAAM,QAAQ;QACxB,SAAQ;QACR,oBAAM,oBAACiB,wBAAOA;QACd,MAAMjB,MAAM,gBAAgB,EAAE,gBAAgB;QAC9C,SAAS,IAAMA,MAAM,OAAO,CAAC;sBAEjC,oBAACkB,2BAAyBA;QACtB,MAAMlB,MAAM,UAAU,CAAC,OAAO;QAC9B,SAASA,AAA6B,UAA7BA,MAAM,UAAU,CAAC,OAAO;QACjC,UAAUA,MAAM,QAAQ;;AAIxC"}

package/base/Base/FieldRenderers/FilePickerRenderer.js

@@ -11,9 +11,11 @@ const FilePickerRenderer = createFieldRenderer(({ field })=>{
         scope: settings?.scope,
         render: ({ showFileManager })=>/*#__PURE__*/ react.createElement(FilePicker, {
                 label: field.label,
+                hint: field.help,
                 description: field.description,
                 type: "area",
                 value: toFilePickerValue(field.value),
+                validation: field.validation,
                 onSelectItem: ()=>showFileManager((file)=>{
                         field.onChange(fileManagerItemToValue(file));
                     }),

package/base/Base/FieldRenderers/FilePickerRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Base/FieldRenderers/FilePickerRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/FilePickerRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { FileManager } from \"~/base/ui/FileManager.js\";\nimport { FilePicker, type FileItemDto } from \"@webiny/admin-ui\";\nimport type { FileManagerFileItem } from \"~/base/ui/FileManager.js\";\nimport type { FileValue } from \"~/features/formModel/abstractions.js\";\nimport type { FileFieldSettings } from \"~/features/formModel/fieldTypes/FileFieldType.js\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        filePicker: { fieldType: \"file\"; settings: FileFieldSettings };\n    }\n}\n\nexport const FilePickerRenderer = createFieldRenderer<\"filePicker\">(({ field }) => {\n    const settings = field.rendererSettings as FileFieldSettings | undefined;\n\n    return (\n        <FileManager\n            images={settings?.images}\n            accept={settings?.accept}\n            own={settings?.own}\n            scope={settings?.scope}\n            render={({ showFileManager }) => (\n                <FilePicker\n                    label={field.label}\n                    description={field.description}\n                    type=\"area\"\n                    value={toFilePickerValue(field.value)}\n                    onSelectItem={() =>\n                        showFileManager((file: FileManagerFileItem) => {\n                            field.onChange(fileManagerItemToValue(file));\n                        })\n                    }\n                    onRemoveItem={() => field.onChange(undefined)}\n                />\n            )}\n        />\n    );\n});\n\nconst toFilePickerValue = (value: unknown): FileItemDto | undefined => {\n    const img = value as FileValue | undefined;\n    if (!img?.src) {\n        return undefined;\n    }\n    return { url: img.src, name: img.name, mimeType: img.mimeType };\n};\n\nconst fileManagerItemToValue = (file: FileManagerFileItem) => {\n    return {\n        id: file.id,\n        name: file.name,\n        size: file.size,\n        mimeType: file.type,\n        src: file.src || \"\",\n        width: file.width,\n        height: file.height\n    };\n};\n"],"names":["FilePickerRenderer","createFieldRenderer","field","settings","FileManager","showFileManager","FilePicker","toFilePickerValue","file","fileManagerItemToValue","undefined","value","img"],"mappings":";;;;AAcO,MAAMA,qBAAqBC,oBAAkC,CAAC,EAAEC,KAAK,EAAE;IAC1E,MAAMC,WAAWD,MAAM,gBAAgB;IAEvC,OAAO,WAAP,GACI,oBAACE,aAAWA;QACR,QAAQD,UAAU;QAClB,QAAQA,UAAU;QAClB,KAAKA,UAAU;QACf,OAAOA,UAAU;QACjB,QAAQ,CAAC,EAAEE,eAAe,EAAE,iBACxB,oBAACC,YAAUA;gBACP,OAAOJ,MAAM,KAAK;gBAClB,aAAaA,MAAM,WAAW;gBAC9B,MAAK;gBACL,OAAOK,kBAAkBL,MAAM,KAAK;gBACpC,cAAc,IACVG,gBAAgB,CAACG;wBACbN,MAAM,QAAQ,CAACO,uBAAuBD;oBAC1C;gBAEJ,cAAc,IAAMN,MAAM,QAAQ,CAACQ;;;AAKvD;AAEA,MAAMH,oBAAoB,CAACI;IACvB,MAAMC,MAAMD;IACZ,IAAI,CAACC,KAAK,KACN;IAEJ,OAAO;QAAE,KAAKA,IAAI,GAAG;QAAE,MAAMA,IAAI,IAAI;QAAE,UAAUA,IAAI,QAAQ;IAAC;AAClE;AAEA,MAAMH,yBAAyB,CAACD,OACrB;QACH,IAAIA,KAAK,EAAE;QACX,MAAMA,KAAK,IAAI;QACf,MAAMA,KAAK,IAAI;QACf,UAAUA,KAAK,IAAI;QACnB,KAAKA,KAAK,GAAG,IAAI;QACjB,OAAOA,KAAK,KAAK;QACjB,QAAQA,KAAK,MAAM;IACvB"}
+{"version":3,"file":"base/Base/FieldRenderers/FilePickerRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/FilePickerRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { FileManager } from \"~/base/ui/FileManager.js\";\nimport { FilePicker, type FileItemDto } from \"@webiny/admin-ui\";\nimport type { FileManagerFileItem } from \"~/base/ui/FileManager.js\";\nimport type { FileValue } from \"~/features/formModel/abstractions.js\";\nimport type { FileFieldSettings } from \"~/features/formModel/fieldTypes/FileFieldType.js\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        filePicker: { fieldType: \"file\"; settings: FileFieldSettings };\n    }\n}\n\nexport const FilePickerRenderer = createFieldRenderer<\"filePicker\">(({ field }) => {\n    const settings = field.rendererSettings as FileFieldSettings | undefined;\n\n    return (\n        <FileManager\n            images={settings?.images}\n            accept={settings?.accept}\n            own={settings?.own}\n            scope={settings?.scope}\n            render={({ showFileManager }) => (\n                <FilePicker\n                    label={field.label}\n                    hint={field.help}\n                    description={field.description}\n                    type=\"area\"\n                    value={toFilePickerValue(field.value)}\n                    validation={field.validation}\n                    onSelectItem={() =>\n                        showFileManager((file: FileManagerFileItem) => {\n                            field.onChange(fileManagerItemToValue(file));\n                        })\n                    }\n                    onRemoveItem={() => field.onChange(undefined)}\n                />\n            )}\n        />\n    );\n});\n\nconst toFilePickerValue = (value: unknown): FileItemDto | undefined => {\n    const img = value as FileValue | undefined;\n    if (!img?.src) {\n        return undefined;\n    }\n    return { url: img.src, name: img.name, mimeType: img.mimeType };\n};\n\nconst fileManagerItemToValue = (file: FileManagerFileItem) => {\n    return {\n        id: file.id,\n        name: file.name,\n        size: file.size,\n        mimeType: file.type,\n        src: file.src || \"\",\n        width: file.width,\n        height: file.height\n    };\n};\n"],"names":["FilePickerRenderer","createFieldRenderer","field","settings","FileManager","showFileManager","FilePicker","toFilePickerValue","file","fileManagerItemToValue","undefined","value","img"],"mappings":";;;;AAcO,MAAMA,qBAAqBC,oBAAkC,CAAC,EAAEC,KAAK,EAAE;IAC1E,MAAMC,WAAWD,MAAM,gBAAgB;IAEvC,OAAO,WAAP,GACI,oBAACE,aAAWA;QACR,QAAQD,UAAU;QAClB,QAAQA,UAAU;QAClB,KAAKA,UAAU;QACf,OAAOA,UAAU;QACjB,QAAQ,CAAC,EAAEE,eAAe,EAAE,iBACxB,oBAACC,YAAUA;gBACP,OAAOJ,MAAM,KAAK;gBAClB,MAAMA,MAAM,IAAI;gBAChB,aAAaA,MAAM,WAAW;gBAC9B,MAAK;gBACL,OAAOK,kBAAkBL,MAAM,KAAK;gBACpC,YAAYA,MAAM,UAAU;gBAC5B,cAAc,IACVG,gBAAgB,CAACG;wBACbN,MAAM,QAAQ,CAACO,uBAAuBD;oBAC1C;gBAEJ,cAAc,IAAMN,MAAM,QAAQ,CAACQ;;;AAKvD;AAEA,MAAMH,oBAAoB,CAACI;IACvB,MAAMC,MAAMD;IACZ,IAAI,CAACC,KAAK,KACN;IAEJ,OAAO;QAAE,KAAKA,IAAI,GAAG;QAAE,MAAMA,IAAI,IAAI;QAAE,UAAUA,IAAI,QAAQ;IAAC;AAClE;AAEA,MAAMH,yBAAyB,CAACD,OACrB;QACH,IAAIA,KAAK,EAAE;QACX,MAAMA,KAAK,IAAI;QACf,MAAMA,KAAK,IAAI;QACf,UAAUA,KAAK,IAAI;QACnB,KAAKA,KAAK,GAAG,IAAI;QACjB,OAAOA,KAAK,KAAK;QACjB,QAAQA,KAAK,MAAM;IACvB"}

package/base/Base/FieldRenderers/FileUrlPickerRenderer.js

@@ -6,6 +6,7 @@ const FileUrlPickerRenderer = createFieldRenderer(({ field })=>/*#__PURE__*/ rea
         images: true,
         render: ({ showFileManager })=>/*#__PURE__*/ react.createElement(FilePicker, {
                 label: field.label,
+                hint: field.help,
                 description: field.description,
                 type: "area",
                 value: field.value,

package/base/Base/FieldRenderers/FileUrlPickerRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Base/FieldRenderers/FileUrlPickerRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/FileUrlPickerRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { FileManager } from \"~/base/ui/FileManager.js\";\nimport { FilePicker } from \"@webiny/admin-ui\";\nimport type { FileManagerFileItem } from \"~/base/ui/FileManager.js\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        fileUrlPicker: { fieldType: \"fileUrl\"; settings: undefined };\n    }\n}\n\nexport const FileUrlPickerRenderer = createFieldRenderer(({ field }) => {\n    return (\n        <FileManager\n            images={true}\n            render={({ showFileManager }) => (\n                <FilePicker\n                    label={field.label}\n                    description={field.description}\n                    type=\"area\"\n                    value={field.value as string | undefined}\n                    onSelectItem={() =>\n                        showFileManager((file: FileManagerFileItem) => {\n                            field.onChange(file.src || \"\");\n                        })\n                    }\n                    onRemoveItem={() => field.onChange(undefined)}\n                />\n            )}\n        />\n    );\n});\n"],"names":["FileUrlPickerRenderer","createFieldRenderer","field","FileManager","showFileManager","FilePicker","file","undefined"],"mappings":";;;;AAYO,MAAMA,wBAAwBC,oBAAoB,CAAC,EAAEC,KAAK,EAAE,GACxD,WAAP,GACI,oBAACC,aAAWA;QACR,QAAQ;QACR,QAAQ,CAAC,EAAEC,eAAe,EAAE,iBACxB,oBAACC,YAAUA;gBACP,OAAOH,MAAM,KAAK;gBAClB,aAAaA,MAAM,WAAW;gBAC9B,MAAK;gBACL,OAAOA,MAAM,KAAK;gBAClB,cAAc,IACVE,gBAAgB,CAACE;wBACbJ,MAAM,QAAQ,CAACI,KAAK,GAAG,IAAI;oBAC/B;gBAEJ,cAAc,IAAMJ,MAAM,QAAQ,CAACK"}
+{"version":3,"file":"base/Base/FieldRenderers/FileUrlPickerRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/FileUrlPickerRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { FileManager } from \"~/base/ui/FileManager.js\";\nimport { FilePicker } from \"@webiny/admin-ui\";\nimport type { FileManagerFileItem } from \"~/base/ui/FileManager.js\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        fileUrlPicker: { fieldType: \"fileUrl\"; settings: undefined };\n    }\n}\n\nexport const FileUrlPickerRenderer = createFieldRenderer(({ field }) => {\n    return (\n        <FileManager\n            images={true}\n            render={({ showFileManager }) => (\n                <FilePicker\n                    label={field.label}\n                    hint={field.help}\n                    description={field.description}\n                    type=\"area\"\n                    value={field.value as string | undefined}\n                    onSelectItem={() =>\n                        showFileManager((file: FileManagerFileItem) => {\n                            field.onChange(file.src || \"\");\n                        })\n                    }\n                    onRemoveItem={() => field.onChange(undefined)}\n                />\n            )}\n        />\n    );\n});\n"],"names":["FileUrlPickerRenderer","createFieldRenderer","field","FileManager","showFileManager","FilePicker","file","undefined"],"mappings":";;;;AAYO,MAAMA,wBAAwBC,oBAAoB,CAAC,EAAEC,KAAK,EAAE,GACxD,WAAP,GACI,oBAACC,aAAWA;QACR,QAAQ;QACR,QAAQ,CAAC,EAAEC,eAAe,EAAE,iBACxB,oBAACC,YAAUA;gBACP,OAAOH,MAAM,KAAK;gBAClB,MAAMA,MAAM,IAAI;gBAChB,aAAaA,MAAM,WAAW;gBAC9B,MAAK;gBACL,OAAOA,MAAM,KAAK;gBAClB,cAAc,IACVE,gBAAgB,CAACE;wBACbJ,MAAM,QAAQ,CAACI,KAAK,GAAG,IAAI;oBAC/B;gBAEJ,cAAc,IAAMJ,MAAM,QAAQ,CAACK"}

package/base/Base/FieldRenderers/HorizontalTabsRenderer.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
 import type { TabsNodeRendererProps } from "../../../features/formModel/FormView.js";
-export declare const HorizontalTabsRenderer: (({ node }: TabsNodeRendererProps) => React.JSX.Element) & React.NamedExoticComponent<TabsNodeRendererProps> & {
-    readonly type: ({ node }: TabsNodeRendererProps) => React.JSX.Element;
+export declare const HorizontalTabsRenderer: (({ node }: TabsNodeRendererProps) => React.JSX.Element) & {
+    displayName: string;
 };

package/base/Base/FieldRenderers/HorizontalTabsRenderer.js

@@ -4,6 +4,7 @@ import { Tabs } from "@webiny/admin-ui";
 import { LayoutNodeRenderer, renderTabIcon } from "../../../features/formModel/FormView.js";
 const HorizontalTabsRenderer_HorizontalTabsRenderer = observer(function({ node }) {
     return /*#__PURE__*/ react.createElement(Tabs, {
+        ...node.rendererSettings,
         value: node.activeTabId,
         onValueChange: (id)=>node.setActiveTab(id),
         tabs: node.tabs.map((tab)=>/*#__PURE__*/ react.createElement(Tabs.Tab, {
@@ -13,7 +14,7 @@ const HorizontalTabsRenderer_HorizontalTabsRenderer = observer(function({ node }
                 trigger: tab.label,
                 disabled: tab.disabled,
                 content: /*#__PURE__*/ react.createElement("div", {
-                    className: "flex flex-col gap-4 mt-md"
+                    className: "flex flex-col gap-4"
                 }, tab.layout.map((childNode, index)=>/*#__PURE__*/ react.createElement(LayoutNodeRenderer, {
                         key: index,
                         node: childNode

package/base/Base/FieldRenderers/HorizontalTabsRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Base/FieldRenderers/HorizontalTabsRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/HorizontalTabsRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { Tabs } from \"@webiny/admin-ui\";\nimport { LayoutNodeRenderer, renderTabIcon } from \"~/features/formModel/FormView.js\";\nimport type { TabsNodeRendererProps } from \"~/features/formModel/FormView.js\";\n\nexport const HorizontalTabsRenderer = observer(function HorizontalTabsRenderer({\n    node\n}: TabsNodeRendererProps) {\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={tab.label}\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"],"names":["HorizontalTabsRenderer","observer","node","Tabs","id","tab","renderTabIcon","childNode","index","LayoutNodeRenderer"],"mappings":";;;;AAMO,MAAMA,gDAAyBC,SAAS,SAAgC,EAC3EC,IAAI,EACgB;IACpB,OAAO,WAAP,GACI,oBAACC,MAAIA;QACD,OAAOD,KAAK,WAAW;QACvB,eAAeE,CAAAA,KAAMF,KAAK,YAAY,CAACE;QACvC,MAAMF,KAAK,IAAI,CAAC,GAAG,CAACG,CAAAA,MAAAA,WAAAA,GAChB,oBAACF,KAAK,GAAG;gBACL,KAAKE,IAAI,EAAE;gBACX,OAAOA,IAAI,EAAE;gBACb,MAAMC,cAAcD,IAAI,IAAI;gBAC5B,SAASA,IAAI,KAAK;gBAClB,UAAUA,IAAI,QAAQ;gBACtB,uBACI,oBAAC;oBAAI,WAAW;mBACXA,IAAI,MAAM,CAAC,GAAG,CAAC,CAACE,WAAWC,QAAAA,WAAAA,GACxB,oBAACC,oBAAkBA;wBAAC,KAAKD;wBAAO,MAAMD;;;;AAQtE"}
+{"version":3,"file":"base/Base/FieldRenderers/HorizontalTabsRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/HorizontalTabsRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { Tabs } from \"@webiny/admin-ui\";\nimport { LayoutNodeRenderer, renderTabIcon } from \"~/features/formModel/FormView.js\";\nimport type { TabsNodeRendererProps } from \"~/features/formModel/FormView.js\";\n\nexport const HorizontalTabsRenderer = observer(function HorizontalTabsRenderer({\n    node\n}: TabsNodeRendererProps) {\n    return (\n        <Tabs\n            {...(node.rendererSettings as Record<string, any>)}\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={tab.label}\n                    disabled={tab.disabled}\n                    content={\n                        <div className={\"flex flex-col gap-4\"}>\n                            {tab.layout.map((childNode, index) => (\n                                <LayoutNodeRenderer key={index} node={childNode} />\n                            ))}\n                        </div>\n                    }\n                />\n            ))}\n        />\n    );\n});\n"],"names":["HorizontalTabsRenderer","observer","node","Tabs","id","tab","renderTabIcon","childNode","index","LayoutNodeRenderer"],"mappings":";;;;AAMO,MAAMA,gDAAyBC,SAAS,SAAgC,EAC3EC,IAAI,EACgB;IACpB,OAAO,WAAP,GACI,oBAACC,MAAIA;QACA,GAAID,KAAK,gBAAgB;QAC1B,OAAOA,KAAK,WAAW;QACvB,eAAeE,CAAAA,KAAMF,KAAK,YAAY,CAACE;QACvC,MAAMF,KAAK,IAAI,CAAC,GAAG,CAACG,CAAAA,MAAAA,WAAAA,GAChB,oBAACF,KAAK,GAAG;gBACL,KAAKE,IAAI,EAAE;gBACX,OAAOA,IAAI,EAAE;gBACb,MAAMC,cAAcD,IAAI,IAAI;gBAC5B,SAASA,IAAI,KAAK;gBAClB,UAAUA,IAAI,QAAQ;gBACtB,uBACI,oBAAC;oBAAI,WAAW;mBACXA,IAAI,MAAM,CAAC,GAAG,CAAC,CAACE,WAAWC,QAAAA,WAAAA,GACxB,oBAACC,oBAAkBA;wBAAC,KAAKD;wBAAO,MAAMD;;;;AAQtE"}

package/base/Base/FieldRenderers/InputRenderer.js

@@ -6,6 +6,7 @@ const InputRenderer = createFieldRenderer(({ field })=>/*#__PURE__*/ react.creat
         onChange: (value)=>field.onChange(value)
     }, /*#__PURE__*/ react.createElement(Input, {
         label: field.label,
+        hint: field.help,
         placeholder: field.placeholder,
         description: field.description,
         note: field.note,

package/base/Base/FieldRenderers/InputRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"base/Base/FieldRenderers/InputRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/InputRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { Input } from \"@webiny/admin-ui\";\nimport { DelayedOnChange } from \"@webiny/admin-ui\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        textInput: { fieldType: \"text\"; settings: undefined };\n    }\n}\n\nexport const InputRenderer = createFieldRenderer(({ field }) => {\n    return (\n        <DelayedOnChange value={field.value} onChange={value => field.onChange(value)}>\n            <Input\n                label={field.label}\n                placeholder={field.placeholder}\n                description={field.description}\n                note={field.note}\n                required={field.required}\n                disabled={field.disabled}\n                validation={field.validation}\n                onBlur={() => field.onBlur()}\n            />\n        </DelayedOnChange>\n    );\n});\n"],"names":["InputRenderer","createFieldRenderer","field","DelayedOnChange","value","Input"],"mappings":";;;AAWO,MAAMA,gBAAgBC,oBAAoB,CAAC,EAAEC,KAAK,EAAE,GAChD,WAAP,GACI,oBAACC,iBAAeA;QAAC,OAAOD,MAAM,KAAK;QAAE,UAAUE,CAAAA,QAASF,MAAM,QAAQ,CAACE;qBACnE,oBAACC,OAAKA;QACF,OAAOH,MAAM,KAAK;QAClB,aAAaA,MAAM,WAAW;QAC9B,aAAaA,MAAM,WAAW;QAC9B,MAAMA,MAAM,IAAI;QAChB,UAAUA,MAAM,QAAQ;QACxB,UAAUA,MAAM,QAAQ;QACxB,YAAYA,MAAM,UAAU;QAC5B,QAAQ,IAAMA,MAAM,MAAM"}
+{"version":3,"file":"base/Base/FieldRenderers/InputRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/InputRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { Input } from \"@webiny/admin-ui\";\nimport { DelayedOnChange } from \"@webiny/admin-ui\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n    interface IFieldRendererRegistry {\n        textInput: { fieldType: \"text\"; settings: undefined };\n    }\n}\n\nexport const InputRenderer = createFieldRenderer(({ field }) => {\n    return (\n        <DelayedOnChange value={field.value} onChange={value => field.onChange(value)}>\n            <Input\n                label={field.label}\n                hint={field.help}\n                placeholder={field.placeholder}\n                description={field.description}\n                note={field.note}\n                required={field.required}\n                disabled={field.disabled}\n                validation={field.validation}\n                onBlur={() => field.onBlur()}\n            />\n        </DelayedOnChange>\n    );\n});\n"],"names":["InputRenderer","createFieldRenderer","field","DelayedOnChange","value","Input"],"mappings":";;;AAWO,MAAMA,gBAAgBC,oBAAoB,CAAC,EAAEC,KAAK,EAAE,GAChD,WAAP,GACI,oBAACC,iBAAeA;QAAC,OAAOD,MAAM,KAAK;QAAE,UAAUE,CAAAA,QAASF,MAAM,QAAQ,CAACE;qBACnE,oBAACC,OAAKA;QACF,OAAOH,MAAM,KAAK;QAClB,MAAMA,MAAM,IAAI;QAChB,aAAaA,MAAM,WAAW;QAC9B,aAAaA,MAAM,WAAW;QAC9B,MAAMA,MAAM,IAAI;QAChB,UAAUA,MAAM,QAAQ;QACxB,UAAUA,MAAM,QAAQ;QACxB,YAAYA,MAAM,UAAU;QAC5B,QAAQ,IAAMA,MAAM,MAAM"}

package/base/Base/FieldRenderers/LexicalEditorsRenderer.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+declare module "../../../features/formModel/abstractions.js" {
+    interface IFieldRendererRegistry {
+        lexicalEditors: {
+            fieldType: "lexical";
+            settings?: {
+                addItemLabel?: string;
+            };
+        };
+    }
+}
+export declare const LexicalEditorsRenderer: React.ComponentType<{
+    field: import("../../..").IFieldVM;
+}>;

package/base/Base/FieldRenderers/LexicalEditorsRenderer.js

@@ -0,0 +1,78 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/delete_outline.svg";
+import { ReactComponent as add_svg_ReactComponent } from "@webiny/icons/add.svg";
+import { StaticToolbar } from "@webiny/lexical-editor";
+import { createFieldRenderer } from "../../../features/formModel/createFieldRenderer.js";
+import { LexicalEditor } from "../../../components/LexicalEditor/LexicalEditor.js";
+import { Button, FormComponentDescription, FormComponentErrorMessage, FormComponentNote, IconButton, Separator } from "@webiny/admin-ui";
+const placeholderStyles = {
+    position: "absolute",
+    top: 40,
+    left: 25
+};
+const contentEditableStyles = {
+    minHeight: 200,
+    display: "block",
+    padding: 10
+};
+const styles = {
+    backgroundColor: "#fff",
+    border: "1px solid #e1e1e1",
+    padding: "10px 14px",
+    minHeight: 200,
+    maxHeight: 350
+};
+const LexicalEditorsRenderer = createFieldRenderer(({ field })=>{
+    const values = field.value ?? [];
+    const updateAt = (index, val)=>{
+        const next = [
+            ...values
+        ];
+        next[index] = val;
+        field.onChange(next);
+    };
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-sm"
+    }, /*#__PURE__*/ react.createElement(Separator, {
+        labelPosition: "start",
+        variant: "accent"
+    }, /*#__PURE__*/ react.createElement("span", {
+        className: "text-accent-primary text-lg font-semibold"
+    }, `${field.label ?? ""} ${values.length ? `(${values.length})` : ""}`)), field.description && /*#__PURE__*/ react.createElement(FormComponentDescription, {
+        text: field.description
+    }), values.map((val, index)=>/*#__PURE__*/ react.createElement("div", {
+            key: index,
+            className: "relative"
+        }, /*#__PURE__*/ react.createElement(LexicalEditor, {
+            placeholder: field.placeholder || "Enter your text here...",
+            staticToolbar: /*#__PURE__*/ react.createElement(StaticToolbar, null),
+            placeholderStyles: placeholderStyles,
+            contentEditableStyles: contentEditableStyles,
+            styles: styles,
+            value: val,
+            onChange: (value)=>updateAt(index, value)
+        }), /*#__PURE__*/ react.createElement("div", {
+            className: "absolute top-sm right-sm z-10"
+        }, /*#__PURE__*/ react.createElement(IconButton, {
+            variant: "ghost",
+            size: "md",
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            onClick: ()=>field.removeItem(index)
+        })))), /*#__PURE__*/ react.createElement(Button, {
+        disabled: field.disabled,
+        variant: "tertiary",
+        icon: /*#__PURE__*/ react.createElement(add_svg_ReactComponent, null),
+        text: field.rendererSettings?.addItemLabel ?? "Add Value",
+        onClick: ()=>field.addItem(void 0)
+    }), field.note ? /*#__PURE__*/ react.createElement(FormComponentNote, {
+        text: field.note,
+        disabled: field.disabled
+    }) : null, /*#__PURE__*/ react.createElement(FormComponentErrorMessage, {
+        text: field.validation.message,
+        invalid: false === field.validation.isValid,
+        disabled: field.disabled
+    }));
+});
+export { LexicalEditorsRenderer };
+
+//# sourceMappingURL=LexicalEditorsRenderer.js.map