@webiny/app-headless-cms 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 (24) hide show
  1. package/ContentEntryEditorConfig.d.ts +8 -8
  2. package/admin/components/LexicalCmsEditor/LexicalEditor.d.ts +4 -0
  3. package/admin/components/LexicalCmsEditor/{LexicalCmsEditor.js → LexicalEditor.js} +3 -3
  4. package/admin/components/LexicalCmsEditor/LexicalEditor.js.map +1 -0
  5. package/admin/plugins/fieldRenderers/dynamicZone/TemplateGallery.d.ts +8 -8
  6. package/admin/plugins/fieldRenderers/dynamicZone/TemplateGallery.js +55 -4
  7. package/admin/plugins/fieldRenderers/dynamicZone/TemplateGallery.js.map +1 -1
  8. package/admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.d.ts +25 -0
  9. package/admin/plugins/fieldRenderers/dynamicZone/{TemplateItem.js → TemplateGridItem.js} +3 -3
  10. package/admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.js.map +1 -0
  11. package/admin/plugins/fieldRenderers/dynamicZone/TemplateListItem.d.ts +7 -0
  12. package/admin/plugins/fieldRenderers/dynamicZone/TemplateListItem.js +36 -0
  13. package/admin/plugins/fieldRenderers/dynamicZone/TemplateListItem.js.map +1 -0
  14. package/admin/plugins/fieldRenderers/lexicalText/lexicalTextInput.js +2 -2
  15. package/admin/plugins/fieldRenderers/lexicalText/lexicalTextInput.js.map +1 -1
  16. package/admin/plugins/fieldRenderers/lexicalText/lexicalTextInputs.js +2 -2
  17. package/admin/plugins/fieldRenderers/lexicalText/lexicalTextInputs.js.map +1 -1
  18. package/exports/admin/cms/lexical.d.ts +17 -15
  19. package/exports/admin/cms/lexical.js +2 -1
  20. package/package.json +28 -26
  21. package/admin/components/LexicalCmsEditor/LexicalCmsEditor.d.ts +0 -3
  22. package/admin/components/LexicalCmsEditor/LexicalCmsEditor.js.map +0 -1
  23. package/admin/plugins/fieldRenderers/dynamicZone/TemplateItem.d.ts +0 -25
  24. package/admin/plugins/fieldRenderers/dynamicZone/TemplateItem.js.map +0 -1
