@webiny/app-headless-cms 6.4.6 → 6.4.7-beta.0

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.
@@ -8,6 +8,7 @@ const SidebarContent = ()=>{
8
8
  className: "flex-1 overflow-y-scroll"
9
9
  }, /*#__PURE__*/ react.createElement(FolderTree, {
10
10
  folderActions: browser.folder.actions,
11
+ dropConfirmation: browser.folder.dropConfirmation,
11
12
  focusedFolderId: currentFolderId,
12
13
  onFolderClick: (data)=>navigateToFolder(data.id),
13
14
  enableActions: true,
@@ -1 +1 @@
1
- {"version":3,"file":"admin/components/ContentEntries/SidebarContent/SidebarContent.js","sources":["../../../../../src/admin/components/ContentEntries/SidebarContent/SidebarContent.tsx"],"sourcesContent":["import React from \"react\";\nimport { FolderTree, useNavigateFolder } from \"@webiny/app-aco\";\nimport { useContentEntryListConfig } from \"~/admin/config/contentEntries/index.js\";\n\nexport const SidebarContent = () => {\n const { browser } = useContentEntryListConfig();\n const { navigateToFolder, currentFolderId } = useNavigateFolder();\n\n return (\n <div className={\"flex-1 overflow-y-scroll\"}>\n <FolderTree\n folderActions={browser.folder.actions}\n focusedFolderId={currentFolderId}\n onFolderClick={data => navigateToFolder(data.id)}\n enableActions={true}\n enableCreate={true}\n />\n </div>\n );\n};\n"],"names":["SidebarContent","browser","useContentEntryListConfig","navigateToFolder","currentFolderId","useNavigateFolder","FolderTree","data"],"mappings":";;;AAIO,MAAMA,iBAAiB;IAC1B,MAAM,EAAEC,OAAO,EAAE,GAAGC;IACpB,MAAM,EAAEC,gBAAgB,EAAEC,eAAe,EAAE,GAAGC;IAE9C,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;qBACZ,oBAACC,YAAUA;QACP,eAAeL,QAAQ,MAAM,CAAC,OAAO;QACrC,iBAAiBG;QACjB,eAAeG,CAAAA,OAAQJ,iBAAiBI,KAAK,EAAE;QAC/C,eAAe;QACf,cAAc;;AAI9B"}
1
+ {"version":3,"file":"admin/components/ContentEntries/SidebarContent/SidebarContent.js","sources":["../../../../../src/admin/components/ContentEntries/SidebarContent/SidebarContent.tsx"],"sourcesContent":["import React from \"react\";\nimport { FolderTree, useNavigateFolder } from \"@webiny/app-aco\";\nimport { useContentEntryListConfig } from \"~/admin/config/contentEntries/index.js\";\n\nexport const SidebarContent = () => {\n const { browser } = useContentEntryListConfig();\n const { navigateToFolder, currentFolderId } = useNavigateFolder();\n\n return (\n <div className={\"flex-1 overflow-y-scroll\"}>\n <FolderTree\n folderActions={browser.folder.actions}\n dropConfirmation={browser.folder.dropConfirmation}\n focusedFolderId={currentFolderId}\n onFolderClick={data => navigateToFolder(data.id)}\n enableActions={true}\n enableCreate={true}\n />\n </div>\n );\n};\n"],"names":["SidebarContent","browser","useContentEntryListConfig","navigateToFolder","currentFolderId","useNavigateFolder","FolderTree","data"],"mappings":";;;AAIO,MAAMA,iBAAiB;IAC1B,MAAM,EAAEC,OAAO,EAAE,GAAGC;IACpB,MAAM,EAAEC,gBAAgB,EAAEC,eAAe,EAAE,GAAGC;IAE9C,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;qBACZ,oBAACC,YAAUA;QACP,eAAeL,QAAQ,MAAM,CAAC,OAAO;QACrC,kBAAkBA,QAAQ,MAAM,CAAC,gBAAgB;QACjD,iBAAiBG;QACjB,eAAeG,CAAAA,OAAQJ,iBAAiBI,KAAK,EAAE;QAC/C,eAAe;QACf,cAAc;;AAI9B"}
@@ -25,7 +25,7 @@ const TemplateGridItem = makeDecoratable("TemplateGridItem", ({ template, onTemp
25
25
  }, template.name), /*#__PURE__*/ react.createElement(Text, {
26
26
  size: "sm",
27
27
  as: "div",
28
- className: "text-neutral-muted"
28
+ className: "text-neutral-muted line-clamp-2"
29
29
  }, template.description))), isHovered && /*#__PURE__*/ react.createElement(Dialog.Close, {
30
30
  asChild: true
31
31
  }, /*#__PURE__*/ react.createElement("div", {
@@ -1 +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"}
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 line-clamp-2\"}>\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"}
@@ -23,7 +23,7 @@ const TemplateListItem = ({ template, onTemplate })=>/*#__PURE__*/ react.createE
23
23
  }, template.name), template.description && /*#__PURE__*/ react.createElement(Text, {
24
24
  size: "sm",
25
25
  as: "div",
26
- className: "text-neutral-muted truncate"
26
+ className: "text-neutral-muted"
27
27
  }, template.description)), /*#__PURE__*/ react.createElement("div", {
28
28
  className: "hidden group-hover:block"
29
29
  }, /*#__PURE__*/ react.createElement(Button, {
@@ -1 +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"}
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\"}>\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"}
@@ -1,7 +1,8 @@
1
- import react, { useEffect, useRef } from "react";
1
+ import react, { useCallback, useEffect, useRef, useState } from "react";
2
2
  import { Accordion } from "@webiny/admin-ui";
3
3
  import { AddTemplateButton, AddTemplateIcon } from "./AddTemplate.js";
4
4
  import { DynamicZoneTemplate } from "./DynamicZoneTemplate.js";
5
+ import { TemplateDialog } from "./TemplateDialog.js";
5
6
  import { useModelField, useModelFieldEditor } from "../../../hooks/index.js";
6
7
  function updateOrCreateTemplate(templates, template) {
7
8
  const templateIndex = templates.findIndex((tpl)=>tpl.id === template.id);
@@ -19,6 +20,7 @@ const DynamicZone = ()=>{
19
20
  const { field } = useModelField();
20
21
  const { updateField } = useModelFieldEditor();
21
22
  const newTemplateId = useRef(void 0);
23
+ const [templateToEdit, setTemplateToEdit] = useState(void 0);
22
24
  const templates = field.settings?.templates || [];
23
25
  const onTemplate = (template)=>{
24
26
  const templates = field.settings?.templates || [];
@@ -31,16 +33,24 @@ const DynamicZone = ()=>{
31
33
  }
32
34
  });
33
35
  };
36
+ const onDialogClose = useCallback(()=>{
37
+ setTemplateToEdit(void 0);
38
+ }, []);
34
39
  useEffect(()=>{
35
40
  newTemplateId.current = void 0;
36
41
  }, []);
37
- return /*#__PURE__*/ react.createElement(react.Fragment, null, templates.length ? /*#__PURE__*/ react.createElement(Accordion, null, templates.map((template, index)=>/*#__PURE__*/ react.createElement(DynamicZoneTemplate, {
42
+ return /*#__PURE__*/ react.createElement(react.Fragment, null, templateToEdit ? /*#__PURE__*/ react.createElement(TemplateDialog, {
43
+ template: templateToEdit,
44
+ onTemplate: onTemplate,
45
+ onClose: onDialogClose
46
+ }) : null, templates.length ? /*#__PURE__*/ react.createElement(Accordion, null, templates.map((template, index)=>/*#__PURE__*/ react.createElement(DynamicZoneTemplate, {
38
47
  key: template.id,
39
48
  open: template.id === newTemplateId.current,
40
49
  index: index,
41
50
  field: field,
42
51
  template: template,
43
- onChange: updateField
52
+ onChange: updateField,
53
+ onEditTemplate: setTemplateToEdit
44
54
  }))) : null, templates.length ? /*#__PURE__*/ react.createElement(AddTemplateIcon, {
45
55
  onTemplate: onTemplate
46
56
  }) : /*#__PURE__*/ react.createElement(AddTemplateButton, {
@@ -1 +1 @@
1
- {"version":3,"file":"admin/plugins/fields/dynamicZone/DynamicZone.js","sources":["../../../../../src/admin/plugins/fields/dynamicZone/DynamicZone.tsx"],"sourcesContent":["import React, { useRef, useEffect } from \"react\";\nimport { Accordion } from \"@webiny/admin-ui\";\nimport type { CmsDynamicZoneTemplate } from \"~/types.js\";\nimport { AddTemplateIcon, AddTemplateButton } from \"./AddTemplate.js\";\nimport { DynamicZoneTemplate } from \"./DynamicZoneTemplate.js\";\nimport { useModelField, useModelFieldEditor } from \"~/admin/hooks/index.js\";\n\nfunction updateOrCreateTemplate(\n templates: CmsDynamicZoneTemplate[],\n template: CmsDynamicZoneTemplate\n) {\n const templateIndex = templates.findIndex(tpl => tpl.id === template.id);\n\n if (templateIndex > -1) {\n return [\n ...templates.slice(0, templateIndex),\n template,\n ...templates.slice(templateIndex + 1)\n ];\n }\n\n return [...templates, template];\n}\n\nexport const DynamicZone = () => {\n const { field } = useModelField();\n const { updateField } = useModelFieldEditor();\n const newTemplateId = useRef<string | undefined>(undefined);\n\n const templates: CmsDynamicZoneTemplate[] = field.settings?.templates || [];\n\n const onTemplate = (template: CmsDynamicZoneTemplate) => {\n const templates = field.settings?.templates || [];\n\n newTemplateId.current = template.id;\n\n updateField({\n ...field,\n settings: {\n ...(field.settings || {}),\n templates: updateOrCreateTemplate(templates, template)\n }\n });\n };\n\n useEffect(() => {\n // We only want to open the accordion item on first mount of a new template.\n newTemplateId.current = undefined;\n }, []);\n\n return (\n <>\n {templates.length ? (\n <Accordion>\n {templates.map((template, index) => (\n <DynamicZoneTemplate\n key={template.id}\n open={template.id === newTemplateId.current}\n index={index}\n field={field}\n template={template}\n onChange={updateField}\n />\n ))}\n </Accordion>\n ) : null}\n {templates.length ? (\n <AddTemplateIcon onTemplate={onTemplate} />\n ) : (\n <AddTemplateButton onTemplate={onTemplate} />\n )}\n </>\n );\n};\n"],"names":["updateOrCreateTemplate","templates","template","templateIndex","tpl","DynamicZone","field","useModelField","updateField","useModelFieldEditor","newTemplateId","useRef","undefined","onTemplate","useEffect","Accordion","index","DynamicZoneTemplate","AddTemplateIcon","AddTemplateButton"],"mappings":";;;;;AAOA,SAASA,uBACLC,SAAmC,EACnCC,QAAgC;IAEhC,MAAMC,gBAAgBF,UAAU,SAAS,CAACG,CAAAA,MAAOA,IAAI,EAAE,KAAKF,SAAS,EAAE;IAEvE,IAAIC,gBAAgB,IAChB,OAAO;WACAF,UAAU,KAAK,CAAC,GAAGE;QACtBD;WACGD,UAAU,KAAK,CAACE,gBAAgB;KACtC;IAGL,OAAO;WAAIF;QAAWC;KAAS;AACnC;AAEO,MAAMG,cAAc;IACvB,MAAM,EAAEC,KAAK,EAAE,GAAGC;IAClB,MAAM,EAAEC,WAAW,EAAE,GAAGC;IACxB,MAAMC,gBAAgBC,OAA2BC;IAEjD,MAAMX,YAAsCK,MAAM,QAAQ,EAAE,aAAa,EAAE;IAE3E,MAAMO,aAAa,CAACX;QAChB,MAAMD,YAAYK,MAAM,QAAQ,EAAE,aAAa,EAAE;QAEjDI,cAAc,OAAO,GAAGR,SAAS,EAAE;QAEnCM,YAAY;YACR,GAAGF,KAAK;YACR,UAAU;gBACN,GAAIA,MAAM,QAAQ,IAAI,CAAC,CAAC;gBACxB,WAAWN,uBAAuBC,WAAWC;YACjD;QACJ;IACJ;IAEAY,UAAU;QAENJ,cAAc,OAAO,GAAGE;IAC5B,GAAG,EAAE;IAEL,OAAO,WAAP,GACI,0CACKX,UAAU,MAAM,GAAG,WAAH,GACb,oBAACc,WAASA,MACLd,UAAU,GAAG,CAAC,CAACC,UAAUc,QAAAA,WAAAA,GACtB,oBAACC,qBAAmBA;YAChB,KAAKf,SAAS,EAAE;YAChB,MAAMA,SAAS,EAAE,KAAKQ,cAAc,OAAO;YAC3C,OAAOM;YACP,OAAOV;YACP,UAAUJ;YACV,UAAUM;eAItB,MACHP,UAAU,MAAM,GAAG,WAAH,GACb,oBAACiB,iBAAeA;QAAC,YAAYL;uBAE7B,oBAACM,mBAAiBA;QAAC,YAAYN;;AAI/C"}
1
+ {"version":3,"file":"admin/plugins/fields/dynamicZone/DynamicZone.js","sources":["../../../../../src/admin/plugins/fields/dynamicZone/DynamicZone.tsx"],"sourcesContent":["import React, { useRef, useEffect, useState, useCallback } from \"react\";\nimport { Accordion } from \"@webiny/admin-ui\";\nimport type { CmsDynamicZoneTemplate } from \"~/types.js\";\nimport { AddTemplateIcon, AddTemplateButton } from \"./AddTemplate.js\";\nimport { DynamicZoneTemplate } from \"./DynamicZoneTemplate.js\";\nimport { TemplateDialog } from \"./TemplateDialog.js\";\nimport { useModelField, useModelFieldEditor } from \"~/admin/hooks/index.js\";\n\nfunction updateOrCreateTemplate(\n templates: CmsDynamicZoneTemplate[],\n template: CmsDynamicZoneTemplate\n) {\n const templateIndex = templates.findIndex(tpl => tpl.id === template.id);\n\n if (templateIndex > -1) {\n return [\n ...templates.slice(0, templateIndex),\n template,\n ...templates.slice(templateIndex + 1)\n ];\n }\n\n return [...templates, template];\n}\n\nexport const DynamicZone = () => {\n const { field } = useModelField();\n const { updateField } = useModelFieldEditor();\n const newTemplateId = useRef<string | undefined>(undefined);\n const [templateToEdit, setTemplateToEdit] = useState<CmsDynamicZoneTemplate | undefined>(\n undefined\n );\n\n const templates: CmsDynamicZoneTemplate[] = field.settings?.templates || [];\n\n const onTemplate = (template: CmsDynamicZoneTemplate) => {\n const templates = field.settings?.templates || [];\n\n newTemplateId.current = template.id;\n\n updateField({\n ...field,\n settings: {\n ...(field.settings || {}),\n templates: updateOrCreateTemplate(templates, template)\n }\n });\n };\n\n const onDialogClose = useCallback(() => {\n setTemplateToEdit(undefined);\n }, []);\n\n useEffect(() => {\n newTemplateId.current = undefined;\n }, []);\n\n return (\n <>\n {templateToEdit ? (\n <TemplateDialog\n template={templateToEdit}\n onTemplate={onTemplate}\n onClose={onDialogClose}\n />\n ) : null}\n {templates.length ? (\n <Accordion>\n {templates.map((template, index) => (\n <DynamicZoneTemplate\n key={template.id}\n open={template.id === newTemplateId.current}\n index={index}\n field={field}\n template={template}\n onChange={updateField}\n onEditTemplate={setTemplateToEdit}\n />\n ))}\n </Accordion>\n ) : null}\n {templates.length ? (\n <AddTemplateIcon onTemplate={onTemplate} />\n ) : (\n <AddTemplateButton onTemplate={onTemplate} />\n )}\n </>\n );\n};\n"],"names":["updateOrCreateTemplate","templates","template","templateIndex","tpl","DynamicZone","field","useModelField","updateField","useModelFieldEditor","newTemplateId","useRef","undefined","templateToEdit","setTemplateToEdit","useState","onTemplate","onDialogClose","useCallback","useEffect","TemplateDialog","Accordion","index","DynamicZoneTemplate","AddTemplateIcon","AddTemplateButton"],"mappings":";;;;;;AAQA,SAASA,uBACLC,SAAmC,EACnCC,QAAgC;IAEhC,MAAMC,gBAAgBF,UAAU,SAAS,CAACG,CAAAA,MAAOA,IAAI,EAAE,KAAKF,SAAS,EAAE;IAEvE,IAAIC,gBAAgB,IAChB,OAAO;WACAF,UAAU,KAAK,CAAC,GAAGE;QACtBD;WACGD,UAAU,KAAK,CAACE,gBAAgB;KACtC;IAGL,OAAO;WAAIF;QAAWC;KAAS;AACnC;AAEO,MAAMG,cAAc;IACvB,MAAM,EAAEC,KAAK,EAAE,GAAGC;IAClB,MAAM,EAAEC,WAAW,EAAE,GAAGC;IACxB,MAAMC,gBAAgBC,OAA2BC;IACjD,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGC,SACxCH;IAGJ,MAAMX,YAAsCK,MAAM,QAAQ,EAAE,aAAa,EAAE;IAE3E,MAAMU,aAAa,CAACd;QAChB,MAAMD,YAAYK,MAAM,QAAQ,EAAE,aAAa,EAAE;QAEjDI,cAAc,OAAO,GAAGR,SAAS,EAAE;QAEnCM,YAAY;YACR,GAAGF,KAAK;YACR,UAAU;gBACN,GAAIA,MAAM,QAAQ,IAAI,CAAC,CAAC;gBACxB,WAAWN,uBAAuBC,WAAWC;YACjD;QACJ;IACJ;IAEA,MAAMe,gBAAgBC,YAAY;QAC9BJ,kBAAkBF;IACtB,GAAG,EAAE;IAELO,UAAU;QACNT,cAAc,OAAO,GAAGE;IAC5B,GAAG,EAAE;IAEL,OAAO,WAAP,GACI,0CACKC,iBAAiB,WAAjBA,GACG,oBAACO,gBAAcA;QACX,UAAUP;QACV,YAAYG;QACZ,SAASC;SAEb,MACHhB,UAAU,MAAM,GAAG,WAAH,GACb,oBAACoB,WAASA,MACLpB,UAAU,GAAG,CAAC,CAACC,UAAUoB,QAAAA,WAAAA,GACtB,oBAACC,qBAAmBA;YAChB,KAAKrB,SAAS,EAAE;YAChB,MAAMA,SAAS,EAAE,KAAKQ,cAAc,OAAO;YAC3C,OAAOY;YACP,OAAOhB;YACP,UAAUJ;YACV,UAAUM;YACV,gBAAgBM;eAI5B,MACHb,UAAU,MAAM,GAAG,WAAH,GACb,oBAACuB,iBAAeA;QAAC,YAAYR;uBAE7B,oBAACS,mBAAiBA;QAAC,YAAYT;;AAI/C"}
@@ -6,6 +6,7 @@ interface DynamicZoneTemplateProps {
6
6
  template: CmsDynamicZoneTemplate;
7
7
  onChange: (field: CmsModelField) => void;
8
8
  open: boolean;
9
+ onEditTemplate: (template: CmsDynamicZoneTemplate) => void;
9
10
  }
10
- export declare const DynamicZoneTemplate: ({ index, field, template, onChange, open }: DynamicZoneTemplateProps) => React.JSX.Element;
11
+ export declare const DynamicZoneTemplate: ({ index, field, template, onChange, open, onEditTemplate }: DynamicZoneTemplateProps) => React.JSX.Element;
11
12
  export {};
@@ -1,4 +1,4 @@
1
- import react, { useCallback, useState } from "react";
1
+ import react, { useCallback } from "react";
2
2
  import { set } from "dot-prop-immutable";
3
3
  import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
4
4
  import { ReactComponent } from "@webiny/icons/edit.svg";
@@ -8,17 +8,15 @@ import { ReactComponent as expand_more_svg_ReactComponent } from "@webiny/icons/
8
8
  import { Accordion } from "@webiny/admin-ui";
9
9
  import { useConfirmationDialog } from "@webiny/app-admin";
10
10
  import { pullValueAtIndex, pushValueAtIndex, removeValueAtIndex } from "../../arrayUtils.js";
11
- import { TemplateDialog } from "./TemplateDialog.js";
12
11
  import { FieldEditor } from "../../../components/FieldEditor/index.js";
13
12
  import { normalizeIcon } from "../../../../utils/normalizeIcon.js";
14
13
  const TEMPLATES_PATH = "settings.templates";
15
- const DynamicZoneTemplate = ({ index, field, template, onChange, open })=>{
14
+ const DynamicZoneTemplate = ({ index, field, template, onChange, open, onEditTemplate })=>{
16
15
  const { showConfirmation } = useConfirmationDialog({
17
16
  title: "Delete content template",
18
17
  message: "Are you sure you want to delete this content template?",
19
18
  acceptLabel: "Yes, I'm sure!"
20
19
  });
21
- const [templateToEdit, setTemplateToEdit] = useState(void 0);
22
20
  const templates = field.settings?.templates || [];
23
21
  const isFirst = 0 === index;
24
22
  const isLast = index === templates.length - 1;
@@ -28,13 +26,11 @@ const DynamicZoneTemplate = ({ index, field, template, onChange, open })=>{
28
26
  index,
29
27
  template.id
30
28
  ];
31
- const onDialogClose = useCallback(()=>{
32
- setTemplateToEdit(void 0);
33
- }, []);
34
29
  const editTemplate = useCallback(()=>{
35
- setTemplateToEdit(template);
30
+ onEditTemplate(template);
36
31
  }, [
37
- template
32
+ template,
33
+ onEditTemplate
38
34
  ]);
39
35
  const updateTemplate = useCallback((params)=>{
40
36
  onChange(set(field, `${TEMPLATES_PATH}.${index}`, (tpl)=>({
@@ -68,7 +64,7 @@ const DynamicZoneTemplate = ({ index, field, template, onChange, open })=>{
68
64
  icon: icon ? /*#__PURE__*/ react.createElement(FontAwesomeIcon, {
69
65
  icon: icon
70
66
  }) : void 0,
71
- open: open,
67
+ defaultOpen: open,
72
68
  actions: /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(Accordion.Item.Action, {
73
69
  icon: /*#__PURE__*/ react.createElement(expand_less_svg_ReactComponent, null),
74
70
  onClick: moveTemplateUp,
@@ -84,11 +80,7 @@ const DynamicZoneTemplate = ({ index, field, template, onChange, open })=>{
84
80
  icon: /*#__PURE__*/ react.createElement(delete_svg_ReactComponent, null),
85
81
  onClick: deleteTemplate
86
82
  }))
87
- }, templateToEdit ? /*#__PURE__*/ react.createElement(TemplateDialog, {
88
- template: templateToEdit,
89
- onTemplate: updateTemplate,
90
- onClose: onDialogClose
91
- }) : null, /*#__PURE__*/ react.createElement(FieldEditor, {
83
+ }, /*#__PURE__*/ react.createElement(FieldEditor, {
92
84
  parent: field,
93
85
  fields: template.fields,
94
86
  layout: template.layout,
@@ -1 +1 @@
1
- {"version":3,"file":"admin/plugins/fields/dynamicZone/DynamicZoneTemplate.js","sources":["../../../../../src/admin/plugins/fields/dynamicZone/DynamicZoneTemplate.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport { set } from \"dot-prop-immutable\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { ReactComponent as EditIcon } from \"@webiny/icons/edit.svg\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete.svg\";\nimport { ReactComponent as ArrowUpIcon } from \"@webiny/icons/expand_less.svg\";\nimport { ReactComponent as ArrowDownIcon } from \"@webiny/icons/expand_more.svg\";\nimport { Accordion } from \"@webiny/admin-ui\";\nimport { useConfirmationDialog } from \"@webiny/app-admin\";\nimport {\n pullValueAtIndex,\n pushValueAtIndex,\n removeValueAtIndex\n} from \"~/admin/plugins/arrayUtils.js\";\nimport type { CmsDynamicZoneTemplate, CmsEditorFieldsLayout, CmsModelField } from \"~/types.js\";\nimport { TemplateDialog } from \"./TemplateDialog.js\";\nimport { FieldEditor } from \"~/admin/components/FieldEditor/index.js\";\nimport { normalizeIcon } from \"~/utils/normalizeIcon.js\";\n\ninterface DynamicZoneTemplateProps {\n index: number;\n field: CmsModelField;\n template: CmsDynamicZoneTemplate;\n onChange: (field: CmsModelField) => void;\n open: boolean;\n}\n\ninterface UpdateTemplate {\n (template: CmsDynamicZoneTemplate): void;\n}\n\ninterface UpdateFieldsAndLayout {\n (params: { fields: CmsModelField[]; layout: CmsEditorFieldsLayout }): void;\n}\n\nconst TEMPLATES_PATH = \"settings.templates\";\n\nexport const DynamicZoneTemplate = ({\n index,\n field,\n template,\n onChange,\n open\n}: DynamicZoneTemplateProps) => {\n const { showConfirmation } = useConfirmationDialog({\n title: \"Delete content template\",\n message: \"Are you sure you want to delete this content template?\",\n acceptLabel: \"Yes, I'm sure!\"\n });\n\n const [templateToEdit, setTemplateToEdit] = useState<CmsDynamicZoneTemplate | undefined>(\n undefined\n );\n\n const templates = field.settings?.templates || [];\n const isFirst = index === 0;\n const isLast = index === templates.length - 1;\n\n const callbackDeps = [onChange, field, index, template.id];\n\n const onDialogClose = useCallback(() => {\n setTemplateToEdit(undefined);\n }, []);\n\n const editTemplate = useCallback(() => {\n setTemplateToEdit(template);\n }, [template]);\n\n const updateTemplate = useCallback<UpdateTemplate>(params => {\n onChange(\n set(field, `${TEMPLATES_PATH}.${index}`, (tpl: CmsDynamicZoneTemplate) => {\n return { ...tpl, ...params };\n })\n );\n }, callbackDeps);\n\n const updateFieldsAndLayout = useCallback<UpdateFieldsAndLayout>(\n params => {\n updateTemplate({ ...template, ...params });\n },\n [updateTemplate]\n );\n\n const moveTemplateUp = useCallback(() => {\n onChange(set(field, TEMPLATES_PATH, pullValueAtIndex(templates, index)));\n }, callbackDeps);\n\n const moveTemplateDown = useCallback(() => {\n onChange(set(field, TEMPLATES_PATH, pushValueAtIndex(templates, index)));\n }, callbackDeps);\n\n const deleteTemplate = useCallback(() => {\n showConfirmation(() => {\n onChange(set(field, TEMPLATES_PATH, removeValueAtIndex(templates, index)));\n });\n }, callbackDeps);\n\n const icon = normalizeIcon(template.icon);\n\n return (\n <Accordion.Item\n title={template.name}\n description={template.description}\n icon={icon ? <FontAwesomeIcon icon={icon} /> : undefined}\n open={open}\n actions={\n <>\n <Accordion.Item.Action\n icon={<ArrowUpIcon />}\n onClick={moveTemplateUp}\n disabled={isFirst}\n />\n <Accordion.Item.Action\n icon={<ArrowDownIcon />}\n onClick={moveTemplateDown}\n disabled={isLast}\n />\n <Accordion.Item.Action.Separator />\n <Accordion.Item.Action icon={<EditIcon />} onClick={editTemplate} />\n <Accordion.Item.Action icon={<DeleteIcon />} onClick={deleteTemplate} />\n </>\n }\n >\n {templateToEdit ? (\n <TemplateDialog\n template={templateToEdit}\n onTemplate={updateTemplate}\n onClose={onDialogClose}\n />\n ) : null}\n\n <FieldEditor\n parent={field}\n fields={template.fields}\n layout={template.layout}\n onChange={updateFieldsAndLayout}\n />\n </Accordion.Item>\n );\n};\n"],"names":["TEMPLATES_PATH","DynamicZoneTemplate","index","field","template","onChange","open","showConfirmation","useConfirmationDialog","templateToEdit","setTemplateToEdit","useState","undefined","templates","isFirst","isLast","callbackDeps","onDialogClose","useCallback","editTemplate","updateTemplate","params","set","tpl","updateFieldsAndLayout","moveTemplateUp","pullValueAtIndex","moveTemplateDown","pushValueAtIndex","deleteTemplate","removeValueAtIndex","icon","normalizeIcon","Accordion","FontAwesomeIcon","ArrowUpIcon","ArrowDownIcon","EditIcon","DeleteIcon","TemplateDialog","FieldEditor"],"mappings":";;;;;;;;;;;;;AAmCA,MAAMA,iBAAiB;AAEhB,MAAMC,sBAAsB,CAAC,EAChCC,KAAK,EACLC,KAAK,EACLC,QAAQ,EACRC,QAAQ,EACRC,IAAI,EACmB;IACvB,MAAM,EAAEC,gBAAgB,EAAE,GAAGC,sBAAsB;QAC/C,OAAO;QACP,SAAS;QACT,aAAa;IACjB;IAEA,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGC,SACxCC;IAGJ,MAAMC,YAAYV,MAAM,QAAQ,EAAE,aAAa,EAAE;IACjD,MAAMW,UAAUZ,AAAU,MAAVA;IAChB,MAAMa,SAASb,UAAUW,UAAU,MAAM,GAAG;IAE5C,MAAMG,eAAe;QAACX;QAAUF;QAAOD;QAAOE,SAAS,EAAE;KAAC;IAE1D,MAAMa,gBAAgBC,YAAY;QAC9BR,kBAAkBE;IACtB,GAAG,EAAE;IAEL,MAAMO,eAAeD,YAAY;QAC7BR,kBAAkBN;IACtB,GAAG;QAACA;KAAS;IAEb,MAAMgB,iBAAiBF,YAA4BG,CAAAA;QAC/ChB,SACIiB,IAAInB,OAAO,GAAGH,eAAe,CAAC,EAAEE,OAAO,EAAE,CAACqB,MAC/B;gBAAE,GAAGA,GAAG;gBAAE,GAAGF,MAAM;YAAC;IAGvC,GAAGL;IAEH,MAAMQ,wBAAwBN,YAC1BG,CAAAA;QACID,eAAe;YAAE,GAAGhB,QAAQ;YAAE,GAAGiB,MAAM;QAAC;IAC5C,GACA;QAACD;KAAe;IAGpB,MAAMK,iBAAiBP,YAAY;QAC/Bb,SAASiB,IAAInB,OAAOH,gBAAgB0B,iBAAiBb,WAAWX;IACpE,GAAGc;IAEH,MAAMW,mBAAmBT,YAAY;QACjCb,SAASiB,IAAInB,OAAOH,gBAAgB4B,iBAAiBf,WAAWX;IACpE,GAAGc;IAEH,MAAMa,iBAAiBX,YAAY;QAC/BX,iBAAiB;YACbF,SAASiB,IAAInB,OAAOH,gBAAgB8B,mBAAmBjB,WAAWX;QACtE;IACJ,GAAGc;IAEH,MAAMe,OAAOC,cAAc5B,SAAS,IAAI;IAExC,OAAO,WAAP,GACI,oBAAC6B,UAAU,IAAI;QACX,OAAO7B,SAAS,IAAI;QACpB,aAAaA,SAAS,WAAW;QACjC,MAAM2B,OAAO,WAAPA,GAAO,oBAACG,iBAAeA;YAAC,MAAMH;aAAWnB;QAC/C,MAAMN;QACN,uBACI,wDACI,oBAAC2B,UAAU,IAAI,CAAC,MAAM;YAClB,oBAAM,oBAACE,gCAAWA;YAClB,SAASV;YACT,UAAUX;0BAEd,oBAACmB,UAAU,IAAI,CAAC,MAAM;YAClB,oBAAM,oBAACG,gCAAaA;YACpB,SAAST;YACT,UAAUZ;0BAEd,oBAACkB,UAAU,IAAI,CAAC,MAAM,CAAC,SAAS,uBAChC,oBAACA,UAAU,IAAI,CAAC,MAAM;YAAC,oBAAM,oBAACI,gBAAQA;YAAK,SAASlB;0BACpD,oBAACc,UAAU,IAAI,CAAC,MAAM;YAAC,oBAAM,oBAACK,2BAAUA;YAAK,SAAST;;OAI7DpB,iBAAiB,WAAjBA,GACG,oBAAC8B,gBAAcA;QACX,UAAU9B;QACV,YAAYW;QACZ,SAASH;SAEb,oBAEJ,oBAACuB,aAAWA;QACR,QAAQrC;QACR,QAAQC,SAAS,MAAM;QACvB,QAAQA,SAAS,MAAM;QACvB,UAAUoB;;AAI1B"}
1
+ {"version":3,"file":"admin/plugins/fields/dynamicZone/DynamicZoneTemplate.js","sources":["../../../../../src/admin/plugins/fields/dynamicZone/DynamicZoneTemplate.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { set } from \"dot-prop-immutable\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { ReactComponent as EditIcon } from \"@webiny/icons/edit.svg\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete.svg\";\nimport { ReactComponent as ArrowUpIcon } from \"@webiny/icons/expand_less.svg\";\nimport { ReactComponent as ArrowDownIcon } from \"@webiny/icons/expand_more.svg\";\nimport { Accordion } from \"@webiny/admin-ui\";\nimport { useConfirmationDialog } from \"@webiny/app-admin\";\nimport {\n pullValueAtIndex,\n pushValueAtIndex,\n removeValueAtIndex\n} from \"~/admin/plugins/arrayUtils.js\";\nimport type { CmsDynamicZoneTemplate, CmsEditorFieldsLayout, CmsModelField } from \"~/types.js\";\nimport { FieldEditor } from \"~/admin/components/FieldEditor/index.js\";\nimport { normalizeIcon } from \"~/utils/normalizeIcon.js\";\n\ninterface DynamicZoneTemplateProps {\n index: number;\n field: CmsModelField;\n template: CmsDynamicZoneTemplate;\n onChange: (field: CmsModelField) => void;\n open: boolean;\n onEditTemplate: (template: CmsDynamicZoneTemplate) => void;\n}\n\ninterface UpdateTemplate {\n (template: CmsDynamicZoneTemplate): void;\n}\n\ninterface UpdateFieldsAndLayout {\n (params: { fields: CmsModelField[]; layout: CmsEditorFieldsLayout }): void;\n}\n\nconst TEMPLATES_PATH = \"settings.templates\";\n\nexport const DynamicZoneTemplate = ({\n index,\n field,\n template,\n onChange,\n open,\n onEditTemplate\n}: DynamicZoneTemplateProps) => {\n const { showConfirmation } = useConfirmationDialog({\n title: \"Delete content template\",\n message: \"Are you sure you want to delete this content template?\",\n acceptLabel: \"Yes, I'm sure!\"\n });\n\n const templates = field.settings?.templates || [];\n const isFirst = index === 0;\n const isLast = index === templates.length - 1;\n\n const callbackDeps = [onChange, field, index, template.id];\n\n const editTemplate = useCallback(() => {\n onEditTemplate(template);\n }, [template, onEditTemplate]);\n\n const updateTemplate = useCallback<UpdateTemplate>(params => {\n onChange(\n set(field, `${TEMPLATES_PATH}.${index}`, (tpl: CmsDynamicZoneTemplate) => {\n return { ...tpl, ...params };\n })\n );\n }, callbackDeps);\n\n const updateFieldsAndLayout = useCallback<UpdateFieldsAndLayout>(\n params => {\n updateTemplate({ ...template, ...params });\n },\n [updateTemplate]\n );\n\n const moveTemplateUp = useCallback(() => {\n onChange(set(field, TEMPLATES_PATH, pullValueAtIndex(templates, index)));\n }, callbackDeps);\n\n const moveTemplateDown = useCallback(() => {\n onChange(set(field, TEMPLATES_PATH, pushValueAtIndex(templates, index)));\n }, callbackDeps);\n\n const deleteTemplate = useCallback(() => {\n showConfirmation(() => {\n onChange(set(field, TEMPLATES_PATH, removeValueAtIndex(templates, index)));\n });\n }, callbackDeps);\n\n const icon = normalizeIcon(template.icon);\n\n return (\n <Accordion.Item\n title={template.name}\n description={template.description}\n icon={icon ? <FontAwesomeIcon icon={icon} /> : undefined}\n defaultOpen={open}\n actions={\n <>\n <Accordion.Item.Action\n icon={<ArrowUpIcon />}\n onClick={moveTemplateUp}\n disabled={isFirst}\n />\n <Accordion.Item.Action\n icon={<ArrowDownIcon />}\n onClick={moveTemplateDown}\n disabled={isLast}\n />\n <Accordion.Item.Action.Separator />\n <Accordion.Item.Action icon={<EditIcon />} onClick={editTemplate} />\n <Accordion.Item.Action icon={<DeleteIcon />} onClick={deleteTemplate} />\n </>\n }\n >\n <FieldEditor\n parent={field}\n fields={template.fields}\n layout={template.layout}\n onChange={updateFieldsAndLayout}\n />\n </Accordion.Item>\n );\n};\n"],"names":["TEMPLATES_PATH","DynamicZoneTemplate","index","field","template","onChange","open","onEditTemplate","showConfirmation","useConfirmationDialog","templates","isFirst","isLast","callbackDeps","editTemplate","useCallback","updateTemplate","params","set","tpl","updateFieldsAndLayout","moveTemplateUp","pullValueAtIndex","moveTemplateDown","pushValueAtIndex","deleteTemplate","removeValueAtIndex","icon","normalizeIcon","Accordion","FontAwesomeIcon","undefined","ArrowUpIcon","ArrowDownIcon","EditIcon","DeleteIcon","FieldEditor"],"mappings":";;;;;;;;;;;;AAmCA,MAAMA,iBAAiB;AAEhB,MAAMC,sBAAsB,CAAC,EAChCC,KAAK,EACLC,KAAK,EACLC,QAAQ,EACRC,QAAQ,EACRC,IAAI,EACJC,cAAc,EACS;IACvB,MAAM,EAAEC,gBAAgB,EAAE,GAAGC,sBAAsB;QAC/C,OAAO;QACP,SAAS;QACT,aAAa;IACjB;IAEA,MAAMC,YAAYP,MAAM,QAAQ,EAAE,aAAa,EAAE;IACjD,MAAMQ,UAAUT,AAAU,MAAVA;IAChB,MAAMU,SAASV,UAAUQ,UAAU,MAAM,GAAG;IAE5C,MAAMG,eAAe;QAACR;QAAUF;QAAOD;QAAOE,SAAS,EAAE;KAAC;IAE1D,MAAMU,eAAeC,YAAY;QAC7BR,eAAeH;IACnB,GAAG;QAACA;QAAUG;KAAe;IAE7B,MAAMS,iBAAiBD,YAA4BE,CAAAA;QAC/CZ,SACIa,IAAIf,OAAO,GAAGH,eAAe,CAAC,EAAEE,OAAO,EAAE,CAACiB,MAC/B;gBAAE,GAAGA,GAAG;gBAAE,GAAGF,MAAM;YAAC;IAGvC,GAAGJ;IAEH,MAAMO,wBAAwBL,YAC1BE,CAAAA;QACID,eAAe;YAAE,GAAGZ,QAAQ;YAAE,GAAGa,MAAM;QAAC;IAC5C,GACA;QAACD;KAAe;IAGpB,MAAMK,iBAAiBN,YAAY;QAC/BV,SAASa,IAAIf,OAAOH,gBAAgBsB,iBAAiBZ,WAAWR;IACpE,GAAGW;IAEH,MAAMU,mBAAmBR,YAAY;QACjCV,SAASa,IAAIf,OAAOH,gBAAgBwB,iBAAiBd,WAAWR;IACpE,GAAGW;IAEH,MAAMY,iBAAiBV,YAAY;QAC/BP,iBAAiB;YACbH,SAASa,IAAIf,OAAOH,gBAAgB0B,mBAAmBhB,WAAWR;QACtE;IACJ,GAAGW;IAEH,MAAMc,OAAOC,cAAcxB,SAAS,IAAI;IAExC,OAAO,WAAP,GACI,oBAACyB,UAAU,IAAI;QACX,OAAOzB,SAAS,IAAI;QACpB,aAAaA,SAAS,WAAW;QACjC,MAAMuB,OAAO,WAAPA,GAAO,oBAACG,iBAAeA;YAAC,MAAMH;aAAWI;QAC/C,aAAazB;QACb,uBACI,wDACI,oBAACuB,UAAU,IAAI,CAAC,MAAM;YAClB,oBAAM,oBAACG,gCAAWA;YAClB,SAASX;YACT,UAAUV;0BAEd,oBAACkB,UAAU,IAAI,CAAC,MAAM;YAClB,oBAAM,oBAACI,gCAAaA;YACpB,SAASV;YACT,UAAUX;0BAEd,oBAACiB,UAAU,IAAI,CAAC,MAAM,CAAC,SAAS,uBAChC,oBAACA,UAAU,IAAI,CAAC,MAAM;YAAC,oBAAM,oBAACK,gBAAQA;YAAK,SAASpB;0BACpD,oBAACe,UAAU,IAAI,CAAC,MAAM;YAAC,oBAAM,oBAACM,2BAAUA;YAAK,SAASV;;qBAI9D,oBAACW,aAAWA;QACR,QAAQjC;QACR,QAAQC,SAAS,MAAM;QACvB,QAAQA,SAAS,MAAM;QACvB,UAAUgB;;AAI1B"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webiny/app-headless-cms",
3
- "version": "6.4.6",
3
+ "version": "6.4.7-beta.0",
4
4
  "type": "module",
5
5
  "exports": {
6
6
  ".": "./index.js",
@@ -31,25 +31,25 @@
31
31
  "@lexical/utils": "0.46.0",
32
32
  "@svgr/webpack": "8.1.0",
33
33
  "@types/react": "18.3.31",
34
- "@webiny/admin-ui": "6.4.6",
35
- "@webiny/app": "6.4.6",
36
- "@webiny/app-aco": "6.4.6",
37
- "@webiny/app-admin": "6.4.6",
38
- "@webiny/app-graphql-playground": "6.4.6",
39
- "@webiny/app-headless-cms-common": "6.4.6",
40
- "@webiny/app-trash-bin": "6.4.6",
41
- "@webiny/error": "6.4.6",
42
- "@webiny/feature": "6.4.6",
43
- "@webiny/form": "6.4.6",
44
- "@webiny/icons": "6.4.6",
45
- "@webiny/lexical-converter": "6.4.6",
46
- "@webiny/lexical-editor": "6.4.6",
47
- "@webiny/lexical-nodes": "6.4.6",
48
- "@webiny/plugins": "6.4.6",
49
- "@webiny/react-composition": "6.4.6",
50
- "@webiny/react-properties": "6.4.6",
51
- "@webiny/utils": "6.4.6",
52
- "@webiny/validation": "6.4.6",
34
+ "@webiny/admin-ui": "6.4.7-beta.0",
35
+ "@webiny/app": "6.4.7-beta.0",
36
+ "@webiny/app-aco": "6.4.7-beta.0",
37
+ "@webiny/app-admin": "6.4.7-beta.0",
38
+ "@webiny/app-graphql-playground": "6.4.7-beta.0",
39
+ "@webiny/app-headless-cms-common": "6.4.7-beta.0",
40
+ "@webiny/app-trash-bin": "6.4.7-beta.0",
41
+ "@webiny/error": "6.4.7-beta.0",
42
+ "@webiny/feature": "6.4.7-beta.0",
43
+ "@webiny/form": "6.4.7-beta.0",
44
+ "@webiny/icons": "6.4.7-beta.0",
45
+ "@webiny/lexical-converter": "6.4.7-beta.0",
46
+ "@webiny/lexical-editor": "6.4.7-beta.0",
47
+ "@webiny/lexical-nodes": "6.4.7-beta.0",
48
+ "@webiny/plugins": "6.4.7-beta.0",
49
+ "@webiny/react-composition": "6.4.7-beta.0",
50
+ "@webiny/react-properties": "6.4.7-beta.0",
51
+ "@webiny/utils": "6.4.7-beta.0",
52
+ "@webiny/validation": "6.4.7-beta.0",
53
53
  "apollo-cache": "1.3.5",
54
54
  "apollo-client": "2.6.10",
55
55
  "apollo-link": "1.2.14",
@@ -71,7 +71,7 @@
71
71
  "zod": "4.4.3"
72
72
  },
73
73
  "devDependencies": {
74
- "@webiny/build-tools": "6.4.6",
74
+ "@webiny/build-tools": "6.4.7-beta.0",
75
75
  "rimraf": "6.1.3",
76
76
  "typescript": "6.0.3",
77
77
  "vitest": "4.1.10"