npm - @webiny/app-admin - Versions diffs - 6.4.0-beta.2 → 6.4.0-beta.4 - Mend

@webiny/app-admin 6.4.0-beta.2 → 6.4.0-beta.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (83) hide show

package/base/Base/DefaultFieldRenderers.js CHANGED Viewed

@@ -23,6 +23,7 @@ import { FilePickerRenderer } from "./FieldRenderers/FilePickerRenderer.js";
 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, {
         name: "textInput",
         component: InputRenderer
@@ -92,6 +93,9 @@ const DefaultFieldRenderers = ()=>/*#__PURE__*/ react.createElement(AdminConfig,
     }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
         name: "codeEditor",
         component: CodeEditorRenderer
+    }), /*#__PURE__*/ react.createElement(AdminConfig.Form.FieldRenderer, {
+        name: "lexical",
+        component: LexicalRenderer
     }));
 export { DefaultFieldRenderers };

package/base/Base/DefaultFieldRenderers.js.map CHANGED Viewed

	@@ -1 +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\";\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>\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"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;AA0BO~~,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"}
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"}

package/base/Base/FieldRenderers/LexicalRenderer.d.ts ADDED Viewed

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

package/base/Base/FieldRenderers/LexicalRenderer.js ADDED Viewed

@@ -0,0 +1,48 @@
+import react from "react";
+import { StaticToolbar } from "@webiny/lexical-editor";
+import { createFieldRenderer } from "../../../features/formModel/createFieldRenderer.js";
+import { LexicalEditor } from "../../../components/LexicalEditor/LexicalEditor.js";
+import { FormComponentDescription, FormComponentLabel, FormComponentNote } 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 LexicalRenderer = createFieldRenderer(({ field })=>{
+    const value = field.value;
+    const toolbar = /*#__PURE__*/ react.createElement(StaticToolbar, null);
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(FormComponentLabel, {
+        text: field.label,
+        hint: field.help,
+        disabled: field.disabled
+    }), /*#__PURE__*/ react.createElement(FormComponentDescription, {
+        text: field.description,
+        disabled: field.disabled
+    }), /*#__PURE__*/ react.createElement(LexicalEditor, {
+        placeholder: field.placeholder || "Enter your text here...",
+        staticToolbar: toolbar,
+        placeholderStyles: placeholderStyles,
+        contentEditableStyles: contentEditableStyles,
+        styles: styles,
+        value: value,
+        onChange: (value)=>field.onChange(value)
+    }), field.note ? /*#__PURE__*/ react.createElement(FormComponentNote, {
+        text: field.note,
+        disabled: field.disabled
+    }) : null);
+});
+export { LexicalRenderer };
+//# sourceMappingURL=LexicalRenderer.js.map

package/base/Base/FieldRenderers/LexicalRenderer.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"base/Base/FieldRenderers/LexicalRenderer.js","sources":["../../../../src/base/Base/FieldRenderers/LexicalRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { StaticToolbar } from \"@webiny/lexical-editor\";\nimport { createFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { LexicalEditor } from \"~/components/LexicalEditor/LexicalEditor.js\";\nimport type { RichTextValueWithHtml } from \"~/components/LexicalEditor/lexicalValueWithHtml.js\";\nimport { FormComponentLabel } from \"@webiny/admin-ui\";\nimport { FormComponentDescription } from \"@webiny/admin-ui\";\nimport { FormComponentNote } from \"@webiny/admin-ui\";\n\ndeclare module \"../../../features/formModel/abstractions.js\" {\n interface IFieldRendererRegistry {\n lexical: {\n fieldType: \"lexical\";\n settings: undefined;\n };\n }\n}\n\nconst placeholderStyles: React.CSSProperties = { position: \"absolute\", top: 40, left: 25 };\n\nconst contentEditableStyles: React.CSSProperties = {\n minHeight: 200,\n display: \"block\",\n padding: 10\n};\n\nconst styles: React.CSSProperties = {\n backgroundColor: \"#fff\",\n border: \"1px solid #e1e1e1\",\n padding: \"10px 14px\",\n minHeight: 200,\n maxHeight: 350\n};\n\nexport const LexicalRenderer = createFieldRenderer<\"lexical\">(({ field }) => {\n const value = field.value as RichTextValueWithHtml | undefined;\n const toolbar = <StaticToolbar />;\n\n return (\n <>\n <FormComponentLabel text={field.label} hint={field.help} disabled={field.disabled} />\n <FormComponentDescription text={field.description} disabled={field.disabled} />\n <LexicalEditor\n placeholder={field.placeholder || \"Enter your text here...\"}\n staticToolbar={toolbar}\n placeholderStyles={placeholderStyles}\n contentEditableStyles={contentEditableStyles}\n styles={styles}\n value={value}\n onChange={value => field.onChange(value)}\n />\n {field.note ? <FormComponentNote text={field.note} disabled={field.disabled} /> : null}\n </>\n );\n});\n"],"names":["placeholderStyles","contentEditableStyles","styles","LexicalRenderer","createFieldRenderer","field","value","toolbar","StaticToolbar","FormComponentLabel","FormComponentDescription","LexicalEditor","FormComponentNote"],"mappings":";;;;;AAkBA,MAAMA,oBAAyC;IAAE,UAAU;IAAY,KAAK;IAAI,MAAM;AAAG;AAEzF,MAAMC,wBAA6C;IAC/C,WAAW;IACX,SAAS;IACT,SAAS;AACb;AAEA,MAAMC,SAA8B;IAChC,iBAAiB;IACjB,QAAQ;IACR,SAAS;IACT,WAAW;IACX,WAAW;AACf;AAEO,MAAMC,kBAAkBC,oBAA+B,CAAC,EAAEC,KAAK,EAAE;IACpE,MAAMC,QAAQD,MAAM,KAAK;IACzB,MAAME,UAAU,WAAVA,GAAU,oBAACC,eAAaA;IAE9B,OAAO,WAAP,GACI,wDACI,oBAACC,oBAAkBA;QAAC,MAAMJ,MAAM,KAAK;QAAE,MAAMA,MAAM,IAAI;QAAE,UAAUA,MAAM,QAAQ;sBACjF,oBAACK,0BAAwBA;QAAC,MAAML,MAAM,WAAW;QAAE,UAAUA,MAAM,QAAQ;sBAC3E,oBAACM,eAAaA;QACV,aAAaN,MAAM,WAAW,IAAI;QAClC,eAAeE;QACf,mBAAmBP;QACnB,uBAAuBC;QACvB,QAAQC;QACR,OAAOI;QACP,UAAUA,CAAAA,QAASD,MAAM,QAAQ,CAACC;QAErCD,MAAM,IAAI,GAAG,WAAH,GAAG,oBAACO,mBAAiBA;QAAC,MAAMP,MAAM,IAAI;QAAE,UAAUA,MAAM,QAAQ;SAAO;AAG9F"}

package/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js CHANGED Viewed