@@ -432,27 +432,27 @@ export declare const ContentEntryEditorConfig: (({ priority, children }: import(
432
432
  displayName: string;
433
433
  }>) => (props: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateGallery.js").ShouldRender) => React.JSX.Element;
434
434
  };
435
- Item: (({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateItem.js").TemplateCardProps) => import("react").JSX.Element) & {
436
- original: ({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateItem.js").TemplateCardProps) => import("react").JSX.Element;
435
+ Item: (({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.js").TemplateGridItemProps) => import("react").JSX.Element) & {
436
+ original: ({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.js").TemplateGridItemProps) => import("react").JSX.Element;
437
437
  originalName: string;
438
438
  displayName: string;
439
439
  } & {
440
- original: (({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateItem.js").TemplateCardProps) => import("react").JSX.Element) & {
441
- original: ({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateItem.js").TemplateCardProps) => import("react").JSX.Element;
440
+ original: (({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.js").TemplateGridItemProps) => import("react").JSX.Element) & {
441
+ original: ({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.js").TemplateGridItemProps) => import("react").JSX.Element;
442
442
  originalName: string;
443
443
  displayName: string;
444
444
  };
445
445
  originalName: string;
446
446
  displayName: string;
447
447
  } & {
448
- createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateItem.js").TemplateCardProps) => import("react").JSX.Element) & {
449
- original: ({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateItem.js").TemplateCardProps) => import("react").JSX.Element;
448
+ createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.js").TemplateGridItemProps) => import("react").JSX.Element) & {
449
+ original: ({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.js").TemplateGridItemProps) => import("react").JSX.Element;
450
450
  originalName: string;
451
451
  displayName: string;
452
452
  }>) => (props: unknown) => React.JSX.Element;
453
453
  } & {
454
- createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateItem.js").TemplateCardProps) => import("react").JSX.Element) & {
455
- original: ({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateItem.js").TemplateCardProps) => import("react").JSX.Element;
454
+ createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.js").TemplateGridItemProps) => import("react").JSX.Element) & {
455
+ original: ({ template, onTemplate }: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.js").TemplateGridItemProps) => import("react").JSX.Element;
456
456
  originalName: string;
457
457
  displayName: string;
458
458
  }>) => (props: import("./admin/plugins/fieldRenderers/dynamicZone/TemplateGallery.js").ShouldRender) => React.JSX.Element;
@@ -0,0 +1,4 @@
1
+ import React from "react";
2
+ import { LexicalEditor as BaseLexicalEditor } from "@webiny/app-admin";
3
+ export type LexicalEditorProps = Omit<BaseLexicalEditor.Props, "theme">;
4
+ export declare const LexicalEditor: (props: LexicalEditorProps) => React.JSX.Element;
@@ -19,7 +19,7 @@ const styles = {
19
19
  maxHeight: 350
20
20
  };
21
21
  const toolbar = /*#__PURE__*/ react.createElement(StaticToolbar, null);
22
- const LexicalCmsEditor = (props)=>/*#__PURE__*/ react.createElement(LexicalEditor, {
22
+ const LexicalEditor_LexicalEditor = (props)=>/*#__PURE__*/ react.createElement(LexicalEditor, {
23
23
  ...props,
24
24
  focus: true,
25
25
  staticToolbar: toolbar,
@@ -29,6 +29,6 @@ const LexicalCmsEditor = (props)=>/*#__PURE__*/ react.createElement(LexicalEdito
29
29
  contentEditableStyles: contentEditableStyles,
30
30
  styles: styles
31
31
  });
32
- export { LexicalCmsEditor };
32
+ export { LexicalEditor_LexicalEditor as LexicalEditor };
33
33
 
34
- //# sourceMappingURL=LexicalCmsEditor.js.map
34
+ //# sourceMappingURL=LexicalEditor.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"admin/components/LexicalCmsEditor/LexicalEditor.js","sources":["../../../../src/admin/components/LexicalCmsEditor/LexicalEditor.tsx"],"sourcesContent":["import React from \"react\";\nimport { StaticToolbar } from \"@webiny/lexical-editor\";\nimport { LexicalEditor as BaseLexicalEditor } from \"@webiny/app-admin\";\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\nconst toolbar = <StaticToolbar />;\n\nexport type LexicalEditorProps = Omit<BaseLexicalEditor.Props, \"theme\">;\n\nexport const LexicalEditor = (props: LexicalEditorProps) => {\n return (\n <BaseLexicalEditor\n {...props}\n focus={true}\n staticToolbar={toolbar}\n tag={\"p\"}\n placeholder={props?.placeholder || \"Enter your text here...\"}\n placeholderStyles={placeholderStyles}\n contentEditableStyles={contentEditableStyles}\n styles={styles}\n />\n );\n};\n"],"names":["placeholderStyles","contentEditableStyles","styles","toolbar","StaticToolbar","LexicalEditor","props","BaseLexicalEditor"],"mappings":";;;AAIA,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;AAEA,MAAMC,UAAU,WAAHA,GAAG,oBAACC,eAAaA;AAIvB,MAAMC,8BAAgB,CAACC,QACnB,WAAP,GACI,oBAACC,eAAiBA;QACb,GAAGD,KAAK;QACT,OAAO;QACP,eAAeH;QACf,KAAK;QACL,aAAaG,OAAO,eAAe;QACnC,mBAAmBN;QACnB,uBAAuBC;QACvB,QAAQC"}
@@ -93,27 +93,27 @@ export declare const TemplateGallery: ((props: TemplateGalleryProps) => React.JS
93
93
  displayName: string;
94
94
  }>) => (props: ShouldRender) => React.JSX.Element;
95
95
  };
96
- Item: (({ template, onTemplate }: import("./TemplateItem.js").TemplateCardProps) => React.JSX.Element) & {
97
- original: ({ template, onTemplate }: import("./TemplateItem.js").TemplateCardProps) => React.JSX.Element;
96
+ Item: (({ template, onTemplate }: import("./TemplateGridItem.js").TemplateGridItemProps) => React.JSX.Element) & {
97
+ original: ({ template, onTemplate }: import("./TemplateGridItem.js").TemplateGridItemProps) => React.JSX.Element;
98
98
  originalName: string;
99
99
  displayName: string;
100
100
  } & {
101
- original: (({ template, onTemplate }: import("./TemplateItem.js").TemplateCardProps) => React.JSX.Element) & {
102
- original: ({ template, onTemplate }: import("./TemplateItem.js").TemplateCardProps) => React.JSX.Element;
101
+ original: (({ template, onTemplate }: import("./TemplateGridItem.js").TemplateGridItemProps) => React.JSX.Element) & {
102
+ original: ({ template, onTemplate }: import("./TemplateGridItem.js").TemplateGridItemProps) => React.JSX.Element;
103
103
  originalName: string;
104
104
  displayName: string;
105
105
  };
106
106
  originalName: string;
107
107
  displayName: string;
108
108
  } & {
109
- createDecorator: (decorator: import("@webiny/app-admin").ComponentDecorator<(({ template, onTemplate }: import("./TemplateItem.js").TemplateCardProps) => React.JSX.Element) & {
110
- original: ({ template, onTemplate }: import("./TemplateItem.js").TemplateCardProps) => React.JSX.Element;
109
+ createDecorator: (decorator: import("@webiny/app-admin").ComponentDecorator<(({ template, onTemplate }: import("./TemplateGridItem.js").TemplateGridItemProps) => React.JSX.Element) & {
110
+ original: ({ template, onTemplate }: import("./TemplateGridItem.js").TemplateGridItemProps) => React.JSX.Element;
111
111
  originalName: string;
112
112
  displayName: string;
113
113
  }>) => (props: unknown) => React.JSX.Element;
114
114
  } & {
115
- createDecorator: (decorator: import("@webiny/app-admin").ComponentDecorator<(({ template, onTemplate }: import("./TemplateItem.js").TemplateCardProps) => React.JSX.Element) & {
116
- original: ({ template, onTemplate }: import("./TemplateItem.js").TemplateCardProps) => React.JSX.Element;
115
+ createDecorator: (decorator: import("@webiny/app-admin").ComponentDecorator<(({ template, onTemplate }: import("./TemplateGridItem.js").TemplateGridItemProps) => React.JSX.Element) & {
116
+ original: ({ template, onTemplate }: import("./TemplateGridItem.js").TemplateGridItemProps) => React.JSX.Element;
117
117
  originalName: string;
118
118
  displayName: string;
119
119
  }>) => (props: ShouldRender) => React.JSX.Element;
@@ -1,7 +1,12 @@
1
- import react from "react";
1
+ import react, { useState } from "react";
2
2
  import { makeDecoratable, withDecoratorFactory } from "@webiny/app-admin";
3
3
  import { useModel, useModelField } from "../../../hooks/index.js";
4
- import { TemplateItem } from "./TemplateItem.js";
4
+ import { TemplateGridItem } from "./TemplateGridItem.js";
5
+ import { TemplateListItem } from "./TemplateListItem.js";
6
+ import { DelayedOnChange, Icon, Input, ToggleGroup } from "@webiny/admin-ui";
7
+ import { ReactComponent } from "@webiny/icons/search.svg";
8
+ import { ReactComponent as grid_view_svg_ReactComponent } from "@webiny/icons/grid_view.svg";
9
+ import { ReactComponent as list_svg_ReactComponent } from "@webiny/icons/list.svg";
5
10
  const GalleryContainer = makeDecoratable("TemplateGalleryContainer", (props)=>/*#__PURE__*/ react.createElement(react.Fragment, null, props.children));
6
11
  const GalleryList = makeDecoratable("TemplateGalleryList", (props)=>/*#__PURE__*/ react.createElement("div", {
7
12
  className: "gap-md flex flex-wrap mb-xs"
@@ -9,7 +14,53 @@ const GalleryList = makeDecoratable("TemplateGalleryList", (props)=>/*#__PURE__*
9
14
  const Gallery = makeDecoratable("TemplateGallery", (props)=>{
10
15
  const { field } = useModelField();
11
16
  const templates = props.templates || field.settings?.templates || [];
12
- return /*#__PURE__*/ react.createElement(GalleryContainer, null, /*#__PURE__*/ react.createElement(GalleryList, null, templates.map((template)=>/*#__PURE__*/ react.createElement(TemplateItem, {
17
+ const [viewMode, setViewMode] = useState("grid");
18
+ const [search, setSearch] = useState("");
19
+ const filteredTemplates = templates.filter((t)=>t.name.toLowerCase().includes(search.toLowerCase()));
20
+ return /*#__PURE__*/ react.createElement(GalleryContainer, null, /*#__PURE__*/ react.createElement("div", {
21
+ className: "flex items-center gap-sm pb-md pt-xs"
22
+ }, /*#__PURE__*/ react.createElement("div", {
23
+ className: "flex-1 min-w-0"
24
+ }, /*#__PURE__*/ react.createElement(DelayedOnChange, {
25
+ value: search,
26
+ onChange: setSearch
27
+ }, ({ value, onChange })=>/*#__PURE__*/ react.createElement(Input, {
28
+ autoFocus: true,
29
+ value: value,
30
+ onChange: onChange,
31
+ placeholder: "Search templates...",
32
+ startIcon: /*#__PURE__*/ react.createElement(Icon, {
33
+ icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
34
+ label: "Search"
35
+ }),
36
+ size: "md",
37
+ variant: "primary"
38
+ }))), /*#__PURE__*/ react.createElement("div", {
39
+ className: "shrink-0"
40
+ }, /*#__PURE__*/ react.createElement(ToggleGroup, {
41
+ type: "single",
42
+ value: viewMode,
43
+ onChange: (value)=>setViewMode(value),
44
+ items: [
45
+ {
46
+ id: "grid",
47
+ value: "grid",
48
+ icon: /*#__PURE__*/ react.createElement(grid_view_svg_ReactComponent, null)
49
+ },
50
+ {
51
+ id: "list",
52
+ value: "list",
53
+ icon: /*#__PURE__*/ react.createElement(list_svg_ReactComponent, null)
54
+ }
55
+ ],
56
+ variant: "ghost"
57
+ }))), "grid" === viewMode ? /*#__PURE__*/ react.createElement(GalleryList, null, filteredTemplates.map((template)=>/*#__PURE__*/ react.createElement(TemplateGridItem, {
58
+ key: template.id,
59
+ template: template,
60
+ onTemplate: props.onTemplate
61
+ }))) : /*#__PURE__*/ react.createElement("div", {
62
+ className: "flex flex-col gap-y-sm"
63
+ }, filteredTemplates.map((template)=>/*#__PURE__*/ react.createElement(TemplateListItem, {
13
64
  key: template.id,
14
65
  template: template,
15
66
  onTemplate: props.onTemplate
@@ -25,7 +76,7 @@ function withShouldRender(Component) {
25
76
  const TemplateGallery = Object.assign(withShouldRender(Gallery), {
26
77
  Container: withShouldRender(GalleryContainer),
27
78
  List: withShouldRender(GalleryList),
28
- Item: withShouldRender(TemplateItem)
79
+ Item: withShouldRender(TemplateGridItem)
29
80
  });
30
81
  export { TemplateGallery };
31
82
 
@@ -1 +1 @@
1
- {"version":3,"file":"admin/plugins/fieldRenderers/dynamicZone/TemplateGallery.js","sources":["../../../../../src/admin/plugins/fieldRenderers/dynamicZone/TemplateGallery.tsx"],"sourcesContent":["import React from \"react\";\nimport type { DecoratableComponent } from \"@webiny/app-admin\";\nimport { makeDecoratable, withDecoratorFactory } from \"@webiny/app-admin\";\nimport type { CmsDynamicZoneTemplate } from \"~/types.js\";\nimport { useModel, useModelField } from \"~/admin/hooks/index.js\";\nimport { TemplateItem } from \"./TemplateItem.js\";\n\nexport interface TemplateGalleryContainerProps {\n children: React.ReactNode;\n}\n\nconst GalleryContainer = makeDecoratable(\n \"TemplateGalleryContainer\",\n (props: TemplateGalleryContainerProps) => {\n return <>{props.children}</>;\n }\n);\n\nexport interface TemplateGalleryListProps {\n children: React.ReactNode;\n}\n\nconst GalleryList = makeDecoratable(\"TemplateGalleryList\", (props: TemplateGalleryListProps) => {\n return <div className={\"gap-md flex flex-wrap mb-xs\"}>{props.children}</div>;\n});\n\nexport interface TemplateGalleryProps {\n onTemplate: (template: CmsDynamicZoneTemplate) => void;\n onClose: () => void;\n templates?: CmsDynamicZoneTemplate[];\n}\n\nconst Gallery = makeDecoratable(\"TemplateGallery\", (props: TemplateGalleryProps) => {\n const { field } = useModelField();\n const templates = props.templates || field.settings?.templates || [];\n\n return (\n <GalleryContainer>\n <GalleryList>\n {templates.map(template => (\n <TemplateItem\n key={template.id}\n template={template}\n onTemplate={props.onTemplate}\n />\n ))}\n </GalleryList>\n </GalleryContainer>\n );\n});\n\nexport type ShouldRender = { modelIds?: string[] };\n\nfunction withShouldRender<T extends DecoratableComponent>(Component: T) {\n return withDecoratorFactory<ShouldRender>()(Component, decoratorProps => {\n const { model } = useModel();\n\n if (decoratorProps?.modelIds?.length && !decoratorProps.modelIds.includes(model.modelId)) {\n return false;\n }\n\n return true;\n });\n}\n\n/**\n * We're wrapping each component with `withShouldRender`, because they're all decoratable, and `withShouldRender` attaches a\n * conditional decorator, which optionally takes a `modelIds` prop, so you can control on which models that component will be decorated.\n */\nexport const TemplateGallery = Object.assign(withShouldRender(Gallery), {\n Container: withShouldRender(GalleryContainer),\n List: withShouldRender(GalleryList),\n Item: withShouldRender(TemplateItem)\n});\n"],"names":["GalleryContainer","makeDecoratable","props","GalleryList","Gallery","field","useModelField","templates","template","TemplateItem","withShouldRender","Component","withDecoratorFactory","decoratorProps","model","useModel","TemplateGallery","Object"],"mappings":";;;;AAWA,MAAMA,mBAAmBC,gBACrB,4BACA,CAACC,QACU,WAAP,GAAO,0CAAGA,MAAM,QAAQ;AAQhC,MAAMC,cAAcF,gBAAgB,uBAAuB,CAACC,QACjD,WAAP,GAAO,oBAAC;QAAI,WAAW;OAAgCA,MAAM,QAAQ;AASzE,MAAME,UAAUH,gBAAgB,mBAAmB,CAACC;IAChD,MAAM,EAAEG,KAAK,EAAE,GAAGC;IAClB,MAAMC,YAAYL,MAAM,SAAS,IAAIG,MAAM,QAAQ,EAAE,aAAa,EAAE;IAEpE,OAAO,WAAP,GACI,oBAACL,kBAAgBA,MAAAA,WAAAA,GACb,oBAACG,aAAWA,MACPI,UAAU,GAAG,CAACC,CAAAA,WAAAA,WAAAA,GACX,oBAACC,cAAYA;YACT,KAAKD,SAAS,EAAE;YAChB,UAAUA;YACV,YAAYN,MAAM,UAAU;;AAMpD;AAIA,SAASQ,iBAAiDC,SAAY;IAClE,OAAOC,uBAAqCD,WAAWE,CAAAA;QACnD,MAAM,EAAEC,KAAK,EAAE,GAAGC;QAElB,IAAIF,gBAAgB,UAAU,UAAU,CAACA,eAAe,QAAQ,CAAC,QAAQ,CAACC,MAAM,OAAO,GACnF,OAAO;QAGX,OAAO;IACX;AACJ;AAMO,MAAME,kBAAkBC,OAAO,MAAM,CAACP,iBAAiBN,UAAU;IACpE,WAAWM,iBAAiBV;IAC5B,MAAMU,iBAAiBP;IACvB,MAAMO,iBAAiBD;AAC3B"}
1
+ {"version":3,"file":"admin/plugins/fieldRenderers/dynamicZone/TemplateGallery.js","sources":["../../../../../src/admin/plugins/fieldRenderers/dynamicZone/TemplateGallery.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { DecoratableComponent } from \"@webiny/app-admin\";\nimport { makeDecoratable, withDecoratorFactory } from \"@webiny/app-admin\";\nimport type { CmsDynamicZoneTemplate } from \"~/types.js\";\nimport { useModel, useModelField } from \"~/admin/hooks/index.js\";\nimport { TemplateGridItem } from \"./TemplateGridItem.js\";\nimport { TemplateListItem } from \"./TemplateListItem.js\";\nimport { Input, Icon, DelayedOnChange, ToggleGroup } from \"@webiny/admin-ui\";\nimport { ReactComponent as SearchIcon } from \"@webiny/icons/search.svg\";\nimport { ReactComponent as GridIcon } from \"@webiny/icons/grid_view.svg\";\nimport { ReactComponent as ListIcon } from \"@webiny/icons/list.svg\";\n\nexport interface TemplateGalleryContainerProps {\n children: React.ReactNode;\n}\n\nconst GalleryContainer = makeDecoratable(\n \"TemplateGalleryContainer\",\n (props: TemplateGalleryContainerProps) => {\n return <>{props.children}</>;\n }\n);\n\nexport interface TemplateGalleryListProps {\n children: React.ReactNode;\n}\n\nconst GalleryList = makeDecoratable(\"TemplateGalleryList\", (props: TemplateGalleryListProps) => {\n return <div className={\"gap-md flex flex-wrap mb-xs\"}>{props.children}</div>;\n});\n\nexport interface TemplateGalleryProps {\n onTemplate: (template: CmsDynamicZoneTemplate) => void;\n onClose: () => void;\n templates?: CmsDynamicZoneTemplate[];\n}\n\nconst Gallery = makeDecoratable(\"TemplateGallery\", (props: TemplateGalleryProps) => {\n const { field } = useModelField();\n const templates = props.templates || field.settings?.templates || [];\n\n const [viewMode, setViewMode] = useState<\"grid\" | \"list\">(\"grid\");\n const [search, setSearch] = useState(\"\");\n\n const filteredTemplates = templates.filter(t =>\n t.name.toLowerCase().includes(search.toLowerCase())\n );\n\n return (\n <GalleryContainer>\n <div className={\"flex items-center gap-sm pb-md pt-xs\"}>\n <div className={\"flex-1 min-w-0\"}>\n <DelayedOnChange value={search} onChange={setSearch}>\n {({ value, onChange }) => (\n <Input\n autoFocus={true}\n value={value}\n onChange={onChange}\n placeholder={\"Search templates...\"}\n startIcon={<Icon icon={<SearchIcon />} label={\"Search\"} />}\n size={\"md\"}\n variant={\"primary\"}\n />\n )}\n </DelayedOnChange>\n </div>\n <div className={\"shrink-0\"}>\n <ToggleGroup\n type=\"single\"\n value={viewMode}\n onChange={value => setViewMode(value as \"grid\" | \"list\")}\n items={[\n { id: \"grid\", value: \"grid\", icon: <GridIcon /> },\n { id: \"list\", value: \"list\", icon: <ListIcon /> }\n ]}\n variant=\"ghost\"\n />\n </div>\n </div>\n {viewMode === \"grid\" ? (\n <GalleryList>\n {filteredTemplates.map(template => (\n <TemplateGridItem\n key={template.id}\n template={template}\n onTemplate={props.onTemplate}\n />\n ))}\n </GalleryList>\n ) : (\n <div className={\"flex flex-col gap-y-sm\"}>\n {filteredTemplates.map(template => (\n <TemplateListItem\n key={template.id}\n template={template}\n onTemplate={props.onTemplate}\n />\n ))}\n </div>\n )}\n </GalleryContainer>\n );\n});\n\nexport type ShouldRender = { modelIds?: string[] };\n\nfunction withShouldRender<T extends DecoratableComponent>(Component: T) {\n return withDecoratorFactory<ShouldRender>()(Component, decoratorProps => {\n const { model } = useModel();\n\n if (decoratorProps?.modelIds?.length && !decoratorProps.modelIds.includes(model.modelId)) {\n return false;\n }\n\n return true;\n });\n}\n\n/**\n * We're wrapping each component with `withShouldRender`, because they're all decoratable, and `withShouldRender` attaches a\n * conditional decorator, which optionally takes a `modelIds` prop, so you can control on which models that component will be decorated.\n */\nexport const TemplateGallery = Object.assign(withShouldRender(Gallery), {\n Container: withShouldRender(GalleryContainer),\n List: withShouldRender(GalleryList),\n Item: withShouldRender(TemplateGridItem)\n});\n"],"names":["GalleryContainer","makeDecoratable","props","GalleryList","Gallery","field","useModelField","templates","viewMode","setViewMode","useState","search","setSearch","filteredTemplates","t","DelayedOnChange","value","onChange","Input","Icon","SearchIcon","ToggleGroup","GridIcon","ListIcon","template","TemplateGridItem","TemplateListItem","withShouldRender","Component","withDecoratorFactory","decoratorProps","model","useModel","TemplateGallery","Object"],"mappings":";;;;;;;;;AAgBA,MAAMA,mBAAmBC,gBACrB,4BACA,CAACC,QACU,WAAP,GAAO,0CAAGA,MAAM,QAAQ;AAQhC,MAAMC,cAAcF,gBAAgB,uBAAuB,CAACC,QACjD,WAAP,GAAO,oBAAC;QAAI,WAAW;OAAgCA,MAAM,QAAQ;AASzE,MAAME,UAAUH,gBAAgB,mBAAmB,CAACC;IAChD,MAAM,EAAEG,KAAK,EAAE,GAAGC;IAClB,MAAMC,YAAYL,MAAM,SAAS,IAAIG,MAAM,QAAQ,EAAE,aAAa,EAAE;IAEpE,MAAM,CAACG,UAAUC,YAAY,GAAGC,SAA0B;IAC1D,MAAM,CAACC,QAAQC,UAAU,GAAGF,SAAS;IAErC,MAAMG,oBAAoBN,UAAU,MAAM,CAACO,CAAAA,IACvCA,EAAE,IAAI,CAAC,WAAW,GAAG,QAAQ,CAACH,OAAO,WAAW;IAGpD,OAAO,WAAP,GACI,oBAACX,kBAAgBA,MAAAA,WAAAA,GACb,oBAAC;QAAI,WAAW;qBACZ,oBAAC;QAAI,WAAW;qBACZ,oBAACe,iBAAeA;QAAC,OAAOJ;QAAQ,UAAUC;OACrC,CAAC,EAAEI,KAAK,EAAEC,QAAQ,EAAE,iBACjB,oBAACC,OAAKA;YACF,WAAW;YACX,OAAOF;YACP,UAAUC;YACV,aAAa;YACb,yBAAW,oBAACE,MAAIA;gBAAC,oBAAM,oBAACC,gBAAUA;gBAAK,OAAO;;YAC9C,MAAM;YACN,SAAS;4BAKzB,oBAAC;QAAI,WAAW;qBACZ,oBAACC,aAAWA;QACR,MAAK;QACL,OAAOb;QACP,UAAUQ,CAAAA,QAASP,YAAYO;QAC/B,OAAO;YACH;gBAAE,IAAI;gBAAQ,OAAO;gBAAQ,MAAM,WAAN,GAAM,oBAACM,8BAAQA;YAAI;YAChD;gBAAE,IAAI;gBAAQ,OAAO;gBAAQ,MAAM,WAAN,GAAM,oBAACC,yBAAQA;YAAI;SACnD;QACD,SAAQ;UAInBf,AAAa,WAAbA,WAAsB,WAAT,GACV,oBAACL,aAAWA,MACPU,kBAAkB,GAAG,CAACW,CAAAA,WAAAA,WAAAA,GACnB,oBAACC,kBAAgBA;YACb,KAAKD,SAAS,EAAE;YAChB,UAAUA;YACV,YAAYtB,MAAM,UAAU;6BAKxC,oBAAC;QAAI,WAAW;OACXW,kBAAkB,GAAG,CAACW,CAAAA,WAAAA,WAAAA,GACnB,oBAACE,kBAAgBA;YACb,KAAKF,SAAS,EAAE;YAChB,UAAUA;YACV,YAAYtB,MAAM,UAAU;;AAOxD;AAIA,SAASyB,iBAAiDC,SAAY;IAClE,OAAOC,uBAAqCD,WAAWE,CAAAA;QACnD,MAAM,EAAEC,KAAK,EAAE,GAAGC;QAElB,IAAIF,gBAAgB,UAAU,UAAU,CAACA,eAAe,QAAQ,CAAC,QAAQ,CAACC,MAAM,OAAO,GACnF,OAAO;QAGX,OAAO;IACX;AACJ;AAMO,MAAME,kBAAkBC,OAAO,MAAM,CAACP,iBAAiBvB,UAAU;IACpE,WAAWuB,iBAAiB3B;IAC5B,MAAM2B,iBAAiBxB;IACvB,MAAMwB,iBAAiBF;AAC3B"}
@@ -0,0 +1,25 @@
1
+ import React from "react";
2
+ import type { CmsDynamicZoneTemplate } from "../../../../types.js";
3
+ export interface TemplateGridItemProps {
4
+ template: CmsDynamicZoneTemplate;
5
+ onTemplate: (template: CmsDynamicZoneTemplate) => void;
6
+ }
7
+ export declare const TemplateGridItem: (({ template, onTemplate }: TemplateGridItemProps) => React.JSX.Element) & {
8
+ original: ({ template, onTemplate }: TemplateGridItemProps) => React.JSX.Element;
9
+ originalName: string;
10
+ displayName: string;
11
+ } & {
12
+ original: (({ template, onTemplate }: TemplateGridItemProps) => React.JSX.Element) & {
13
+ original: ({ template, onTemplate }: TemplateGridItemProps) => React.JSX.Element;
14
+ originalName: string;
15
+ displayName: string;
16
+ };
17
+ originalName: string;
18
+ displayName: string;
19
+ } & {
20
+ createDecorator: (decorator: import("@webiny/app-admin").ComponentDecorator<(({ template, onTemplate }: TemplateGridItemProps) => React.JSX.Element) & {
21
+ original: ({ template, onTemplate }: TemplateGridItemProps) => React.JSX.Element;
22
+ originalName: string;
23
+ displayName: string;
24
+ }>) => (props: unknown) => React.JSX.Element;
25
+ };
@@ -3,7 +3,7 @@ import { makeDecoratable } from "@webiny/app-admin";
3
3
  import { TemplateIcon } from "./TemplateIcon.js";
4
4
  import { Button, Dialog, Text } from "@webiny/admin-ui";
5
5
  import { ReactComponent } from "@webiny/icons/add_circle_outline.svg";
6
- const TemplateItem = makeDecoratable("TemplateItem", ({ template, onTemplate })=>{
6
+ const TemplateGridItem = makeDecoratable("TemplateGridItem", ({ template, onTemplate })=>{
7
7
  const [isHovered, setIsHovered] = useState(false);
8
8
  return /*#__PURE__*/ react.createElement("div", {
9
9
  onMouseEnter: ()=>setIsHovered(true),
@@ -37,6 +37,6 @@ const TemplateItem = makeDecoratable("TemplateItem", ({ template, onTemplate })=
37
37
  icon: /*#__PURE__*/ react.createElement(ReactComponent, null)
38
38
  }, "Insert"))));
39
39
  });
40
- export { TemplateItem };
40
+ export { TemplateGridItem };
41
41
 
42
- //# sourceMappingURL=TemplateItem.js.map
42
+ //# sourceMappingURL=TemplateGridItem.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.js","sources":["../../../../../src/admin/plugins/fieldRenderers/dynamicZone/TemplateGridItem.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport type { CmsDynamicZoneTemplate } from \"~/types.js\";\nimport { TemplateIcon } from \"~/admin/plugins/fieldRenderers/dynamicZone/TemplateIcon.js\";\nimport { Text, Button } from \"@webiny/admin-ui\";\nimport { Dialog } from \"@webiny/admin-ui\";\nimport { ReactComponent as PlusIcon } from \"@webiny/icons/add_circle_outline.svg\";\n\nexport interface TemplateGridItemProps {\n template: CmsDynamicZoneTemplate;\n onTemplate: (template: CmsDynamicZoneTemplate) => void;\n}\n\nexport const TemplateGridItem = makeDecoratable(\n \"TemplateGridItem\",\n ({ template, onTemplate }: TemplateGridItemProps) => {\n const [isHovered, setIsHovered] = useState(false);\n\n return (\n <div\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n className={\n \"flex flex-col justify-between bg-neutral-base overflow-hidden rounded-lg w-[173px] relative shadow-sm\"\n }\n >\n <div>\n <div\n className={\n \"flex items-center justify-center py-xxl w-full bg-neutral-dimmed\"\n }\n >\n <TemplateIcon icon={template.icon} style={{ width: 40, height: 40 }} />\n </div>\n <div className={\"py-sm-extra px-md\"}>\n <Text size={\"md\"} className={\"mb-xs text-neutral-primary font-semibold\"}>\n {template.name}\n </Text>\n <Text size={\"sm\"} as={\"div\"} className={\"text-neutral-muted\"}>\n {template.description}\n </Text>\n </div>\n </div>\n\n {isHovered && (\n <Dialog.Close asChild>\n <div\n className=\"absolute inset-0 flex items-center justify-center bg-white/80 cursor-pointer\"\n onClick={() => onTemplate(template)}\n >\n <Button size={\"lg\"} variant=\"primary\" icon={<PlusIcon />}>\n Insert\n </Button>\n </div>\n </Dialog.Close>\n )}\n </div>\n );\n }\n);\n"],"names":["TemplateGridItem","makeDecoratable","template","onTemplate","isHovered","setIsHovered","useState","TemplateIcon","Text","Dialog","Button","PlusIcon"],"mappings":";;;;;AAaO,MAAMA,mBAAmBC,gBAC5B,oBACA,CAAC,EAAEC,QAAQ,EAAEC,UAAU,EAAyB;IAC5C,MAAM,CAACC,WAAWC,aAAa,GAAGC,SAAS;IAE3C,OAAO,WAAP,GACI,oBAAC;QACG,cAAc,IAAMD,aAAa;QACjC,cAAc,IAAMA,aAAa;QACjC,WACI;qBAGJ,oBAAC,2BACG,oBAAC;QACG,WACI;qBAGJ,oBAACE,cAAYA;QAAC,MAAML,SAAS,IAAI;QAAE,OAAO;YAAE,OAAO;YAAI,QAAQ;QAAG;uBAEtE,oBAAC;QAAI,WAAW;qBACZ,oBAACM,MAAIA;QAAC,MAAM;QAAM,WAAW;OACxBN,SAAS,IAAI,iBAElB,oBAACM,MAAIA;QAAC,MAAM;QAAM,IAAI;QAAO,WAAW;OACnCN,SAAS,WAAW,KAKhCE,aAAa,WAAbA,GACG,oBAACK,OAAO,KAAK;QAAC;qBACV,oBAAC;QACG,WAAU;QACV,SAAS,IAAMN,WAAWD;qBAE1B,oBAACQ,QAAMA;QAAC,MAAM;QAAM,SAAQ;QAAU,oBAAM,oBAACC,gBAAQA;OAAK;AAQlF"}
@@ -0,0 +1,7 @@
1
+ import React from "react";
2
+ import type { CmsDynamicZoneTemplate } from "../../../../types.js";
3
+ export interface TemplateListItemProps {
4
+ template: CmsDynamicZoneTemplate;
5
+ onTemplate: (template: CmsDynamicZoneTemplate) => void;
6
+ }
7
+ export declare const TemplateListItem: ({ template, onTemplate }: TemplateListItemProps) => React.JSX.Element;
@@ -0,0 +1,36 @@
1
+ import react from "react";
2
+ import { TemplateIcon } from "./TemplateIcon.js";
3
+ import { Button, Dialog, Text } from "@webiny/admin-ui";
4
+ import { ReactComponent } from "@webiny/icons/add.svg";
5
+ const TemplateListItem = ({ template, onTemplate })=>/*#__PURE__*/ react.createElement(Dialog.Close, {
6
+ asChild: true
7
+ }, /*#__PURE__*/ react.createElement("div", {
8
+ onClick: ()=>onTemplate(template),
9
+ className: "group flex items-center gap-y-md py-sm-extra px-md rounded-lg bg-neutral-light hover:bg-[#f1f2f4] cursor-pointer"
10
+ }, /*#__PURE__*/ react.createElement("div", {
11
+ className: "flex items-center justify-center shrink-0 pr-md"
12
+ }, /*#__PURE__*/ react.createElement(TemplateIcon, {
13
+ icon: template.icon,
14
+ style: {
15
+ width: 24,
16
+ height: 24
17
+ }
18
+ })), /*#__PURE__*/ react.createElement("div", {
19
+ className: "flex-1 min-w-0"
20
+ }, /*#__PURE__*/ react.createElement(Text, {
21
+ size: "md",
22
+ className: "text-neutral-primary font-semibold truncate"
23
+ }, template.name), template.description && /*#__PURE__*/ react.createElement(Text, {
24
+ size: "sm",
25
+ as: "div",
26
+ className: "text-neutral-muted truncate"
27
+ }, template.description)), /*#__PURE__*/ react.createElement("div", {
28
+ className: "hidden group-hover:block"
29
+ }, /*#__PURE__*/ react.createElement(Button, {
30
+ size: "md",
31
+ variant: "primary",
32
+ icon: /*#__PURE__*/ react.createElement(ReactComponent, null)
33
+ }, "Insert"))));
34
+ export { TemplateListItem };
35
+
36
+ //# sourceMappingURL=TemplateListItem.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"admin/plugins/fieldRenderers/dynamicZone/TemplateListItem.js","sources":["../../../../../src/admin/plugins/fieldRenderers/dynamicZone/TemplateListItem.tsx"],"sourcesContent":["import React from \"react\";\nimport type { CmsDynamicZoneTemplate } from \"~/types.js\";\nimport { TemplateIcon } from \"~/admin/plugins/fieldRenderers/dynamicZone/TemplateIcon.js\";\nimport { Text, Button } from \"@webiny/admin-ui\";\nimport { Dialog } from \"@webiny/admin-ui\";\nimport { ReactComponent as PlusIcon } from \"@webiny/icons/add.svg\";\n\nexport interface TemplateListItemProps {\n template: CmsDynamicZoneTemplate;\n onTemplate: (template: CmsDynamicZoneTemplate) => void;\n}\n\n// Used #f1f2f4 b/c in Figma, the color was result of multiple colors combined.\nexport const TemplateListItem = ({ template, onTemplate }: TemplateListItemProps) => {\n return (\n <Dialog.Close asChild>\n <div\n onClick={() => onTemplate(template)}\n className={\n \"group flex items-center gap-y-md py-sm-extra px-md rounded-lg bg-neutral-light hover:bg-[#f1f2f4] cursor-pointer\"\n }\n >\n <div className={\"flex items-center justify-center shrink-0 pr-md\"}>\n <TemplateIcon icon={template.icon} style={{ width: 24, height: 24 }} />\n </div>\n <div className={\"flex-1 min-w-0\"}>\n <Text size={\"md\"} className={\"text-neutral-primary font-semibold truncate\"}>\n {template.name}\n </Text>\n {template.description && (\n <Text size={\"sm\"} as={\"div\"} className={\"text-neutral-muted truncate\"}>\n {template.description}\n </Text>\n )}\n </div>\n <div className={\"hidden group-hover:block\"}>\n <Button size={\"md\"} variant={\"primary\"} icon={<PlusIcon />}>\n Insert\n </Button>\n </div>\n </div>\n </Dialog.Close>\n );\n};\n"],"names":["TemplateListItem","template","onTemplate","Dialog","TemplateIcon","Text","Button","PlusIcon"],"mappings":";;;;AAaO,MAAMA,mBAAmB,CAAC,EAAEC,QAAQ,EAAEC,UAAU,EAAyB,GACrE,WAAP,GACI,oBAACC,OAAO,KAAK;QAAC;qBACV,oBAAC;QACG,SAAS,IAAMD,WAAWD;QAC1B,WACI;qBAGJ,oBAAC;QAAI,WAAW;qBACZ,oBAACG,cAAYA;QAAC,MAAMH,SAAS,IAAI;QAAE,OAAO;YAAE,OAAO;YAAI,QAAQ;QAAG;uBAEtE,oBAAC;QAAI,WAAW;qBACZ,oBAACI,MAAIA;QAAC,MAAM;QAAM,WAAW;OACxBJ,SAAS,IAAI,GAEjBA,SAAS,WAAW,IAAI,WAAJ,GACjB,oBAACI,MAAIA;QAAC,MAAM;QAAM,IAAI;QAAO,WAAW;OACnCJ,SAAS,WAAW,kBAIjC,oBAAC;QAAI,WAAW;qBACZ,oBAACK,QAAMA;QAAC,MAAM;QAAM,SAAS;QAAW,oBAAM,oBAACC,gBAAQA;OAAK"}
@@ -3,7 +3,7 @@ import get from "lodash/get.js";
3
3
  import { i18n } from "@webiny/app/i18n/index.js";
4
4
  import { FormComponentDescription, FormComponentLabel, FormComponentNote } from "@webiny/admin-ui";
5
5
  import { useForm } from "@webiny/form";
6
- import { LexicalCmsEditor } from "../../../components/LexicalCmsEditor/LexicalCmsEditor.js";
6
+ import { LexicalEditor } from "../../../components/LexicalCmsEditor/LexicalEditor.js";
7
7
  import { useFieldEffectiveRules, useModelField } from "@webiny/app-headless-cms-common";
8
8
  const t = i18n.ns("app-headless-cms/admin/fields/rich-text");
9
9
  const getKey = (id, field)=>{
@@ -37,7 +37,7 @@ const lexicalTextInput_plugin = {
37
37
  }), /*#__PURE__*/ react.createElement(FormComponentDescription, {
38
38
  text: field.description,
39
39
  disabled: disabled
40
- }), /*#__PURE__*/ react.createElement(LexicalCmsEditor, {
40
+ }), /*#__PURE__*/ react.createElement(LexicalEditor, {
41
41
  disabled: disabled,
42
42
  value: bind.value,
43
43
  onChange: bind.onChange,
@@ -1 +1 @@
1
- {"version":3,"file":"admin/plugins/fieldRenderers/lexicalText/lexicalTextInput.js","sources":["../../../../../src/admin/plugins/fieldRenderers/lexicalText/lexicalTextInput.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { FormComponentLabel } from \"@webiny/admin-ui\";\nimport { FormComponentNote } from \"@webiny/admin-ui\";\nimport { FormComponentDescription } from \"@webiny/admin-ui\";\nimport type { CmsModelFieldRendererPlugin, CmsModelField } from \"~/types.js\";\nimport { useForm } from \"@webiny/form\";\nimport { LexicalCmsEditor } from \"~/admin/components/LexicalCmsEditor/LexicalCmsEditor.js\";\nimport { useFieldEffectiveRules, useModelField } from \"@webiny/app-headless-cms-common\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/rich-text\");\n\nconst getKey = (id: string | undefined, field: CmsModelField): string => {\n const formId = id || \"new\";\n return `${formId}.${field.fieldId}`;\n};\n\nconst plugin: CmsModelFieldRendererPlugin = {\n type: \"cms-editor-field-renderer\",\n name: \"cms-editor-field-renderer-lexical\",\n renderer: {\n rendererName: \"lexical-text-input\",\n name: t`Lexical Text Input`,\n description: t`Renders a lexical text editor.`,\n canUse({ field }) {\n return [\n field.type === \"rich-text\",\n !field.list,\n !get(field, \"predefinedValues.enabled\")\n ].every(Boolean);\n },\n render({ getBind }) {\n const { field } = useModelField();\n const rules = useFieldEffectiveRules(field);\n const form = useForm();\n\n const Bind = getBind();\n\n const disabled = !rules.canEdit || rules.disabled;\n\n return (\n <Bind>\n {bind => {\n return (\n <Bind.ValidationContainer>\n <FormComponentLabel\n text={field.label}\n hint={field.help}\n disabled={disabled}\n />\n <FormComponentDescription\n text={field.description}\n disabled={disabled}\n />\n <LexicalCmsEditor\n disabled={disabled}\n value={bind.value}\n onChange={bind.onChange}\n key={getKey(form.data.id, field)}\n placeholder={field.placeholder}\n data-testid={`fr.input.lexical.${field.label}`}\n />\n {field.note ? (\n <FormComponentNote text={field.note} disabled={disabled} />\n ) : null}\n </Bind.ValidationContainer>\n );\n }}\n </Bind>\n );\n }\n }\n};\n\nexport default plugin;\n"],"names":["t","i18n","getKey","id","field","formId","plugin","get","Boolean","getBind","useModelField","rules","useFieldEffectiveRules","form","useForm","Bind","disabled","bind","FormComponentLabel","FormComponentDescription","LexicalCmsEditor","FormComponentNote"],"mappings":";;;;;;;AAWA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAElB,MAAMC,SAAS,CAACC,IAAwBC;IACpC,MAAMC,SAASF,MAAM;IACrB,OAAO,GAAGE,OAAO,CAAC,EAAED,MAAM,OAAO,EAAE;AACvC;AAEA,MAAME,0BAAsC;IACxC,MAAM;IACN,MAAM;IACN,UAAU;QACN,cAAc;QACd,MAAMN,CAAC,CAAC,kBAAkB,CAAC;QAC3B,aAAaA,CAAC,CAAC,8BAA8B,CAAC;QAC9C,QAAO,EAAEI,KAAK,EAAE;YACZ,OAAO;gBACY,gBAAfA,MAAM,IAAI;gBACV,CAACA,MAAM,IAAI;gBACX,CAACG,IAAIH,OAAO;aACf,CAAC,KAAK,CAACI;QACZ;QACA,QAAO,EAAEC,OAAO,EAAE;YACd,MAAM,EAAEL,KAAK,EAAE,GAAGM;YAClB,MAAMC,QAAQC,uBAAuBR;YACrC,MAAMS,OAAOC;YAEb,MAAMC,OAAON;YAEb,MAAMO,WAAW,CAACL,MAAM,OAAO,IAAIA,MAAM,QAAQ;YAEjD,OAAO,WAAP,GACI,oBAACI,MAAAA,MACIE,CAAAA,OACU,WAAP,GACI,oBAACF,KAAK,mBAAmB,sBACrB,oBAACG,oBAAkBA;oBACf,MAAMd,MAAM,KAAK;oBACjB,MAAMA,MAAM,IAAI;oBAChB,UAAUY;kCAEd,oBAACG,0BAAwBA;oBACrB,MAAMf,MAAM,WAAW;oBACvB,UAAUY;kCAEd,oBAACI,kBAAgBA;oBACb,UAAUJ;oBACV,OAAOC,KAAK,KAAK;oBACjB,UAAUA,KAAK,QAAQ;oBACvB,KAAKf,OAAOW,KAAK,IAAI,CAAC,EAAE,EAAET;oBAC1B,aAAaA,MAAM,WAAW;oBAC9B,eAAa,CAAC,iBAAiB,EAAEA,MAAM,KAAK,EAAE;oBAEjDA,MAAM,IAAI,GAAG,WAAH,GACP,oBAACiB,mBAAiBA;oBAAC,MAAMjB,MAAM,IAAI;oBAAE,UAAUY;qBAC/C;QAM5B;IACJ;AACJ;AAEA,yBAAeV"}
1
+ {"version":3,"file":"admin/plugins/fieldRenderers/lexicalText/lexicalTextInput.js","sources":["../../../../../src/admin/plugins/fieldRenderers/lexicalText/lexicalTextInput.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { FormComponentLabel } from \"@webiny/admin-ui\";\nimport { FormComponentNote } from \"@webiny/admin-ui\";\nimport { FormComponentDescription } from \"@webiny/admin-ui\";\nimport type { CmsModelFieldRendererPlugin, CmsModelField } from \"~/types.js\";\nimport { useForm } from \"@webiny/form\";\nimport { LexicalEditor } from \"~/admin/components/LexicalCmsEditor/LexicalEditor.js\";\nimport { useFieldEffectiveRules, useModelField } from \"@webiny/app-headless-cms-common\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/rich-text\");\n\nconst getKey = (id: string | undefined, field: CmsModelField): string => {\n const formId = id || \"new\";\n return `${formId}.${field.fieldId}`;\n};\n\nconst plugin: CmsModelFieldRendererPlugin = {\n type: \"cms-editor-field-renderer\",\n name: \"cms-editor-field-renderer-lexical\",\n renderer: {\n rendererName: \"lexical-text-input\",\n name: t`Lexical Text Input`,\n description: t`Renders a lexical text editor.`,\n canUse({ field }) {\n return [\n field.type === \"rich-text\",\n !field.list,\n !get(field, \"predefinedValues.enabled\")\n ].every(Boolean);\n },\n render({ getBind }) {\n const { field } = useModelField();\n const rules = useFieldEffectiveRules(field);\n const form = useForm();\n\n const Bind = getBind();\n\n const disabled = !rules.canEdit || rules.disabled;\n\n return (\n <Bind>\n {bind => {\n return (\n <Bind.ValidationContainer>\n <FormComponentLabel\n text={field.label}\n hint={field.help}\n disabled={disabled}\n />\n <FormComponentDescription\n text={field.description}\n disabled={disabled}\n />\n <LexicalEditor\n disabled={disabled}\n value={bind.value}\n onChange={bind.onChange}\n key={getKey(form.data.id, field)}\n placeholder={field.placeholder}\n data-testid={`fr.input.lexical.${field.label}`}\n />\n {field.note ? (\n <FormComponentNote text={field.note} disabled={disabled} />\n ) : null}\n </Bind.ValidationContainer>\n );\n }}\n </Bind>\n );\n }\n }\n};\n\nexport default plugin;\n"],"names":["t","i18n","getKey","id","field","formId","plugin","get","Boolean","getBind","useModelField","rules","useFieldEffectiveRules","form","useForm","Bind","disabled","bind","FormComponentLabel","FormComponentDescription","LexicalEditor","FormComponentNote"],"mappings":";;;;;;;AAWA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAElB,MAAMC,SAAS,CAACC,IAAwBC;IACpC,MAAMC,SAASF,MAAM;IACrB,OAAO,GAAGE,OAAO,CAAC,EAAED,MAAM,OAAO,EAAE;AACvC;AAEA,MAAME,0BAAsC;IACxC,MAAM;IACN,MAAM;IACN,UAAU;QACN,cAAc;QACd,MAAMN,CAAC,CAAC,kBAAkB,CAAC;QAC3B,aAAaA,CAAC,CAAC,8BAA8B,CAAC;QAC9C,QAAO,EAAEI,KAAK,EAAE;YACZ,OAAO;gBACY,gBAAfA,MAAM,IAAI;gBACV,CAACA,MAAM,IAAI;gBACX,CAACG,IAAIH,OAAO;aACf,CAAC,KAAK,CAACI;QACZ;QACA,QAAO,EAAEC,OAAO,EAAE;YACd,MAAM,EAAEL,KAAK,EAAE,GAAGM;YAClB,MAAMC,QAAQC,uBAAuBR;YACrC,MAAMS,OAAOC;YAEb,MAAMC,OAAON;YAEb,MAAMO,WAAW,CAACL,MAAM,OAAO,IAAIA,MAAM,QAAQ;YAEjD,OAAO,WAAP,GACI,oBAACI,MAAAA,MACIE,CAAAA,OACU,WAAP,GACI,oBAACF,KAAK,mBAAmB,sBACrB,oBAACG,oBAAkBA;oBACf,MAAMd,MAAM,KAAK;oBACjB,MAAMA,MAAM,IAAI;oBAChB,UAAUY;kCAEd,oBAACG,0BAAwBA;oBACrB,MAAMf,MAAM,WAAW;oBACvB,UAAUY;kCAEd,oBAACI,eAAaA;oBACV,UAAUJ;oBACV,OAAOC,KAAK,KAAK;oBACjB,UAAUA,KAAK,QAAQ;oBACvB,KAAKf,OAAOW,KAAK,IAAI,CAAC,EAAE,EAAET;oBAC1B,aAAaA,MAAM,WAAW;oBAC9B,eAAa,CAAC,iBAAiB,EAAEA,MAAM,KAAK,EAAE;oBAEjDA,MAAM,IAAI,GAAG,WAAH,GACP,oBAACiB,mBAAiBA;oBAAC,MAAMjB,MAAM,IAAI;oBAAE,UAAUY;qBAC/C;QAM5B;IACJ;AACJ;AAEA,yBAAeV"}
@@ -3,7 +3,7 @@ import get from "lodash/get.js";
3
3
  import { i18n } from "@webiny/app/i18n/index.js";
4
4
  import { ReactComponent } from "@webiny/icons/delete_outline.svg";
5
5
  import DynamicSection from "../DynamicSection.js";
6
- import { LexicalCmsEditor } from "../../../components/LexicalCmsEditor/LexicalCmsEditor.js";
6
+ import { LexicalEditor } from "../../../components/LexicalCmsEditor/LexicalEditor.js";
7
7
  import { useForm } from "@webiny/form";
8
8
  import { MultiValueRendererSettings } from "../MultiValueRendererSettings.js";
9
9
  import { IconButton } from "@webiny/admin-ui";
@@ -37,7 +37,7 @@ const lexicalTextInputs_plugin = {
37
37
  disabled: disabled
38
38
  }, ({ bind, index })=>/*#__PURE__*/ react.createElement("div", {
39
39
  className: "relative"
40
- }, /*#__PURE__*/ react.createElement(LexicalCmsEditor, {
40
+ }, /*#__PURE__*/ react.createElement(LexicalEditor, {
41
41
  disabled: disabled,
42
42
  value: bind.index.value,
43
43
  onChange: bind.index.onChange,
@@ -1 +1 @@
1
- {"version":3,"file":"admin/plugins/fieldRenderers/lexicalText/lexicalTextInputs.js","sources":["../../../../../src/admin/plugins/fieldRenderers/lexicalText/lexicalTextInputs.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport type { CmsModelField, CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete_outline.svg\";\nimport DynamicSection from \"../DynamicSection.js\";\nimport { LexicalCmsEditor } from \"~/admin/components/LexicalCmsEditor/LexicalCmsEditor.js\";\nimport { useForm } from \"@webiny/form\";\nimport { MultiValueRendererSettings } from \"~/admin/plugins/fieldRenderers/MultiValueRendererSettings.js\";\nimport { IconButton } from \"@webiny/admin-ui\";\nimport {\n CanEditField,\n useFieldEffectiveRules,\n useModelField\n} from \"@webiny/app-headless-cms-common\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/rich-text\");\n\nconst getKey = (id: string | undefined, field: CmsModelField, index: number): string => {\n const formId = id || \"new\";\n return `${formId}.${field.fieldId}.${index}`;\n};\n\nconst plugin: CmsModelFieldRendererPlugin = {\n type: \"cms-editor-field-renderer\",\n name: \"cms-editor-field-renderer-lexical-inputs\",\n renderer: {\n rendererName: \"lexical-text-inputs\",\n name: t`Lexical Text Inputs`,\n description: t`Renders a list of lexical editors.`,\n canUse({ field }) {\n return [\n field.type === \"rich-text\",\n !!field.list,\n !get(field, \"predefinedValues.enabled\")\n ].every(Boolean);\n },\n render(props) {\n const { field } = useModelField();\n const rules = useFieldEffectiveRules(field);\n const form = useForm();\n\n const disabled = !rules.canEdit || rules.disabled;\n\n return (\n <DynamicSection {...props} disabled={disabled}>\n {({ bind, index }) => (\n <div className={\"relative\"}>\n <LexicalCmsEditor\n disabled={disabled}\n value={bind.index.value}\n onChange={bind.index.onChange}\n key={getKey(form.data.id, field, index)}\n placeholder={field.placeholder}\n />\n <CanEditField>\n <div className={\"absolute top-sm right-sm z-10\"}>\n <IconButton\n variant={\"ghost\"}\n size={\"md\"}\n icon={<DeleteIcon />}\n onClick={() => bind.field.removeValue(index)}\n />\n </div>\n </CanEditField>\n </div>\n )}\n </DynamicSection>\n );\n },\n renderSettings(props) {\n return <MultiValueRendererSettings {...props} />;\n }\n }\n};\n\nexport default plugin;\n"],"names":["t","i18n","getKey","id","field","index","formId","plugin","get","Boolean","props","useModelField","rules","useFieldEffectiveRules","form","useForm","disabled","DynamicSection","bind","LexicalCmsEditor","CanEditField","IconButton","DeleteIcon","MultiValueRendererSettings"],"mappings":";;;;;;;;;;AAgBA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAElB,MAAMC,SAAS,CAACC,IAAwBC,OAAsBC;IAC1D,MAAMC,SAASH,MAAM;IACrB,OAAO,GAAGG,OAAO,CAAC,EAAEF,MAAM,OAAO,CAAC,CAAC,EAAEC,OAAO;AAChD;AAEA,MAAME,2BAAsC;IACxC,MAAM;IACN,MAAM;IACN,UAAU;QACN,cAAc;QACd,MAAMP,CAAC,CAAC,mBAAmB,CAAC;QAC5B,aAAaA,CAAC,CAAC,kCAAkC,CAAC;QAClD,QAAO,EAAEI,KAAK,EAAE;YACZ,OAAO;gBACY,gBAAfA,MAAM,IAAI;gBACV,CAAC,CAACA,MAAM,IAAI;gBACZ,CAACI,IAAIJ,OAAO;aACf,CAAC,KAAK,CAACK;QACZ;QACA,QAAOC,KAAK;YACR,MAAM,EAAEN,KAAK,EAAE,GAAGO;YAClB,MAAMC,QAAQC,uBAAuBT;YACrC,MAAMU,OAAOC;YAEb,MAAMC,WAAW,CAACJ,MAAM,OAAO,IAAIA,MAAM,QAAQ;YAEjD,OAAO,WAAP,GACI,oBAACK,gBAAcA;gBAAE,GAAGP,KAAK;gBAAE,UAAUM;eAChC,CAAC,EAAEE,IAAI,EAAEb,KAAK,EAAE,iBACb,oBAAC;oBAAI,WAAW;iCACZ,oBAACc,kBAAgBA;oBACb,UAAUH;oBACV,OAAOE,KAAK,KAAK,CAAC,KAAK;oBACvB,UAAUA,KAAK,KAAK,CAAC,QAAQ;oBAC7B,KAAKhB,OAAOY,KAAK,IAAI,CAAC,EAAE,EAAEV,OAAOC;oBACjC,aAAaD,MAAM,WAAW;kCAElC,oBAACgB,cAAYA,MAAAA,WAAAA,GACT,oBAAC;oBAAI,WAAW;iCACZ,oBAACC,YAAUA;oBACP,SAAS;oBACT,MAAM;oBACN,oBAAM,oBAACC,gBAAUA;oBACjB,SAAS,IAAMJ,KAAK,KAAK,CAAC,WAAW,CAACb;;QAQtE;QACA,gBAAeK,KAAK;YAChB,OAAO,WAAP,GAAO,oBAACa,4BAA+Bb;QAC3C;IACJ;AACJ;AAEA,0BAAeH"}
1
+ {"version":3,"file":"admin/plugins/fieldRenderers/lexicalText/lexicalTextInputs.js","sources":["../../../../../src/admin/plugins/fieldRenderers/lexicalText/lexicalTextInputs.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport type { CmsModelField, CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete_outline.svg\";\nimport DynamicSection from \"../DynamicSection.js\";\nimport { LexicalEditor } from \"~/admin/components/LexicalCmsEditor/LexicalEditor.js\";\nimport { useForm } from \"@webiny/form\";\nimport { MultiValueRendererSettings } from \"~/admin/plugins/fieldRenderers/MultiValueRendererSettings.js\";\nimport { IconButton } from \"@webiny/admin-ui\";\nimport {\n CanEditField,\n useFieldEffectiveRules,\n useModelField\n} from \"@webiny/app-headless-cms-common\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/rich-text\");\n\nconst getKey = (id: string | undefined, field: CmsModelField, index: number): string => {\n const formId = id || \"new\";\n return `${formId}.${field.fieldId}.${index}`;\n};\n\nconst plugin: CmsModelFieldRendererPlugin = {\n type: \"cms-editor-field-renderer\",\n name: \"cms-editor-field-renderer-lexical-inputs\",\n renderer: {\n rendererName: \"lexical-text-inputs\",\n name: t`Lexical Text Inputs`,\n description: t`Renders a list of lexical editors.`,\n canUse({ field }) {\n return [\n field.type === \"rich-text\",\n !!field.list,\n !get(field, \"predefinedValues.enabled\")\n ].every(Boolean);\n },\n render(props) {\n const { field } = useModelField();\n const rules = useFieldEffectiveRules(field);\n const form = useForm();\n\n const disabled = !rules.canEdit || rules.disabled;\n\n return (\n <DynamicSection {...props} disabled={disabled}>\n {({ bind, index }) => (\n <div className={\"relative\"}>\n <LexicalEditor\n disabled={disabled}\n value={bind.index.value}\n onChange={bind.index.onChange}\n key={getKey(form.data.id, field, index)}\n placeholder={field.placeholder}\n />\n <CanEditField>\n <div className={\"absolute top-sm right-sm z-10\"}>\n <IconButton\n variant={\"ghost\"}\n size={\"md\"}\n icon={<DeleteIcon />}\n onClick={() => bind.field.removeValue(index)}\n />\n </div>\n </CanEditField>\n </div>\n )}\n </DynamicSection>\n );\n },\n renderSettings(props) {\n return <MultiValueRendererSettings {...props} />;\n }\n }\n};\n\nexport default plugin;\n"],"names":["t","i18n","getKey","id","field","index","formId","plugin","get","Boolean","props","useModelField","rules","useFieldEffectiveRules","form","useForm","disabled","DynamicSection","bind","LexicalEditor","CanEditField","IconButton","DeleteIcon","MultiValueRendererSettings"],"mappings":";;;;;;;;;;AAgBA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAElB,MAAMC,SAAS,CAACC,IAAwBC,OAAsBC;IAC1D,MAAMC,SAASH,MAAM;IACrB,OAAO,GAAGG,OAAO,CAAC,EAAEF,MAAM,OAAO,CAAC,CAAC,EAAEC,OAAO;AAChD;AAEA,MAAME,2BAAsC;IACxC,MAAM;IACN,MAAM;IACN,UAAU;QACN,cAAc;QACd,MAAMP,CAAC,CAAC,mBAAmB,CAAC;QAC5B,aAAaA,CAAC,CAAC,kCAAkC,CAAC;QAClD,QAAO,EAAEI,KAAK,EAAE;YACZ,OAAO;gBACY,gBAAfA,MAAM,IAAI;gBACV,CAAC,CAACA,MAAM,IAAI;gBACZ,CAACI,IAAIJ,OAAO;aACf,CAAC,KAAK,CAACK;QACZ;QACA,QAAOC,KAAK;YACR,MAAM,EAAEN,KAAK,EAAE,GAAGO;YAClB,MAAMC,QAAQC,uBAAuBT;YACrC,MAAMU,OAAOC;YAEb,MAAMC,WAAW,CAACJ,MAAM,OAAO,IAAIA,MAAM,QAAQ;YAEjD,OAAO,WAAP,GACI,oBAACK,gBAAcA;gBAAE,GAAGP,KAAK;gBAAE,UAAUM;eAChC,CAAC,EAAEE,IAAI,EAAEb,KAAK,EAAE,iBACb,oBAAC;oBAAI,WAAW;iCACZ,oBAACc,eAAaA;oBACV,UAAUH;oBACV,OAAOE,KAAK,KAAK,CAAC,KAAK;oBACvB,UAAUA,KAAK,KAAK,CAAC,QAAQ;oBAC7B,KAAKhB,OAAOY,KAAK,IAAI,CAAC,EAAE,EAAEV,OAAOC;oBACjC,aAAaD,MAAM,WAAW;kCAElC,oBAACgB,cAAYA,MAAAA,WAAAA,GACT,oBAAC;oBAAI,WAAW;iCACZ,oBAACC,YAAUA;oBACP,SAAS;oBACT,MAAM;oBACN,oBAAM,oBAACC,gBAAUA;oBACjB,SAAS,IAAMJ,KAAK,KAAK,CAAC,WAAW,CAACb;;QAQtE;QACA,gBAAeK,KAAK;YAChB,OAAO,WAAP,GAAO,oBAACa,4BAA+Bb;QAC3C;IACJ;AACJ;AAEA,0BAAeH"}
@@ -1,16 +1,18 @@
1
+ export { LexicalEditor } from "../../../admin/components/LexicalCmsEditor/LexicalEditor.js";
2
+ export type { LexicalEditorProps } from "../../../admin/components/LexicalCmsEditor/LexicalEditor.js";
1
3
  export { LexicalEditorConfig } from "../../../admin/lexicalConfig/LexicalEditorConfig.js";
2
- export { useLexicalEditorConfig } from "@webiny/lexical-editor/exports/admin/lexical.js";
3
- export { LexicalHtmlRenderer } from "@webiny/lexical-editor/exports/admin/lexical.js";
4
- export { getNodeFromSelection } from "@webiny/lexical-editor/exports/admin/lexical.js";
5
- export { useCurrentElement } from "@webiny/lexical-editor/exports/admin/lexical.js";
6
- export { useCurrentSelection } from "@webiny/lexical-editor/exports/admin/lexical.js";
7
- export { useDeriveValueFromSelection } from "@webiny/lexical-editor/exports/admin/lexical.js";
8
- export { useRichTextEditor } from "@webiny/lexical-editor/exports/admin/lexical.js";
9
- export { useFontColorPicker } from "@webiny/lexical-editor/exports/admin/lexical.js";
10
- export { useTextAlignmentAction } from "@webiny/lexical-editor/exports/admin/lexical.js";
11
- export { useTypographyAction } from "@webiny/lexical-editor/exports/admin/lexical.js";
12
- export { useIsMounted } from "@webiny/lexical-editor/exports/admin/lexical.js";
13
- export { Divider } from "@webiny/lexical-editor/exports/admin/lexical.js";
14
- export { DropDownItem } from "@webiny/lexical-editor/exports/admin/lexical.js";
15
- export { DropDown } from "@webiny/lexical-editor/exports/admin/lexical.js";
16
- export type { Klass, LexicalNode } from "@webiny/lexical-editor/exports/admin/lexical.js";
4
+ export { useLexicalEditorConfig } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
5
+ export { LexicalHtmlRenderer } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
6
+ export { getNodeFromSelection } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
7
+ export { useCurrentElement } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
8
+ export { useCurrentSelection } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
9
+ export { useDeriveValueFromSelection } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
10
+ export { useRichTextEditor } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
11
+ export { useFontColorPicker } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
12
+ export { useTextAlignmentAction } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
13
+ export { useTypographyAction } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
14
+ export { useIsMounted } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
15
+ export { Divider } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
16
+ export { DropDownItem } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
17
+ export { DropDown } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
18
+ export type { Klass, LexicalNode } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
@@ -1,2 +1,3 @@
1
+ export { LexicalEditor } from "../../../admin/components/LexicalCmsEditor/LexicalEditor.js";
1
2
  export { LexicalEditorConfig } from "../../../admin/lexicalConfig/LexicalEditorConfig.js";
2
- export { Divider, DropDown, DropDownItem, LexicalHtmlRenderer, getNodeFromSelection, useCurrentElement, useCurrentSelection, useDeriveValueFromSelection, useFontColorPicker, useIsMounted, useLexicalEditorConfig, useRichTextEditor, useTextAlignmentAction, useTypographyAction } from "@webiny/lexical-editor/exports/admin/lexical.js";
3
+ export { Divider, DropDown, DropDownItem, LexicalHtmlRenderer, getNodeFromSelection, useCurrentElement, useCurrentSelection, useDeriveValueFromSelection, useFontColorPicker, useIsMounted, useLexicalEditorConfig, useRichTextEditor, useTextAlignmentAction, useTypographyAction } from "@webiny/lexical-editor/exports/admin/ui/lexical.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webiny/app-headless-cms",
3
- "version": "6.4.0-beta.2",
3
+ "version": "6.4.0-beta.4",
4
4
  "type": "module",
5
5
  "exports": {
6
6
  ".": "./index.js",
@@ -30,26 +30,26 @@
30
30
  "@fortawesome/react-fontawesome": "3.3.1",
31
31
  "@lexical/utils": "0.44.0",
32
32
  "@svgr/webpack": "8.1.0",
33
- "@types/react": "18.3.28",
34
- "@webiny/admin-ui": "6.4.0-beta.2",
35
- "@webiny/app": "6.4.0-beta.2",
36
- "@webiny/app-aco": "6.4.0-beta.2",
37
- "@webiny/app-admin": "6.4.0-beta.2",
38
- "@webiny/app-graphql-playground": "6.4.0-beta.2",
39
- "@webiny/app-headless-cms-common": "6.4.0-beta.2",
40
- "@webiny/app-trash-bin": "6.4.0-beta.2",
41
- "@webiny/error": "6.4.0-beta.2",
42
- "@webiny/feature": "6.4.0-beta.2",
43
- "@webiny/form": "6.4.0-beta.2",
44
- "@webiny/icons": "6.4.0-beta.2",
45
- "@webiny/lexical-converter": "6.4.0-beta.2",
46
- "@webiny/lexical-editor": "6.4.0-beta.2",
47
- "@webiny/lexical-nodes": "6.4.0-beta.2",
48
- "@webiny/plugins": "6.4.0-beta.2",
49
- "@webiny/react-composition": "6.4.0-beta.2",
50
- "@webiny/react-properties": "6.4.0-beta.2",
51
- "@webiny/utils": "6.4.0-beta.2",
52
- "@webiny/validation": "6.4.0-beta.2",
33
+ "@types/react": "18.3.29",
34
+ "@webiny/admin-ui": "6.4.0-beta.4",
35
+ "@webiny/app": "6.4.0-beta.4",
36
+ "@webiny/app-aco": "6.4.0-beta.4",
37
+ "@webiny/app-admin": "6.4.0-beta.4",
38
+ "@webiny/app-graphql-playground": "6.4.0-beta.4",
39
+ "@webiny/app-headless-cms-common": "6.4.0-beta.4",
40
+ "@webiny/app-trash-bin": "6.4.0-beta.4",
41
+ "@webiny/error": "6.4.0-beta.4",
42
+ "@webiny/feature": "6.4.0-beta.4",
43
+ "@webiny/form": "6.4.0-beta.4",
44
+ "@webiny/icons": "6.4.0-beta.4",
45
+ "@webiny/lexical-converter": "6.4.0-beta.4",
46
+ "@webiny/lexical-editor": "6.4.0-beta.4",
47
+ "@webiny/lexical-nodes": "6.4.0-beta.4",
48
+ "@webiny/plugins": "6.4.0-beta.4",
49
+ "@webiny/react-composition": "6.4.0-beta.4",
50
+ "@webiny/react-properties": "6.4.0-beta.4",
51
+ "@webiny/utils": "6.4.0-beta.4",
52
+ "@webiny/validation": "6.4.0-beta.4",
53
53
  "apollo-cache": "1.3.5",
54
54
  "apollo-client": "2.6.10",
55
55
  "apollo-link": "1.2.14",
@@ -71,14 +71,13 @@
71
71
  "zod": "4.4.3"
72
72
  },
73
73
  "devDependencies": {
74
- "@webiny/build-tools": "6.4.0-beta.2",
74
+ "@webiny/build-tools": "6.4.0-beta.4",
75
75
  "rimraf": "6.1.3",
76
76
  "typescript": "6.0.3",
77
- "vitest": "4.1.6"
77
+ "vitest": "4.1.7"
78
78
  },
79
79
  "publishConfig": {
80
- "access": "public",
81
- "directory": "dist"
80
+ "access": "public"
82
81
  },
83
82
  "adio": {
84
83
  "ignore": {
@@ -95,5 +94,8 @@
95
94
  ]
96
95
  }
97
96
  },
98
- "gitHead": "872f9f50baa1ff6915a5f338216f84bf0b6dfd24"
97
+ "gitHead": "8476da73b653c89cc1474d968baf55c1b0ae0e5f",
98
+ "webiny": {
99
+ "publishFrom": "dist"
100
+ }
99
101
  }
@@ -1,3 +0,0 @@
1
- import React from "react";
2
- import { LexicalEditor } from "@webiny/app-admin";
3
- export declare const LexicalCmsEditor: (props: Omit<LexicalEditor.Props, "theme">) => React.JSX.Element;
@@ -1 +0,0 @@
1
- {"version":3,"file":"admin/components/LexicalCmsEditor/LexicalCmsEditor.js","sources":["../../../../src/admin/components/LexicalCmsEditor/LexicalCmsEditor.tsx"],"sourcesContent":["import React from \"react\";\nimport { StaticToolbar } from \"@webiny/lexical-editor\";\nimport { LexicalEditor } from \"@webiny/app-admin\";\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\nconst toolbar = <StaticToolbar />;\n\nexport const LexicalCmsEditor = (props: Omit<LexicalEditor.Props, \"theme\">) => {\n return (\n <LexicalEditor\n {...props}\n focus={true}\n staticToolbar={toolbar}\n tag={\"p\"}\n placeholder={props?.placeholder || \"Enter your text here...\"}\n placeholderStyles={placeholderStyles}\n contentEditableStyles={contentEditableStyles}\n styles={styles}\n />\n );\n};\n"],"names":["placeholderStyles","contentEditableStyles","styles","toolbar","StaticToolbar","LexicalCmsEditor","props","LexicalEditor"],"mappings":";;;AAIA,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;AAEA,MAAMC,UAAU,WAAHA,GAAG,oBAACC,eAAaA;AAEvB,MAAMC,mBAAmB,CAACC,QACtB,WAAP,GACI,oBAACC,eAAaA;QACT,GAAGD,KAAK;QACT,OAAO;QACP,eAAeH;QACf,KAAK;QACL,aAAaG,OAAO,eAAe;QACnC,mBAAmBN;QACnB,uBAAuBC;QACvB,QAAQC"}
@@ -1,25 +0,0 @@
1
- import React from "react";
2
- import type { CmsDynamicZoneTemplate } from "../../../../types.js";
3
- export interface TemplateCardProps {
4
- template: CmsDynamicZoneTemplate;
5
- onTemplate: (template: CmsDynamicZoneTemplate) => void;
6
- }
7
- export declare const TemplateItem: (({ template, onTemplate }: TemplateCardProps) => React.JSX.Element) & {
8
- original: ({ template, onTemplate }: TemplateCardProps) => React.JSX.Element;
9
- originalName: string;
10
- displayName: string;
11
- } & {
12
- original: (({ template, onTemplate }: TemplateCardProps) => React.JSX.Element) & {
13
- original: ({ template, onTemplate }: TemplateCardProps) => React.JSX.Element;
14
- originalName: string;
15
- displayName: string;
16
- };
17
- originalName: string;
18
- displayName: string;
19
- } & {
20
- createDecorator: (decorator: import("@webiny/app-admin").ComponentDecorator<(({ template, onTemplate }: TemplateCardProps) => React.JSX.Element) & {
21
- original: ({ template, onTemplate }: TemplateCardProps) => React.JSX.Element;
22
- originalName: string;
23
- displayName: string;
24
- }>) => (props: unknown) => React.JSX.Element;
25
- };
@@ -1 +0,0 @@
1
- {"version":3,"file":"admin/plugins/fieldRenderers/dynamicZone/TemplateItem.js","sources":["../../../../../src/admin/plugins/fieldRenderers/dynamicZone/TemplateItem.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport type { CmsDynamicZoneTemplate } from \"~/types.js\";\nimport { TemplateIcon } from \"~/admin/plugins/fieldRenderers/dynamicZone/TemplateIcon.js\";\nimport { Text, Button } from \"@webiny/admin-ui\";\nimport { Dialog } from \"@webiny/admin-ui\";\nimport { ReactComponent as PlusIcon } from \"@webiny/icons/add_circle_outline.svg\";\n\nexport interface TemplateCardProps {\n template: CmsDynamicZoneTemplate;\n onTemplate: (template: CmsDynamicZoneTemplate) => void;\n}\n\nexport const TemplateItem = makeDecoratable(\n \"TemplateItem\",\n ({ template, onTemplate }: TemplateCardProps) => {\n const [isHovered, setIsHovered] = useState(false);\n\n return (\n <div\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n className={\n \"flex flex-col justify-between bg-neutral-base overflow-hidden rounded-lg w-[173px] relative shadow-sm\"\n }\n >\n <div>\n <div\n className={\n \"flex items-center justify-center py-xxl w-full bg-neutral-dimmed\"\n }\n >\n <TemplateIcon icon={template.icon} style={{ width: 40, height: 40 }} />\n </div>\n <div className={\"py-sm-extra px-md\"}>\n <Text size={\"md\"} className={\"mb-xs text-neutral-primary font-semibold\"}>\n {template.name}\n </Text>\n <Text size={\"sm\"} as={\"div\"} className={\"text-neutral-muted\"}>\n {template.description}\n </Text>\n </div>\n </div>\n\n {isHovered && (\n <Dialog.Close asChild>\n <div\n className=\"absolute inset-0 flex items-center justify-center bg-white/80 cursor-pointer\"\n onClick={() => onTemplate(template)}\n >\n <Button size={\"lg\"} variant=\"primary\" icon={<PlusIcon />}>\n Insert\n </Button>\n </div>\n </Dialog.Close>\n )}\n </div>\n );\n }\n);\n"],"names":["TemplateItem","makeDecoratable","template","onTemplate","isHovered","setIsHovered","useState","TemplateIcon","Text","Dialog","Button","PlusIcon"],"mappings":";;;;;AAaO,MAAMA,eAAeC,gBACxB,gBACA,CAAC,EAAEC,QAAQ,EAAEC,UAAU,EAAqB;IACxC,MAAM,CAACC,WAAWC,aAAa,GAAGC,SAAS;IAE3C,OAAO,WAAP,GACI,oBAAC;QACG,cAAc,IAAMD,aAAa;QACjC,cAAc,IAAMA,aAAa;QACjC,WACI;qBAGJ,oBAAC,2BACG,oBAAC;QACG,WACI;qBAGJ,oBAACE,cAAYA;QAAC,MAAML,SAAS,IAAI;QAAE,OAAO;YAAE,OAAO;YAAI,QAAQ;QAAG;uBAEtE,oBAAC;QAAI,WAAW;qBACZ,oBAACM,MAAIA;QAAC,MAAM;QAAM,WAAW;OACxBN,SAAS,IAAI,iBAElB,oBAACM,MAAIA;QAAC,MAAM;QAAM,IAAI;QAAO,WAAW;OACnCN,SAAS,WAAW,KAKhCE,aAAa,WAAbA,GACG,oBAACK,OAAO,KAAK;QAAC;qBACV,oBAAC;QACG,WAAU;QACV,SAAS,IAAMN,WAAWD;qBAE1B,oBAACQ,QAAMA;QAAC,MAAM;QAAM,SAAQ;QAAU,oBAAM,oBAACC,gBAAQA;OAAK;AAQlF"}