@@ -7,7 +7,7 @@ const ObjectRenderer = createObjectFieldRenderer(({ field })=>/*#__PURE__*/ reac
         variant: "container"
     }, /*#__PURE__*/ react.createElement(Accordion.Item, {
         title: field.label,
-        defaultOpen: true,
+        defaultOpen: field.rendererSettings?.open ?? true,
         className: "pl-sm"
     }, /*#__PURE__*/ react.createElement(NestedLayout, {
         layout: field.layout

package/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js","sources":["../../../../../src/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { Accordion } from \"@webiny/admin-ui\";\nimport { createObjectFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { NestedLayout } from \"./ObjectFieldComponents.js\";\n\ndeclare module \"../../../../features/formModel/abstractions.js\" {\n interface IFieldRendererRegistry {\n objectAccordionSingle: {\n fieldType: \"object\";\n settings?: {\n open?: boolean;\n };\n };\n }\n}\n\nexport const ObjectRenderer = createObjectFieldRenderer<\"objectAccordionSingle\">(({ field }) => {\n return (\n <Accordion background={\"base\"} variant={\"container\"}>\n <Accordion.Item title={field.label} defaultOpen={true} className={\"pl-sm\"}>\n <NestedLayout layout={field.layout} />\n </Accordion.Item>\n </Accordion>\n );\n});\n"],"names":["ObjectRenderer","createObjectFieldRenderer","field","Accordion","NestedLayout"],"mappings":";;;;AAgBO,MAAMA,iBAAiBC,0BAAmD,CAAC,EAAEC,KAAK,EAAE,GAChF,WAAP,GACI,oBAACC,WAASA;QAAC,YAAY;QAAQ,SAAS;qBACpC,oBAACA,UAAU,IAAI;~~QAAC~~,OAAOD,MAAM,KAAK;~~QAAE~~,~~aAAa~~;~~QAAM~~,WAAW;~~qBAC9D~~,oBAACE,cAAYA;QAAC,QAAQF,MAAM,MAAM"}
1	+ {"version":3,"file":"base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.js","sources":["../../../../../src/base/Base/FieldRenderers/ObjectRenderer/ObjectRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { Accordion } from \"@webiny/admin-ui\";\nimport { createObjectFieldRenderer } from \"~/features/formModel/createFieldRenderer.js\";\nimport { NestedLayout } from \"./ObjectFieldComponents.js\";\n\ndeclare module \"../../../../features/formModel/abstractions.js\" {\n interface IFieldRendererRegistry {\n objectAccordionSingle: {\n fieldType: \"object\";\n settings?: {\n open?: boolean;\n };\n };\n }\n}\n\nexport const ObjectRenderer = createObjectFieldRenderer<\"objectAccordionSingle\">(({ field }) => {\n return (\n <Accordion background={\"base\"} variant={\"container\"}>\n <Accordion.Item\n title={field.label}\n defaultOpen={field.rendererSettings?.open ?? true}\n className={\"pl-sm\"}\n >\n <NestedLayout layout={field.layout} />\n </Accordion.Item>\n </Accordion>\n );\n});\n"],"names":["ObjectRenderer","createObjectFieldRenderer","field","Accordion","NestedLayout"],"mappings":";;;;AAgBO,MAAMA,iBAAiBC,0BAAmD,CAAC,EAAEC,KAAK,EAAE,GAChF,WAAP,GACI,oBAACC,WAASA;QAAC,YAAY;QAAQ,SAAS;qBACpC,oBAACA,UAAU,IAAI;QACX,OAAOD,MAAM,KAAK;QAClB,aAAaA,MAAM,gBAAgB,EAAE,QAAQ;QAC7C,WAAW;qBAEX,oBAACE,cAAYA;QAAC,QAAQF,MAAM,MAAM"}

package/base/Base.js CHANGED Viewed

@@ -6,7 +6,8 @@ import { UserMenu } from "./Base/UserMenu.js";
 import { LexicalPreset } from "./Base/LexicalPreset.js";
 import { DefaultFieldRenderers } from "./Base/DefaultFieldRenderers.js";
 import { DefaultLayoutRenderers } from "./Base/DefaultLayoutRenderers.js";
-const BaseExtension = ()=>/*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(Tenant, null), /*#__PURE__*/ react.createElement(Menus, null), /*#__PURE__*/ react.createElement(UserMenu, null), /*#__PURE__*/ react.createElement(RoutesConfig, null), /*#__PURE__*/ react.createElement(LexicalPreset, null), /*#__PURE__*/ react.createElement(DefaultFieldRenderers, null), /*#__PURE__*/ react.createElement(DefaultLayoutRenderers, null));
+import { DefaultLexicalEditorConfig } from "../components/LexicalEditor/DefaultLexicalEditorConfig.js";
+const BaseExtension = ()=>/*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(Tenant, null), /*#__PURE__*/ react.createElement(Menus, null), /*#__PURE__*/ react.createElement(UserMenu, null), /*#__PURE__*/ react.createElement(RoutesConfig, null), /*#__PURE__*/ react.createElement(LexicalPreset, null), /*#__PURE__*/ react.createElement(DefaultFieldRenderers, null), /*#__PURE__*/ react.createElement(DefaultLayoutRenderers, null), /*#__PURE__*/ react.createElement(DefaultLexicalEditorConfig, null));
 const Base = /*#__PURE__*/ memo(BaseExtension);
 export { Base };

package/base/Base.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"base/Base.js","sources":["../../src/base/Base.tsx"],"sourcesContent":["import React, { memo } from \"react\";\nimport { Menus } from \"./Base/Menus.js\";\nimport { RoutesConfig } from \"./Base/RoutesConfig.js\";\nimport { Tenant } from \"./Base/Tenant.js\";\nimport { UserMenu } from \"./Base/UserMenu.js\";\nimport { LexicalPreset } from \"./Base/LexicalPreset.js\";\nimport { DefaultFieldRenderers } from \"./Base/DefaultFieldRenderers.js\";\nimport { DefaultLayoutRenderers } from \"./Base/DefaultLayoutRenderers.js\";\n\nconst BaseExtension = () => {\n return (\n <>\n <Tenant />\n <Menus />\n <UserMenu />\n <RoutesConfig />\n <LexicalPreset />\n <DefaultFieldRenderers />\n <DefaultLayoutRenderers />\n </>\n );\n};\n\nexport const Base = memo(BaseExtension);\n"],"names":["BaseExtension","Tenant","Menus","UserMenu","RoutesConfig","LexicalPreset","DefaultFieldRenderers","DefaultLayoutRenderers","Base","memo"],"mappings":"~~;;;;;;;;AASA~~,MAAMA,gBAAgB,IACX,WAAP,GACI,wDACI,oBAACC,QAAMA,OAAAA,WAAAA,GACP,oBAACC,OAAKA,OAAAA,WAAAA,GACN,oBAACC,UAAQA,OAAAA,WAAAA,GACT,oBAACC,cAAYA,OAAAA,WAAAA,GACb,oBAACC,eAAaA,OAAAA,WAAAA,GACd,oBAACC,uBAAqBA,OAAAA,WAAAA,GACtB,oBAACC,wBAAsBA;~~AAK5B~~,MAAMC,OAAO,WAAHA,GAAGC,~~KAAKT~~"}
1	+ {"version":3,"file":"base/Base.js","sources":["../../src/base/Base.tsx"],"sourcesContent":["import React, { memo } from \"react\";\nimport { Menus } from \"./Base/Menus.js\";\nimport { RoutesConfig } from \"./Base/RoutesConfig.js\";\nimport { Tenant } from \"./Base/Tenant.js\";\nimport { UserMenu } from \"./Base/UserMenu.js\";\nimport { LexicalPreset } from \"./Base/LexicalPreset.js\";\nimport { DefaultFieldRenderers } from \"./Base/DefaultFieldRenderers.js\";\nimport { DefaultLayoutRenderers } from \"./Base/DefaultLayoutRenderers.js\";\nimport { DefaultLexicalEditorConfig } from \"~/components/LexicalEditor/DefaultLexicalEditorConfig.js\";\n\nconst BaseExtension = () => {\n return (\n <>\n <Tenant />\n <Menus />\n <UserMenu />\n <RoutesConfig />\n <LexicalPreset />\n <DefaultFieldRenderers />\n <DefaultLayoutRenderers />\n <DefaultLexicalEditorConfig />\n </>\n );\n};\n\nexport const Base = memo(BaseExtension);\n"],"names":["BaseExtension","Tenant","Menus","UserMenu","RoutesConfig","LexicalPreset","DefaultFieldRenderers","DefaultLayoutRenderers","DefaultLexicalEditorConfig","Base","memo"],"mappings":";;;;;;;;;AAUA,MAAMA,gBAAgB,IACX,WAAP,GACI,wDACI,oBAACC,QAAMA,OAAAA,WAAAA,GACP,oBAACC,OAAKA,OAAAA,WAAAA,GACN,oBAACC,UAAQA,OAAAA,WAAAA,GACT,oBAACC,cAAYA,OAAAA,WAAAA,GACb,oBAACC,eAAaA,OAAAA,WAAAA,GACd,oBAACC,uBAAqBA,OAAAA,WAAAA,GACtB,oBAACC,wBAAsBA,OAAAA,WAAAA,GACvB,oBAACC,4BAA0BA;AAKhC,MAAMC,OAAO,WAAHA,GAAGC,KAAKV"}

package/base/providers/UiProviders.js CHANGED Viewed

@@ -1,7 +1,8 @@
 import react from "react";
-import { SimpleLink, createProvider } from "@webiny/app";
+import { SimpleLink, createProvider, useContainer } from "@webiny/app";
 import { AdminUiProvider } from "@webiny/admin-ui";
 import { compiler } from "markdown-to-jsx/react";
+import { FileUrlFormatter } from "../../features/fileUrlFormatter/abstractions.js";
 const options = {
     overrides: {
         a: {
@@ -15,9 +16,12 @@ const options = {
 };
 const markdownCompiler = (markdown)=>compiler(markdown, options);
 const createUiProviders = ()=>createProvider((Component)=>function({ children }) {
+            const container = useContainer();
+            const fileUrlFormatter = container.resolve(FileUrlFormatter);
             return /*#__PURE__*/ react.createElement(AdminUiProvider, {
                 linkComponent: SimpleLink,
-                markdownCompiler: markdownCompiler
+                markdownCompiler: markdownCompiler,
+                fileUrlFormatter: fileUrlFormatter
             }, /*#__PURE__*/ react.createElement(Component, null, children));
         });
 export { createUiProviders };

package/base/providers/UiProviders.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"base/providers/UiProviders.js","sources":["../../../src/base/providers/UiProviders.tsx"],"sourcesContent":["import React from \"react\";\nimport { createProvider, SimpleLink } from \"@webiny/app\";\nimport { AdminUiProvider } from \"@webiny/admin-ui\";\nimport { compiler } from \"markdown-to-jsx/react\";\n\nconst options = {\n overrides: {\n a: {\n component: ({ children, ...props }: any) => (\n <a {...props} target=\"_blank\" rel=\"noopener noreferrer\">\n {children}\n </a>\n )\n }\n }\n};\n\nconst markdownCompiler = (markdown: string) => {\n return compiler(markdown, options);\n};\n\ninterface UiProvidersProps {\n children: React.ReactNode;\n}\n\nexport const createUiProviders = () => {\n return createProvider(Component => {\n return function UiProviders({ children }: UiProvidersProps) {\n return (\n <AdminUiProvider linkComponent={SimpleLink} markdownCompiler={markdownCompiler}>\n <Component>{children}</Component>\n </AdminUiProvider>\n );\n };\n });\n};\n"],"names":["options","children","props","markdownCompiler","markdown","compiler","createUiProviders","createProvider","Component","AdminUiProvider","SimpleLink"],"mappings":"~~;;;;AAKA~~,MAAMA,UAAU;IACZ,WAAW;QACP,GAAG;YACC,WAAW,CAAC,EAAEC,QAAQ,EAAE,GAAGC,OAAY,iBACnC,oBAAC;oBAAG,GAAGA,KAAK;oBAAE,QAAO;oBAAS,KAAI;mBAC7BD;QAGb;IACJ;AACJ;AAEA,MAAME,mBAAmB,CAACC,WACfC,SAASD,UAAUJ;AAOvB,MAAMM,oBAAoB,IACtBC,eAAeC,CAAAA,YACX,SAAqB,EAAEP,QAAQ,EAAoB;YACtD,OAAO,WAAP,GACI,~~oBAACQ~~,iBAAeA;~~gBAAC~~,eAAeC;~~gBAAY~~,~~kBAAkBP~~;~~6BAC1D~~,~~oBAACK~~,WAAAA,MAAWP;QAGxB"}
1	+ {"version":3,"file":"base/providers/UiProviders.js","sources":["../../../src/base/providers/UiProviders.tsx"],"sourcesContent":["import React from \"react\";\nimport { createProvider, SimpleLink, useContainer } from \"@webiny/app\";\nimport { AdminUiProvider } from \"@webiny/admin-ui\";\nimport { compiler } from \"markdown-to-jsx/react\";\nimport { FileUrlFormatter } from \"~/features/fileUrlFormatter/abstractions.js\";\n\nconst options = {\n overrides: {\n a: {\n component: ({ children, ...props }: any) => (\n <a {...props} target=\"_blank\" rel=\"noopener noreferrer\">\n {children}\n </a>\n )\n }\n }\n};\n\nconst markdownCompiler = (markdown: string) => {\n return compiler(markdown, options);\n};\n\ninterface UiProvidersProps {\n children: React.ReactNode;\n}\n\nexport const createUiProviders = () => {\n return createProvider(Component => {\n return function UiProviders({ children }: UiProvidersProps) {\n const container = useContainer();\n const fileUrlFormatter = container.resolve(FileUrlFormatter);\n\n return (\n <AdminUiProvider\n linkComponent={SimpleLink}\n markdownCompiler={markdownCompiler}\n fileUrlFormatter={fileUrlFormatter}\n >\n <Component>{children}</Component>\n </AdminUiProvider>\n );\n };\n });\n};\n"],"names":["options","children","props","markdownCompiler","markdown","compiler","createUiProviders","createProvider","Component","container","useContainer","fileUrlFormatter","FileUrlFormatter","AdminUiProvider","SimpleLink"],"mappings":";;;;;AAMA,MAAMA,UAAU;IACZ,WAAW;QACP,GAAG;YACC,WAAW,CAAC,EAAEC,QAAQ,EAAE,GAAGC,OAAY,iBACnC,oBAAC;oBAAG,GAAGA,KAAK;oBAAE,QAAO;oBAAS,KAAI;mBAC7BD;QAGb;IACJ;AACJ;AAEA,MAAME,mBAAmB,CAACC,WACfC,SAASD,UAAUJ;AAOvB,MAAMM,oBAAoB,IACtBC,eAAeC,CAAAA,YACX,SAAqB,EAAEP,QAAQ,EAAoB;YACtD,MAAMQ,YAAYC;YAClB,MAAMC,mBAAmBF,UAAU,OAAO,CAACG;YAE3C,OAAO,WAAP,GACI,oBAACC,iBAAeA;gBACZ,eAAeC;gBACf,kBAAkBX;gBAClB,kBAAkBQ;6BAElB,oBAACH,WAAAA,MAAWP;QAGxB"}

package/base/ui/FileManager.d.ts CHANGED Viewed

@@ -51,24 +51,25 @@ export type FileManagerProps = {
 } & MultipleProps;
 type DistributiveOmit<T, K extends keyof T> = T extends unknown ? Omit<T, K> : never;
 export type FileManagerRendererProps = DistributiveOmit<FileManagerProps, "render">;
-export declare const FileManagerRenderer: ((props: FileManagerRendererProps) => React.JSX.Element | null) & {
-    original: (props: FileManagerRendererProps) => React.JSX.Element | null;
-    originalName: string;
-    displayName: string;
-} & {
-    original: ((props: FileManagerRendererProps) => React.JSX.Element | null) & {
+export declare const FileManager: (({ render, onChange, ...rest }: FileManagerProps) => React.JSX.Element) & {
+    Renderer: ((props: FileManagerRendererProps) => React.JSX.Element | null) & {
         original: (props: FileManagerRendererProps) => React.JSX.Element | null;
         originalName: string;
         displayName: string;
-    };
-    originalName: string;
-    displayName: string;
-} & {
-    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: FileManagerRendererProps) => React.JSX.Element | null) & {
-        original: (props: FileManagerRendererProps) => React.JSX.Element | null;
+    } & {
+        original: ((props: FileManagerRendererProps) => React.JSX.Element | null) & {
+            original: (props: FileManagerRendererProps) => React.JSX.Element | null;
+            originalName: string;
+            displayName: string;
+        };
         originalName: string;
         displayName: string;
-    }>) => (props: unknown) => React.JSX.Element;
+    } & {
+        createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: FileManagerRendererProps) => React.JSX.Element | null) & {
+            original: (props: FileManagerRendererProps) => React.JSX.Element | null;
+            originalName: string;
+            displayName: string;
+        }>) => (props: unknown) => React.JSX.Element;
+    };
 };
-export declare const FileManager: ({ render, onChange, ...rest }: FileManagerProps) => React.JSX.Element;
 export {};

package/base/ui/FileManager.js CHANGED Viewed

@@ -2,7 +2,7 @@ import react, { useCallback, useEffect, useRef, useState } from "react";
 import { Portal } from "@webiny/admin-ui";
 import { createVoidComponent, makeDecoratable } from "@webiny/react-composition";
 const FileManagerRenderer = makeDecoratable("FileManagerRenderer", createVoidComponent());
-const FileManager = ({ render, onChange, ...rest })=>{
+const BaseFileManager = ({ render, onChange, ...rest })=>{
     const [isFileManagerVisible, setFileManagerVisible] = useState(rest.show);
     const onChangeRef = useRef(onChange);
     useEffect(()=>{
@@ -39,6 +39,9 @@ const FileManager = ({ render, onChange, ...rest })=>{
     };
     return /*#__PURE__*/ react.createElement(react.Fragment, null, renderFileManager(), renderContent());
 };
-export { FileManager, FileManagerRenderer };
+const FileManager = Object.assign(BaseFileManager, {
+    Renderer: FileManagerRenderer
+});
+export { FileManager };
 //# sourceMappingURL=FileManager.js.map

package/base/ui/FileManager.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"base/ui/FileManager.js","sources":["../../../src/base/ui/FileManager.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport { Portal } from \"@webiny/admin-ui\";\nimport { createVoidComponent, makeDecoratable } from \"@webiny/react-composition\";\n\nexport interface FileManagerOnChange<T> {\n (value: T): void;\n}\n\n/*\n Represents a file object managed by the File Manager.\n /\nexport interface FileManagerFileItem {\n // Required - every DAM must provide these\n id: string;\n src: string;\n name: string;\n type: string; // MIME type\n size: number; // bytes\n // Required for images (apps depend on these for Next.js Image, etc.)\n width?: number;\n height?: number;\n // DAM-specific metadata\n [key: string]: any;\n}\n\nexport type FileManagerRenderPropParams<TValue> = {\n showFileManager: (onChange?: FileManagerOnChange<TValue>) => void;\n};\n\ninterface SingleFileRenderProp {\n (params: FileManagerRenderPropParams<FileManagerFileItem>): React.ReactNode;\n}\n\ninterface MultiFileRenderProp {\n (params: FileManagerRenderPropParams<FileManagerFileItem[]>): React.ReactNode;\n}\n\nexport type MultipleProps =\n \| {\n multiple?: never;\n multipleMaxCount?: never;\n multipleMaxSize?: never;\n onChange?: FileManagerOnChange<FileManagerFileItem>;\n render?: SingleFileRenderProp;\n }\n \| {\n multiple: true;\n multipleMaxCount?: number;\n multipleMaxSize?: number \| string;\n onChange?: FileManagerOnChange<FileManagerFileItem[]>;\n render?: MultiFileRenderProp;\n };\n\nexport type FileManagerProps = {\n accept?: string[];\n images?: boolean;\n maxSize?: number \| string;\n onClose?: () => void;\n onUploadCompletion?: (files: FileManagerFileItem[]) => void;\n own?: boolean;\n scope?: string;\n tags?: string[];\n show?: boolean;\n overlay?: boolean;\n} & MultipleProps;\n\n// This jewel was taken from https://davidgomes.com/pick-omit-over-union-types-in-typescript/. Massive thanks, David!\ntype DistributiveOmit<T, K extends keyof T> = T extends unknown ? Omit<T, K> : never;\n\nexport type FileManagerRendererProps = DistributiveOmit<FileManagerProps, \"render\">;\n\~~nexport~~ ~~const~~ FileManagerRenderer = makeDecoratable(\n \"FileManagerRenderer\",\n createVoidComponent<FileManagerRendererProps>()\n);\n\ntype ShowFileManagerProps =\n \| FileManagerOnChange<FileManagerFileItem>\n \| FileManagerOnChange<FileManagerFileItem[]>\n \| undefined;\n\~~nexport~~ ~~const~~ ~~FileManager~~ = ({ render, onChange, ...rest }: FileManagerProps) => {\n const [isFileManagerVisible, setFileManagerVisible] = useState(rest.show);\n const onChangeRef = useRef(onChange);\n\n useEffect(() => {\n onChangeRef.current = onChange;\n }, [onChange]);\n\n const handleShowFileManager = useCallback((newOnChange: ShowFileManagerProps) => {\n if (typeof newOnChange === \"function\") {\n onChangeRef.current = newOnChange;\n }\n setFileManagerVisible(true);\n }, []);\n\n const handleCloseFileManager = useCallback(() => {\n setFileManagerVisible(false);\n }, []);\n\n const renderFileManager = () => {\n if (!isFileManagerVisible) {\n return null;\n }\n\n // Render as overlay\n if (rest.overlay) {\n return (\n <Portal>\n {/@ts-expect-error*/}\n <FileManagerRenderer\n onClose={handleCloseFileManager}\n onChange={onChangeRef.current}\n {...rest}\n />\n </Portal>\n );\n }\n\n // Render inline\n return (\n // @ts-expect-error\n <FileManagerRenderer\n onClose={handleCloseFileManager}\n onChange={onChangeRef.current}\n {...rest}\n />\n );\n };\n\n const renderContent = () => {\n const renderProps = { showFileManager: handleShowFileManager };\n\n if (render) {\n return render(renderProps);\n }\n\n return null;\n };\n\n return (\n <>\n {renderFileManager()}\n {renderContent()}\n </>\n );\n};\n"],"names":["FileManagerRenderer","makeDecoratable","createVoidComponent","~~FileManager~~","render","onChange","rest","isFileManagerVisible","setFileManagerVisible","useState","onChangeRef","useRef","useEffect","handleShowFileManager","useCallback","newOnChange","handleCloseFileManager","renderFileManager","Portal","renderContent","renderProps"],"mappings":";;;~~AAuEO~~,MAAMA,sBAAsBC,~~gBAC/B~~,uBACAC;~~AAQG~~,MAAMC,~~cAAc~~,CAAC,EAAEC,MAAM,EAAEC,QAAQ,EAAE,GAAGC,MAAwB;~~IACvE~~,MAAM,CAACC,sBAAsBC,sBAAsB,GAAGC,SAASH,KAAK,IAAI;IACxE,MAAMI,cAAcC,OAAON;IAE3BO,UAAU;QACNF,YAAY,OAAO,GAAGL;IAC1B,GAAG;QAACA;KAAS;IAEb,MAAMQ,wBAAwBC,YAAY,CAACC;QACvC,IAAI,AAAuB,cAAvB,OAAOA,aACPL,YAAY,OAAO,GAAGK;QAE1BP,sBAAsB;IAC1B,GAAG,EAAE;IAEL,MAAMQ,yBAAyBF,YAAY;QACvCN,sBAAsB;IAC1B,GAAG,EAAE;IAEL,MAAMS,oBAAoB;QACtB,IAAI,CAACV,sBACD,OAAO;QAIX,IAAID,KAAK,OAAO,EACZ,OAAO,WAAP,GACI,oBAACY,QAAMA,MAAAA,WAAAA,GAEH,oBAAClB,qBAAmBA;YAChB,SAASgB;YACT,UAAUN,YAAY,OAAO;YAC5B,GAAGJ,IAAI;;QAOxB,O,cAEI,oBAACN,qBAAmBA;YAChB,SAASgB;YACT,UAAUN,YAAY,OAAO;YAC5B,GAAGJ,IAAI;;IAGpB;IAEA,MAAMa,gBAAgB;QAClB,MAAMC,cAAc;YAAE,iBAAiBP;QAAsB;QAE7D,IAAIT,QACA,OAAOA,OAAOgB;QAGlB,OAAO;IACX;IAEA,OAAO,WAAP,GACI,0CACKH,qBACAE;AAGb"}
1	+ {"version":3,"file":"base/ui/FileManager.js","sources":["../../../src/base/ui/FileManager.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport { Portal } from \"@webiny/admin-ui\";\nimport { createVoidComponent, makeDecoratable } from \"@webiny/react-composition\";\n\nexport interface FileManagerOnChange<T> {\n (value: T): void;\n}\n\n/*\n Represents a file object managed by the File Manager.\n /\nexport interface FileManagerFileItem {\n // Required - every DAM must provide these\n id: string;\n src: string;\n name: string;\n type: string; // MIME type\n size: number; // bytes\n // Required for images (apps depend on these for Next.js Image, etc.)\n width?: number;\n height?: number;\n // DAM-specific metadata\n [key: string]: any;\n}\n\nexport type FileManagerRenderPropParams<TValue> = {\n showFileManager: (onChange?: FileManagerOnChange<TValue>) => void;\n};\n\ninterface SingleFileRenderProp {\n (params: FileManagerRenderPropParams<FileManagerFileItem>): React.ReactNode;\n}\n\ninterface MultiFileRenderProp {\n (params: FileManagerRenderPropParams<FileManagerFileItem[]>): React.ReactNode;\n}\n\nexport type MultipleProps =\n \| {\n multiple?: never;\n multipleMaxCount?: never;\n multipleMaxSize?: never;\n onChange?: FileManagerOnChange<FileManagerFileItem>;\n render?: SingleFileRenderProp;\n }\n \| {\n multiple: true;\n multipleMaxCount?: number;\n multipleMaxSize?: number \| string;\n onChange?: FileManagerOnChange<FileManagerFileItem[]>;\n render?: MultiFileRenderProp;\n };\n\nexport type FileManagerProps = {\n accept?: string[];\n images?: boolean;\n maxSize?: number \| string;\n onClose?: () => void;\n onUploadCompletion?: (files: FileManagerFileItem[]) => void;\n own?: boolean;\n scope?: string;\n tags?: string[];\n show?: boolean;\n overlay?: boolean;\n} & MultipleProps;\n\n// This jewel was taken from https://davidgomes.com/pick-omit-over-union-types-in-typescript/. Massive thanks, David!\ntype DistributiveOmit<T, K extends keyof T> = T extends unknown ? Omit<T, K> : never;\n\nexport type FileManagerRendererProps = DistributiveOmit<FileManagerProps, \"render\">;\n\nconst FileManagerRenderer = makeDecoratable(\n \"FileManagerRenderer\",\n createVoidComponent<FileManagerRendererProps>()\n);\n\ntype ShowFileManagerProps =\n \| FileManagerOnChange<FileManagerFileItem>\n \| FileManagerOnChange<FileManagerFileItem[]>\n \| undefined;\n\nconst BaseFileManager = ({ render, onChange, ...rest }: FileManagerProps) => {\n const [isFileManagerVisible, setFileManagerVisible] = useState(rest.show);\n const onChangeRef = useRef(onChange);\n\n useEffect(() => {\n onChangeRef.current = onChange;\n }, [onChange]);\n\n const handleShowFileManager = useCallback((newOnChange: ShowFileManagerProps) => {\n if (typeof newOnChange === \"function\") {\n onChangeRef.current = newOnChange;\n }\n setFileManagerVisible(true);\n }, []);\n\n const handleCloseFileManager = useCallback(() => {\n setFileManagerVisible(false);\n }, []);\n\n const renderFileManager = () => {\n if (!isFileManagerVisible) {\n return null;\n }\n\n // Render as overlay\n if (rest.overlay) {\n return (\n <Portal>\n {/@ts-expect-error*/}\n <FileManagerRenderer\n onClose={handleCloseFileManager}\n onChange={onChangeRef.current}\n {...rest}\n />\n </Portal>\n );\n }\n\n // Render inline\n return (\n // @ts-expect-error\n <FileManagerRenderer\n onClose={handleCloseFileManager}\n onChange={onChangeRef.current}\n {...rest}\n />\n );\n };\n\n const renderContent = () => {\n const renderProps = { showFileManager: handleShowFileManager };\n\n if (render) {\n return render(renderProps);\n }\n\n return null;\n };\n\n return (\n <>\n {renderFileManager()}\n {renderContent()}\n </>\n );\n};\n\nexport const FileManager = Object.assign(BaseFileManager, { Renderer: FileManagerRenderer });\n"],"names":["FileManagerRenderer","makeDecoratable","createVoidComponent","BaseFileManager","render","onChange","rest","isFileManagerVisible","setFileManagerVisible","useState","onChangeRef","useRef","useEffect","handleShowFileManager","useCallback","newOnChange","handleCloseFileManager","renderFileManager","Portal","renderContent","renderProps","FileManager","Object"],"mappings":";;;AAuEA,MAAMA,sBAAsBC,gBACxB,uBACAC;AAQJ,MAAMC,kBAAkB,CAAC,EAAEC,MAAM,EAAEC,QAAQ,EAAE,GAAGC,MAAwB;IACpE,MAAM,CAACC,sBAAsBC,sBAAsB,GAAGC,SAASH,KAAK,IAAI;IACxE,MAAMI,cAAcC,OAAON;IAE3BO,UAAU;QACNF,YAAY,OAAO,GAAGL;IAC1B,GAAG;QAACA;KAAS;IAEb,MAAMQ,wBAAwBC,YAAY,CAACC;QACvC,IAAI,AAAuB,cAAvB,OAAOA,aACPL,YAAY,OAAO,GAAGK;QAE1BP,sBAAsB;IAC1B,GAAG,EAAE;IAEL,MAAMQ,yBAAyBF,YAAY;QACvCN,sBAAsB;IAC1B,GAAG,EAAE;IAEL,MAAMS,oBAAoB;QACtB,IAAI,CAACV,sBACD,OAAO;QAIX,IAAID,KAAK,OAAO,EACZ,OAAO,WAAP,GACI,oBAACY,QAAMA,MAAAA,WAAAA,GAEH,oBAAClB,qBAAmBA;YAChB,SAASgB;YACT,UAAUN,YAAY,OAAO;YAC5B,GAAGJ,IAAI;;QAOxB,O,cAEI,oBAACN,qBAAmBA;YAChB,SAASgB;YACT,UAAUN,YAAY,OAAO;YAC5B,GAAGJ,IAAI;;IAGpB;IAEA,MAAMa,gBAAgB;QAClB,MAAMC,cAAc;YAAE,iBAAiBP;QAAsB;QAE7D,IAAIT,QACA,OAAOA,OAAOgB;QAGlB,OAAO;IACX;IAEA,OAAO,WAAP,GACI,0CACKH,qBACAE;AAGb;AAEO,MAAME,cAAcC,OAAO,MAAM,CAACnB,iBAAiB;IAAE,UAAUH;AAAoB"}

package/components/LexicalEditor/DefaultLexicalEditorConfig.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import React from "react";
2	+ export declare const DefaultLexicalEditorConfig: () => React.JSX.Element;

package/components/LexicalEditor/DefaultLexicalEditorConfig.js ADDED Viewed

@@ -0,0 +1,81 @@
+import react from "react";
+import { BoldAction, BulletListAction, CodeHighlightAction, CodeHighlightPlugin, Divider, FontColorAction, FontColorPlugin, ImageAction, ImagesPlugin, ItalicAction, LexicalEditorConfig, LinkAction, LinkPlugin, ListPlugin, NumberedListAction, QuoteAction, QuotePlugin, TextAlignmentAction, TypographyAction, TypographyPlugin, UnderlineAction } from "@webiny/lexical-editor";
+import { TypographyDropDown } from "./TypographyDropDown.js";
+const { ToolbarElement: ToolbarElement, Plugin: Plugin } = LexicalEditorConfig;
+const DefaultLexicalEditorConfig = ()=>/*#__PURE__*/ react.createElement(LexicalEditorConfig, {
+        priority: "primary"
+    }, /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "fontColor",
+        element: /*#__PURE__*/ react.createElement(FontColorAction, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "typography",
+        element: /*#__PURE__*/ react.createElement(TypographyAction, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "textAlignment",
+        element: /*#__PURE__*/ react.createElement(TextAlignmentAction, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "divider1",
+        element: /*#__PURE__*/ react.createElement(Divider, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "boldAction",
+        element: /*#__PURE__*/ react.createElement(BoldAction, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "italic",
+        element: /*#__PURE__*/ react.createElement(ItalicAction, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "underline",
+        element: /*#__PURE__*/ react.createElement(UnderlineAction, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "codeHighlight",
+        element: /*#__PURE__*/ react.createElement(CodeHighlightAction, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "divider2",
+        element: /*#__PURE__*/ react.createElement(Divider, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "numberedList",
+        element: /*#__PURE__*/ react.createElement(NumberedListAction, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "bulletList",
+        element: /*#__PURE__*/ react.createElement(BulletListAction, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "divider",
+        element: /*#__PURE__*/ react.createElement(Divider, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "image",
+        element: /*#__PURE__*/ react.createElement(ImageAction, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "divider3",
+        element: /*#__PURE__*/ react.createElement(Divider, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "link",
+        element: /*#__PURE__*/ react.createElement(LinkAction, null)
+    }), /*#__PURE__*/ react.createElement(ToolbarElement, {
+        name: "quote",
+        element: /*#__PURE__*/ react.createElement(QuoteAction, null)
+    }), /*#__PURE__*/ react.createElement(Plugin, {
+        name: "fontColor",
+        element: /*#__PURE__*/ react.createElement(FontColorPlugin, null)
+    }), /*#__PURE__*/ react.createElement(Plugin, {
+        name: "list",
+        element: /*#__PURE__*/ react.createElement(ListPlugin, null)
+    }), /*#__PURE__*/ react.createElement(Plugin, {
+        name: "codeHighlight",
+        element: /*#__PURE__*/ react.createElement(CodeHighlightPlugin, null)
+    }), /*#__PURE__*/ react.createElement(Plugin, {
+        name: "typography",
+        element: /*#__PURE__*/ react.createElement(TypographyPlugin, null)
+    }), /*#__PURE__*/ react.createElement(Plugin, {
+        name: "link",
+        element: /*#__PURE__*/ react.createElement(LinkPlugin, null)
+    }), /*#__PURE__*/ react.createElement(Plugin, {
+        name: "images",
+        element: /*#__PURE__*/ react.createElement(ImagesPlugin, null)
+    }), /*#__PURE__*/ react.createElement(Plugin, {
+        name: "quote",
+        element: /*#__PURE__*/ react.createElement(QuotePlugin, null)
+    }), /*#__PURE__*/ react.createElement(TypographyAction.TypographyDropDown, {
+        element: /*#__PURE__*/ react.createElement(TypographyDropDown, null)
+    }));
+export { DefaultLexicalEditorConfig };
+//# sourceMappingURL=DefaultLexicalEditorConfig.js.map

package/components/LexicalEditor/DefaultLexicalEditorConfig.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"components/LexicalEditor/DefaultLexicalEditorConfig.js","sources":["../../../src/components/LexicalEditor/DefaultLexicalEditorConfig.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n TypographyAction,\n LexicalEditorConfig,\n FontColorAction,\n Divider,\n BoldAction,\n ItalicAction,\n UnderlineAction,\n CodeHighlightAction,\n NumberedListAction,\n BulletListAction,\n ImageAction,\n LinkAction,\n QuoteAction,\n ImagesPlugin,\n QuotePlugin,\n CodeHighlightPlugin,\n LinkPlugin,\n ListPlugin,\n TypographyPlugin,\n FontColorPlugin,\n TextAlignmentAction\n} from \"@webiny/lexical-editor\";\nimport { TypographyDropDown } from \"./TypographyDropDown.js\";\n\nconst { ToolbarElement, Plugin } = LexicalEditorConfig;\n\nexport const DefaultLexicalEditorConfig = () => {\n return (\n <LexicalEditorConfig priority={\"primary\"}>\n <ToolbarElement name=\"fontColor\" element={<FontColorAction />} />\n <ToolbarElement name=\"typography\" element={<TypographyAction />} />\n <ToolbarElement name=\"textAlignment\" element={<TextAlignmentAction />} />\n <ToolbarElement name=\"divider1\" element={<Divider />} />\n <ToolbarElement name=\"boldAction\" element={<BoldAction />} />\n <ToolbarElement name=\"italic\" element={<ItalicAction />} />\n <ToolbarElement name=\"underline\" element={<UnderlineAction />} />\n <ToolbarElement name=\"codeHighlight\" element={<CodeHighlightAction />} />\n <ToolbarElement name=\"divider2\" element={<Divider />} />\n <ToolbarElement name=\"numberedList\" element={<NumberedListAction />} />\n <ToolbarElement name=\"bulletList\" element={<BulletListAction />} />\n <ToolbarElement name=\"divider\" element={<Divider />} />\n <ToolbarElement name=\"image\" element={<ImageAction />} />\n <ToolbarElement name=\"divider3\" element={<Divider />} />\n <ToolbarElement name=\"link\" element={<LinkAction />} />\n <ToolbarElement name=\"quote\" element={<QuoteAction />} />\n <Plugin name={\"fontColor\"} element={<FontColorPlugin />} />\n <Plugin name={\"list\"} element={<ListPlugin />} />\n <Plugin name={\"codeHighlight\"} element={<CodeHighlightPlugin />} />\n <Plugin name={\"typography\"} element={<TypographyPlugin />} />\n <Plugin name={\"link\"} element={<LinkPlugin />} />\n <Plugin name={\"images\"} element={<ImagesPlugin />} />\n <Plugin name={\"quote\"} element={<QuotePlugin />} />\n <TypographyAction.TypographyDropDown element={<TypographyDropDown />} />\n </LexicalEditorConfig>\n );\n};\n"],"names":["ToolbarElement","Plugin","LexicalEditorConfig","DefaultLexicalEditorConfig","FontColorAction","TypographyAction","TextAlignmentAction","Divider","BoldAction","ItalicAction","UnderlineAction","CodeHighlightAction","NumberedListAction","BulletListAction","ImageAction","LinkAction","QuoteAction","FontColorPlugin","ListPlugin","CodeHighlightPlugin","TypographyPlugin","LinkPlugin","ImagesPlugin","QuotePlugin","TypographyDropDown"],"mappings":";;;AA0BA,MAAM,EAAEA,gBAAAA,cAAc,EAAEC,QAAAA,MAAM,EAAE,GAAGC;AAE5B,MAAMC,6BAA6B,IAC/B,WAAP,GACI,oBAACD,qBAAmBA;QAAC,UAAU;qBAC3B,oBAACF,gBAAcA;QAAC,MAAK;QAAY,uBAAS,oBAACI,iBAAeA;sBAC1D,oBAACJ,gBAAcA;QAAC,MAAK;QAAa,uBAAS,oBAACK,kBAAgBA;sBAC5D,oBAACL,gBAAcA;QAAC,MAAK;QAAgB,uBAAS,oBAACM,qBAAmBA;sBAClE,oBAACN,gBAAcA;QAAC,MAAK;QAAW,uBAAS,oBAACO,SAAOA;sBACjD,oBAACP,gBAAcA;QAAC,MAAK;QAAa,uBAAS,oBAACQ,YAAUA;sBACtD,oBAACR,gBAAcA;QAAC,MAAK;QAAS,uBAAS,oBAACS,cAAYA;sBACpD,oBAACT,gBAAcA;QAAC,MAAK;QAAY,uBAAS,oBAACU,iBAAeA;sBAC1D,oBAACV,gBAAcA;QAAC,MAAK;QAAgB,uBAAS,oBAACW,qBAAmBA;sBAClE,oBAACX,gBAAcA;QAAC,MAAK;QAAW,uBAAS,oBAACO,SAAOA;sBACjD,oBAACP,gBAAcA;QAAC,MAAK;QAAe,uBAAS,oBAACY,oBAAkBA;sBAChE,oBAACZ,gBAAcA;QAAC,MAAK;QAAa,uBAAS,oBAACa,kBAAgBA;sBAC5D,oBAACb,gBAAcA;QAAC,MAAK;QAAU,uBAAS,oBAACO,SAAOA;sBAChD,oBAACP,gBAAcA;QAAC,MAAK;QAAQ,uBAAS,oBAACc,aAAWA;sBAClD,oBAACd,gBAAcA;QAAC,MAAK;QAAW,uBAAS,oBAACO,SAAOA;sBACjD,oBAACP,gBAAcA;QAAC,MAAK;QAAO,uBAAS,oBAACe,YAAUA;sBAChD,oBAACf,gBAAcA;QAAC,MAAK;QAAQ,uBAAS,oBAACgB,aAAWA;sBAClD,oBAACf,QAAMA;QAAC,MAAM;QAAa,uBAAS,oBAACgB,iBAAeA;sBACpD,oBAAChB,QAAMA;QAAC,MAAM;QAAQ,uBAAS,oBAACiB,YAAUA;sBAC1C,oBAACjB,QAAMA;QAAC,MAAM;QAAiB,uBAAS,oBAACkB,qBAAmBA;sBAC5D,oBAAClB,QAAMA;QAAC,MAAM;QAAc,uBAAS,oBAACmB,kBAAgBA;sBACtD,oBAACnB,QAAMA;QAAC,MAAM;QAAQ,uBAAS,oBAACoB,YAAUA;sBAC1C,oBAACpB,QAAMA;QAAC,MAAM;QAAU,uBAAS,oBAACqB,cAAYA;sBAC9C,oBAACrB,QAAMA;QAAC,MAAM;QAAS,uBAAS,oBAACsB,aAAWA;sBAC5C,oBAAClB,iBAAiB,kBAAkB;QAAC,uBAAS,oBAACmB,oBAAkBA"}

package/components/LexicalEditor/TypographyDropDown.d.ts ADDED Viewed

@@ -0,0 +1,8 @@
+import React from "react";
+export type TypographyStyle = {
+    id: string;
+    label: string;
+    tag: string;
+    className: string;
+};
+export declare const TypographyDropDown: () => React.JSX.Element;

package/components/LexicalEditor/TypographyDropDown.js ADDED Viewed

@@ -0,0 +1,60 @@
+import react, { useEffect, useState } from "react";
+import { $getNearestNodeOfType } from "@lexical/utils";
+import { DropDown, DropDownItem, useCurrentElement, useCurrentSelection, useTypographyAction } from "@webiny/lexical-editor";
+import { $isHeadingNode, $isListNode, $isParagraphNode, $isQuoteNode, ListNode } from "@webiny/lexical-nodes";
+import { useAdminConfig } from "../../config/AdminConfig.js";
+const TypographyDropDown = ()=>{
+    const { value, applyTypography } = useTypographyAction();
+    const { lexicalTheme } = useAdminConfig();
+    const [styles, setStyles] = useState([]);
+    const { element } = useCurrentElement();
+    const { rangeSelection } = useCurrentSelection();
+    const getAllTextStyles = ()=>{
+        const headingsStyles = lexicalTheme.typography.headings || [];
+        const paragraphStyles = lexicalTheme.typography.paragraphs || [];
+        return [
+            ...headingsStyles,
+            ...paragraphStyles
+        ];
+    };
+    const getListStyles = (tag)=>{
+        const listStyles = lexicalTheme.typography.lists?.filter((x)=>x.tag === tag) || [];
+        if (listStyles.length > 0) return listStyles;
+        const fallbackTag = "ul" === tag ? "ol" : "ul";
+        return lexicalTheme.typography.lists?.filter((x)=>x.tag === fallbackTag) || [];
+    };
+    useEffect(()=>{
+        if (!element || !rangeSelection) return;
+        if ($isParagraphNode(element) || $isHeadingNode(element)) setStyles(getAllTextStyles());
+        else if ($isListNode(element)) {
+            let type;
+            try {
+                const anchorNode = rangeSelection.anchor.getNode();
+                const parentList = $getNearestNodeOfType(anchorNode, ListNode);
+                if (parentList) type = parentList.getListType();
+            } catch  {
+                type = element.getListType();
+            }
+            "bullet" === type ? setStyles(getListStyles("ul")) : setStyles(getListStyles("ol"));
+        } else $isQuoteNode(element) ? setStyles(lexicalTheme.typography.quotes || []) : setStyles([]);
+    }, [
+        element
+    ]);
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, styles?.length ? /*#__PURE__*/ react.createElement(DropDown, {
+        buttonClassName: "toolbar-item typography-dropdown",
+        buttonAriaLabel: "Typography formatting options",
+        buttonLabel: value?.label || "Typography",
+        stopCloseOnClickSelf: true,
+        disabled: false,
+        showScroll: true
+    }, styles?.map((option)=>/*#__PURE__*/ react.createElement(DropDownItem, {
+            className: `item typography-item ${value?.id === option.id ? "active dropdown-item-active" : ""}`,
+            onClick: ()=>applyTypography(option),
+            key: option.id
+        }, /*#__PURE__*/ react.createElement("span", {
+            className: "text"
+        }, option.label)))) : null);
+};
+export { TypographyDropDown };
+//# sourceMappingURL=TypographyDropDown.js.map

package/components/LexicalEditor/TypographyDropDown.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"components/LexicalEditor/TypographyDropDown.js","sources":["../../../src/components/LexicalEditor/TypographyDropDown.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { $getNearestNodeOfType } from \"@lexical/utils\";\nimport {\n DropDown,\n DropDownItem,\n useCurrentSelection,\n useCurrentElement,\n useTypographyAction\n} from \"@webiny/lexical-editor\";\nimport {\n $isHeadingNode,\n $isParagraphNode,\n $isQuoteNode,\n $isListNode,\n ListNode\n} from \"@webiny/lexical-nodes\";\nimport { useAdminConfig } from \"~/config/AdminConfig.js\";\n\nexport type TypographyStyle = {\n id: string;\n label: string;\n tag: string;\n className: string;\n};\n\nexport const TypographyDropDown = () => {\n const { value, applyTypography } = useTypographyAction();\n const { lexicalTheme } = useAdminConfig();\n\n const [styles, setStyles] = useState<TypographyStyle[]>([]);\n const { element } = useCurrentElement();\n const { rangeSelection } = useCurrentSelection();\n\n const getAllTextStyles = (): TypographyStyle[] => {\n const headingsStyles = lexicalTheme.typography.headings || [];\n const paragraphStyles = lexicalTheme.typography.paragraphs || [];\n\n return [...headingsStyles, ...paragraphStyles];\n };\n\n const getListStyles = (tag: string): TypographyStyle[] => {\n const listStyles = lexicalTheme.typography.lists?.filter(x => x.tag === tag) || [];\n if (listStyles.length > 0) {\n return listStyles;\n }\n\n const fallbackTag = tag === \"ul\" ? \"ol\" : \"ul\";\n return lexicalTheme.typography.lists?.filter(x => x.tag === fallbackTag) || [];\n };\n\n useEffect(() => {\n if (!element || !rangeSelection) {\n return;\n }\n\n if ($isParagraphNode(element) || $isHeadingNode(element)) {\n setStyles(getAllTextStyles());\n } else if ($isListNode(element)) {\n let type;\n try {\n const anchorNode = rangeSelection.anchor.getNode();\n const parentList = $getNearestNodeOfType<ListNode>(anchorNode, ListNode);\n if (parentList) {\n type = parentList.getListType();\n }\n } catch {\n type = element.getListType();\n }\n\n if (type === \"bullet\") {\n setStyles(getListStyles(\"ul\"));\n } else {\n setStyles(getListStyles(\"ol\"));\n }\n } else if ($isQuoteNode(element)) {\n setStyles(lexicalTheme.typography.quotes || []);\n } else {\n setStyles([]);\n }\n }, [element]);\n\n return (\n <>\n {!!styles?.length ? (\n <DropDown\n buttonClassName=\"toolbar-item typography-dropdown\"\n buttonAriaLabel={\"Typography formatting options\"}\n buttonLabel={value?.label || \"Typography\"}\n stopCloseOnClickSelf={true}\n disabled={false}\n showScroll={true}\n >\n {styles?.map(option => (\n <DropDownItem\n className={`item typography-item ${\n value?.id === option.id ? \"active dropdown-item-active\" : \"\"\n }`}\n onClick={() => applyTypography(option)}\n key={option.id}\n >\n <span className=\"text\">{option.label}</span>\n </DropDownItem>\n ))}\n </DropDown>\n ) : null}\n </>\n );\n};\n"],"names":["TypographyDropDown","value","applyTypography","useTypographyAction","lexicalTheme","useAdminConfig","styles","setStyles","useState","element","useCurrentElement","rangeSelection","useCurrentSelection","getAllTextStyles","headingsStyles","paragraphStyles","getListStyles","tag","listStyles","x","fallbackTag","useEffect","$isParagraphNode","$isHeadingNode","$isListNode","type","anchorNode","parentList","$getNearestNodeOfType","ListNode","$isQuoteNode","DropDown","option","DropDownItem"],"mappings":";;;;;AAyBO,MAAMA,qBAAqB;IAC9B,MAAM,EAAEC,KAAK,EAAEC,eAAe,EAAE,GAAGC;IACnC,MAAM,EAAEC,YAAY,EAAE,GAAGC;IAEzB,MAAM,CAACC,QAAQC,UAAU,GAAGC,SAA4B,EAAE;IAC1D,MAAM,EAAEC,OAAO,EAAE,GAAGC;IACpB,MAAM,EAAEC,cAAc,EAAE,GAAGC;IAE3B,MAAMC,mBAAmB;QACrB,MAAMC,iBAAiBV,aAAa,UAAU,CAAC,QAAQ,IAAI,EAAE;QAC7D,MAAMW,kBAAkBX,aAAa,UAAU,CAAC,UAAU,IAAI,EAAE;QAEhE,OAAO;eAAIU;eAAmBC;SAAgB;IAClD;IAEA,MAAMC,gBAAgB,CAACC;QACnB,MAAMC,aAAad,aAAa,UAAU,CAAC,KAAK,EAAE,OAAOe,CAAAA,IAAKA,EAAE,GAAG,KAAKF,QAAQ,EAAE;QAClF,IAAIC,WAAW,MAAM,GAAG,GACpB,OAAOA;QAGX,MAAME,cAAcH,AAAQ,SAARA,MAAe,OAAO;QAC1C,OAAOb,aAAa,UAAU,CAAC,KAAK,EAAE,OAAOe,CAAAA,IAAKA,EAAE,GAAG,KAAKC,gBAAgB,EAAE;IAClF;IAEAC,UAAU;QACN,IAAI,CAACZ,WAAW,CAACE,gBACb;QAGJ,IAAIW,iBAAiBb,YAAYc,eAAed,UAC5CF,UAAUM;aACP,IAAIW,YAAYf,UAAU;YAC7B,IAAIgB;YACJ,IAAI;gBACA,MAAMC,aAAaf,eAAe,MAAM,CAAC,OAAO;gBAChD,MAAMgB,aAAaC,sBAAgCF,YAAYG;gBAC/D,IAAIF,YACAF,OAAOE,WAAW,WAAW;YAErC,EAAE,OAAM;gBACJF,OAAOhB,QAAQ,WAAW;YAC9B;YAEa,aAATgB,OACAlB,UAAUS,cAAc,SAExBT,UAAUS,cAAc;QAEhC,OAAWc,aAAarB,WACpBF,UAAUH,aAAa,UAAU,CAAC,MAAM,IAAI,EAAE,IAE9CG,UAAU,EAAE;IAEpB,GAAG;QAACE;KAAQ;IAEZ,OAAO,WAAP,GACI,0CACK,AAAEH,QAAQ,SAAS,WAAT,GACP,oBAACyB,UAAQA;QACL,iBAAgB;QAChB,iBAAiB;QACjB,aAAa9B,OAAO,SAAS;QAC7B,sBAAsB;QACtB,UAAU;QACV,YAAY;OAEXK,QAAQ,IAAI0B,CAAAA,SAAAA,WAAAA,GACT,oBAACC,cAAYA;YACT,WAAW,CAAC,qBAAqB,EAC7BhC,OAAO,OAAO+B,OAAO,EAAE,GAAG,gCAAgC,IAC5D;YACF,SAAS,IAAM9B,gBAAgB8B;YAC/B,KAAKA,OAAO,EAAE;yBAEd,oBAAC;YAAK,WAAU;WAAQA,OAAO,KAAK,OAIhD;AAGhB"}

package/config/AdminConfig/Menu/MenuItem.d.ts CHANGED Viewed

@@ -39,5 +39,6 @@ declare const MenuItem: ((props: SidebarMenuItemButtonProps) => React.JSX.Elemen
             displayName: string;
         }>) => (props: unknown) => React.JSX.Element;
     };
+    Badge: ({ text }: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItemBadge").SidebarMenuItemBadgeProps) => React.JSX.Element;
 };
 export { MenuItem };

package/config/AdminConfig/Menu/MenuItem.js CHANGED Viewed

@@ -5,7 +5,8 @@ const MenuLinkBase = (props)=>/*#__PURE__*/ react.createElement(Sidebar.Item, pr
 const DecoratableMenuItem = makeDecoratable("MenuItem", MenuLinkBase);
 const MenuItem = Object.assign(DecoratableMenuItem, {
     Action: Sidebar.Item.Action,
-    Icon: Sidebar.Item.Icon
+    Icon: Sidebar.Item.Icon,
+    Badge: Sidebar.Item.Badge
 });
 export { MenuItem };

package/config/AdminConfig/Menu/MenuItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"config/AdminConfig/Menu/MenuItem.js","sources":["../../../../src/config/AdminConfig/Menu/MenuItem.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport { Sidebar } from \"@webiny/admin-ui\";\nimport { type SidebarMenuItemButtonProps } from \"@webiny/admin-ui/Sidebar/components/items/SidebarMenuItem.js\";\n\nconst MenuLinkBase = (props: SidebarMenuItemButtonProps) => {\n return <Sidebar.Item {...props} />;\n};\n\nconst DecoratableMenuItem = makeDecoratable(\"MenuItem\", MenuLinkBase);\n\nconst MenuItem = Object.assign(DecoratableMenuItem, {\n Action: Sidebar.Item.Action,\n Icon: Sidebar.Item.Icon\n});\n\nexport { MenuItem };\n"],"names":["MenuLinkBase","props","Sidebar","DecoratableMenuItem","makeDecoratable","MenuItem","Object"],"mappings":";;;AAKA,MAAMA,eAAe,CAACC,QACX,WAAP,GAAO,oBAACC,QAAQ,IAAI,EAAKD;AAG7B,MAAME,sBAAsBC,gBAAgB,YAAYJ;AAExD,MAAMK,WAAWC,OAAO,MAAM,CAACH,qBAAqB;IAChD,QAAQD,QAAQ,IAAI,CAAC,MAAM;IAC3B,MAAMA,QAAQ,IAAI,CAAC,IAAI;~~AAC3B~~"}
1	+ {"version":3,"file":"config/AdminConfig/Menu/MenuItem.js","sources":["../../../../src/config/AdminConfig/Menu/MenuItem.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport { Sidebar } from \"@webiny/admin-ui\";\nimport { type SidebarMenuItemButtonProps } from \"@webiny/admin-ui/Sidebar/components/items/SidebarMenuItem.js\";\n\nconst MenuLinkBase = (props: SidebarMenuItemButtonProps) => {\n return <Sidebar.Item {...props} />;\n};\n\nconst DecoratableMenuItem = makeDecoratable(\"MenuItem\", MenuLinkBase);\n\nconst MenuItem = Object.assign(DecoratableMenuItem, {\n Action: Sidebar.Item.Action,\n Icon: Sidebar.Item.Icon,\n Badge: Sidebar.Item.Badge\n});\n\nexport { MenuItem };\n"],"names":["MenuLinkBase","props","Sidebar","DecoratableMenuItem","makeDecoratable","MenuItem","Object"],"mappings":";;;AAKA,MAAMA,eAAe,CAACC,QACX,WAAP,GAAO,oBAACC,QAAQ,IAAI,EAAKD;AAG7B,MAAME,sBAAsBC,gBAAgB,YAAYJ;AAExD,MAAMK,WAAWC,OAAO,MAAM,CAACH,qBAAqB;IAChD,QAAQD,QAAQ,IAAI,CAAC,MAAM;IAC3B,MAAMA,QAAQ,IAAI,CAAC,IAAI;IACvB,OAAOA,QAAQ,IAAI,CAAC,KAAK;AAC7B"}

package/config/AdminConfig/Menu/MenuLink.d.ts CHANGED Viewed

@@ -39,5 +39,6 @@ declare const MenuLink: ((props: SidebarMenuItemLinkProps) => React.JSX.Element
             displayName: string;
         }>) => (props: unknown) => React.JSX.Element;
     };
+    Badge: ({ text }: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItemBadge").SidebarMenuItemBadgeProps) => React.JSX.Element;
 };
 export { MenuLink };

package/config/AdminConfig/Menu/MenuLink.js CHANGED Viewed

@@ -14,7 +14,8 @@ const MenuLinkBase = (props)=>{
 const DecoratableMenuLink = makeDecoratable("MenuLink", MenuLinkBase);
 const MenuLink = Object.assign(DecoratableMenuLink, {
     Action: Sidebar.Link.Action,
-    Icon: Sidebar.Link.Icon
+    Icon: Sidebar.Link.Icon,
+    Badge: Sidebar.Link.Badge
 });
 export { MenuLink };

package/config/AdminConfig/Menu/MenuLink.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"config/AdminConfig/Menu/MenuLink.js","sources":["../../../../src/config/AdminConfig/Menu/MenuLink.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport { Sidebar } from \"@webiny/admin-ui\";\nimport { type SidebarMenuItemLinkProps } from \"@webiny/admin-ui/Sidebar/components/items/SidebarMenuLink.js\";\nimport { useRoute } from \"@webiny/app\";\n\nconst MenuLinkBase = (props: SidebarMenuItemLinkProps) => {\n const { route } = useRoute();\n\n if (!route) {\n return null;\n }\n\n const active = route.pathname === props.to.split(\"?\")[0];\n\n return <Sidebar.Link {...props} active={active} />;\n};\n\nconst DecoratableMenuLink = makeDecoratable(\"MenuLink\", MenuLinkBase);\n\nconst MenuLink = Object.assign(DecoratableMenuLink, {\n Action: Sidebar.Link.Action,\n Icon: Sidebar.Link.Icon\n});\n\nexport { MenuLink };\n"],"names":["MenuLinkBase","props","route","useRoute","active","Sidebar","DecoratableMenuLink","makeDecoratable","MenuLink","Object"],"mappings":";;;;AAMA,MAAMA,eAAe,CAACC;IAClB,MAAM,EAAEC,KAAK,EAAE,GAAGC;IAElB,IAAI,CAACD,OACD,OAAO;IAGX,MAAME,SAASF,MAAM,QAAQ,KAAKD,MAAM,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE;IAExD,OAAO,WAAP,GAAO,oBAACI,QAAQ,IAAI;QAAE,GAAGJ,KAAK;QAAE,QAAQG;;AAC5C;AAEA,MAAME,sBAAsBC,gBAAgB,YAAYP;AAExD,MAAMQ,WAAWC,OAAO,MAAM,CAACH,qBAAqB;IAChD,QAAQD,QAAQ,IAAI,CAAC,MAAM;IAC3B,MAAMA,QAAQ,IAAI,CAAC,IAAI;~~AAC3B~~"}
1	+ {"version":3,"file":"config/AdminConfig/Menu/MenuLink.js","sources":["../../../../src/config/AdminConfig/Menu/MenuLink.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport { Sidebar } from \"@webiny/admin-ui\";\nimport { type SidebarMenuItemLinkProps } from \"@webiny/admin-ui/Sidebar/components/items/SidebarMenuLink.js\";\nimport { useRoute } from \"@webiny/app\";\n\nconst MenuLinkBase = (props: SidebarMenuItemLinkProps) => {\n const { route } = useRoute();\n\n if (!route) {\n return null;\n }\n\n const active = route.pathname === props.to.split(\"?\")[0];\n\n return <Sidebar.Link {...props} active={active} />;\n};\n\nconst DecoratableMenuLink = makeDecoratable(\"MenuLink\", MenuLinkBase);\n\nconst MenuLink = Object.assign(DecoratableMenuLink, {\n Action: Sidebar.Link.Action,\n Icon: Sidebar.Link.Icon,\n Badge: Sidebar.Link.Badge\n});\n\nexport { MenuLink };\n"],"names":["MenuLinkBase","props","route","useRoute","active","Sidebar","DecoratableMenuLink","makeDecoratable","MenuLink","Object"],"mappings":";;;;AAMA,MAAMA,eAAe,CAACC;IAClB,MAAM,EAAEC,KAAK,EAAE,GAAGC;IAElB,IAAI,CAACD,OACD,OAAO;IAGX,MAAME,SAASF,MAAM,QAAQ,KAAKD,MAAM,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE;IAExD,OAAO,WAAP,GAAO,oBAACI,QAAQ,IAAI;QAAE,GAAGJ,KAAK;QAAE,QAAQG;;AAC5C;AAEA,MAAME,sBAAsBC,gBAAgB,YAAYP;AAExD,MAAMQ,WAAWC,OAAO,MAAM,CAACH,qBAAqB;IAChD,QAAQD,QAAQ,IAAI,CAAC,MAAM;IAC3B,MAAMA,QAAQ,IAAI,CAAC,IAAI;IACvB,OAAOA,QAAQ,IAAI,CAAC,KAAK;AAC7B"}

package/config/AdminConfig/Menu.d.ts CHANGED Viewed

@@ -70,6 +70,7 @@ export declare const Menu: (({ name, parent, hideIfEmpty, tags, element, remove,
                 displayName: string;
             }>) => (props: unknown) => React.JSX.Element;
         };
+        Badge: ({ text }: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItemBadge.js").SidebarMenuItemBadgeProps) => React.JSX.Element;
     };
     Link: ((props: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItem.js").SidebarMenuItemLinkProps) => React.JSX.Element | null) & {
         original: (props: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItem.js").SidebarMenuItemLinkProps) => React.JSX.Element | null;
@@ -110,6 +111,7 @@ export declare const Menu: (({ name, parent, hideIfEmpty, tags, element, remove,
                 displayName: string;
             }>) => (props: unknown) => React.JSX.Element;
         };
+        Badge: ({ text }: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItemBadge.js").SidebarMenuItemBadgeProps) => React.JSX.Element;
     };
     Group: ((props: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItem.js").SidebarMenuItemGroupProps) => React.JSX.Element) & {
         original: (props: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItem.js").SidebarMenuItemGroupProps) => React.JSX.Element;

package/config/AdminConfig.d.ts CHANGED Viewed

@@ -102,6 +102,7 @@ export declare const AdminConfig: (({ children }: PrivateProps) => React.JSX.Ele
                     displayName: string;
                 }>) => (props: unknown) => React.JSX.Element;
             };
+            Badge: ({ text }: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItemBadge.js").SidebarMenuItemBadgeProps) => React.JSX.Element;
         };
         Link: ((props: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItem.js").SidebarMenuItemLinkProps) => React.JSX.Element | null) & {
             original: (props: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItem.js").SidebarMenuItemLinkProps) => React.JSX.Element | null;
@@ -142,6 +143,7 @@ export declare const AdminConfig: (({ children }: PrivateProps) => React.JSX.Ele
                     displayName: string;
                 }>) => (props: unknown) => React.JSX.Element;
             };
+            Badge: ({ text }: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItemBadge.js").SidebarMenuItemBadgeProps) => React.JSX.Element;
         };
         Group: ((props: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItem.js").SidebarMenuItemGroupProps) => React.JSX.Element) & {
             original: (props: import("@webiny/admin-ui/Sidebar/components/items/SidebarMenuItem.js").SidebarMenuItemGroupProps) => React.JSX.Element;

package/config/AdminConfig.js CHANGED Viewed

@@ -27,6 +27,7 @@ const useAdminConfig = ()=>{
     const lexicalTheme = {
         colors: baseConfig.lexicalTheme?.colors,
         typography: baseConfig.lexicalTheme?.typography || {},
+        fontSizes: [],
         tokens: lexicalTokens
     };
     return {