@webiny/app-headless-cms 0.0.0-mt-2 → 0.0.0-unstable.06b2ede40f

package/admin/views/contentEntries/ContentEntry.js

@@ -1,99 +1,59 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-
-var _templateObject, _templateObject2;
-
-import React from "react";
-import { css } from "emotion";
-import styled from "@emotion/styled";
-import EmptyView from "@webiny/app-admin/components/EmptyView";
-import { ButtonDefault, ButtonIcon } from "@webiny/ui/Button";
-import { ReactComponent as AddIcon } from "@svgr/webpack!@webiny/app-admin/assets/icons/add-18px.svg";
-import { i18n } from "@webiny/app/i18n";
-import { Tab, Tabs } from "@webiny/ui/Tabs";
-import { Elevation } from "@webiny/ui/Elevation";
-import { CircularProgress } from "@webiny/ui/Progress";
-import RevisionsList from "./ContentEntry/RevisionsList";
-import Header from "./ContentEntry/header/Header";
+import React, { useState } from "react";
+import { makeDecoratable } from "@webiny/app";
+import { RevisionsList } from "./ContentEntry/RevisionsList/RevisionsList";
 import { useContentEntry } from "./hooks/useContentEntry";
+import { Header } from "../../components/ContentEntryForm/Header";
 import { ContentEntryForm } from "../../components/ContentEntryForm/ContentEntryForm";
-var t = i18n.namespace("app-headless-cms/admin/content-model-entries/details");
-var DetailsContainer = /*#__PURE__*/styled("div", {
-  target: "e68rq0j0",
-  label: "DetailsContainer"
-})({
-  height: "calc(100% - 10px)",
-  overflow: "hidden",
-  position: "relative",
-  nav: {
-    backgroundColor: "var(--mdc-theme-surface)"
-  }
-});
-var RenderBlock = /*#__PURE__*/styled("div", {
-  target: "e68rq0j1",
-  label: "RenderBlock"
-})({
-  position: "relative",
-  zIndex: 0,
-  backgroundColor: "var(--mdc-theme-background)",
-  height: "100%",
-
-  /*overflow: "scroll",*/
-  padding: 25
-});
-var elevationStyles = /*#__PURE__*/css({
-  position: "relative"
-}, "label:elevationStyles;");
-
-var ContentEntry = function ContentEntry() {
-  var _useContentEntry = useContentEntry(),
-      contentModel = _useContentEntry.contentModel,
-      loading = _useContentEntry.loading,
-      entry = _useContentEntry.entry,
-      showEmptyView = _useContentEntry.showEmptyView,
-      canCreate = _useContentEntry.canCreate,
-      createEntry = _useContentEntry.createEntry,
-      setTabsRef = _useContentEntry.setTabsRef,
-      setFormRef = _useContentEntry.setFormRef; // Render "No content selected" view.
-
-
-  if (showEmptyView) {
-    return /*#__PURE__*/React.createElement(EmptyView, {
-      title: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Click on the left side list to display entry details {message}"])))({
-        message: canCreate ? "or create a..." : ""
-      }),
-      action: canCreate ? /*#__PURE__*/React.createElement(ButtonDefault, {
-        "data-testid": "new-record-button",
-        onClick: createEntry
-      }, /*#__PURE__*/React.createElement(ButtonIcon, {
-        icon: /*#__PURE__*/React.createElement(AddIcon, null)
-      }), " ", t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["New Entry"])))) : null
-    });
-  }
-
-  return /*#__PURE__*/React.createElement(DetailsContainer, null, /*#__PURE__*/React.createElement("test-id", {
+import { usePersistEntry } from "../../hooks/usePersistEntry";
+import { ValidationIndicators } from "./ValidationIndicators";
+import { OverlayLoader, Tabs } from "@webiny/admin-ui";
+export const ContentEntry = makeDecoratable("ContentEntry", () => {
+  const {
+    loading,
+    entry,
+    activeTab,
+    setActiveTab
+  } = useContentEntry();
+  const [invalidFields, setInvalidFields] = useState(undefined);
+  const {
+    persistEntry
+  } = usePersistEntry({
+    addItemToListCache: true
+  });
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("test-id", {
     "data-testid": "cms-content-details"
   }, /*#__PURE__*/React.createElement(Tabs, {
-    ref: function ref(tabs) {
-      return setTabsRef(tabs);
-    }
-  }, /*#__PURE__*/React.createElement(Tab, {
-    label: "Content",
-    disabled: loading,
-    "data-testid": "cms.content-form.tabs.content"
-  }, /*#__PURE__*/React.createElement(RenderBlock, null, /*#__PURE__*/React.createElement(Elevation, {
-    z: 2,
-    className: elevationStyles
-  }, loading && /*#__PURE__*/React.createElement(CircularProgress, null), /*#__PURE__*/React.createElement(Header, null), /*#__PURE__*/React.createElement(ContentEntryForm, {
-    contentModel: contentModel,
-    entry: entry,
-    onForm: function onForm(form) {
-      return setFormRef(form);
-    }
-  })))), /*#__PURE__*/React.createElement(Tab, {
-    label: "Revisions",
-    disabled: loading,
-    "data-testid": "cms.content-form.tabs.revisions"
-  }, /*#__PURE__*/React.createElement(RevisionsList, null)))));
-};
+    id: "cms-content-details-tabs",
+    size: "md",
+    separator: true,
+    spacing: "lg",
+    value: activeTab,
+    onValueChange: setActiveTab,
+    tabs: [/*#__PURE__*/React.createElement(Tabs.Tab, {
+      key: "content",
+      value: "content",
+      trigger: "Content",
+      disabled: loading,
+      "data-testid": "cms.content-form.tabs.content",
+      content: /*#__PURE__*/React.createElement("div", {
+        className: "wby-relative"
+      }, invalidFields ? /*#__PURE__*/React.createElement(ValidationIndicators, {
+        invalidFields: invalidFields
+      }) : null, loading && /*#__PURE__*/React.createElement(OverlayLoader, null), /*#__PURE__*/React.createElement(ContentEntryForm, {
+        entry: entry,
+        persistEntry: persistEntry,
+        header: /*#__PURE__*/React.createElement(Header, null),
+        onInvalidFields: invalidFields => setInvalidFields(invalidFields)
+      }))
+    }), /*#__PURE__*/React.createElement(Tabs.Tab, {
+      key: "revisions",
+      value: "revisions",
+      trigger: "Revisions",
+      disabled: loading,
+      "data-testid": "cms.content-form.tabs.revisions",
+      content: /*#__PURE__*/React.createElement(RevisionsList, null)
+    })]
+  })));
+});
 
-export default ContentEntry;
+//# sourceMappingURL=ContentEntry.js.map

package/admin/views/contentEntries/ContentEntry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","makeDecoratable","RevisionsList","useContentEntry","Header","ContentEntryForm","usePersistEntry","ValidationIndicators","OverlayLoader","Tabs","ContentEntry","loading","entry","activeTab","setActiveTab","invalidFields","setInvalidFields","undefined","persistEntry","addItemToListCache","createElement","id","size","separator","spacing","value","onValueChange","tabs","Tab","key","trigger","disabled","content","className","header","onInvalidFields"],"sources":["ContentEntry.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { makeDecoratable } from \"@webiny/app\";\nimport { RevisionsList } from \"./ContentEntry/RevisionsList/RevisionsList\";\nimport { useContentEntry } from \"./hooks/useContentEntry\";\nimport { Header } from \"~/admin/components/ContentEntryForm/Header\";\nimport { ContentEntryForm } from \"~/admin/components/ContentEntryForm/ContentEntryForm\";\nimport { usePersistEntry } from \"~/admin/hooks/usePersistEntry\";\nimport type { FormValidation } from \"@webiny/form\";\nimport { ValidationIndicators } from \"./ValidationIndicators\";\nimport { OverlayLoader, Tabs } from \"@webiny/admin-ui\";\n\ndeclare global {\n    // eslint-disable-next-line\n    namespace JSX {\n        interface IntrinsicElements {\n            \"test-id\": {\n                children?: React.ReactNode;\n            };\n        }\n    }\n}\n\nexport const ContentEntry = makeDecoratable(\"ContentEntry\", () => {\n    const { loading, entry, activeTab, setActiveTab } = useContentEntry();\n    const [invalidFields, setInvalidFields] = useState<FormValidation | undefined>(undefined);\n    const { persistEntry } = usePersistEntry({ addItemToListCache: true });\n\n    return (\n        <div>\n            <test-id data-testid=\"cms-content-details\">\n                <Tabs\n                    id={\"cms-content-details-tabs\"}\n                    size={\"md\"}\n                    separator={true}\n                    spacing={\"lg\"}\n                    value={activeTab}\n                    onValueChange={setActiveTab}\n                    tabs={[\n                        <Tabs.Tab\n                            key={\"content\"}\n                            value={\"content\"}\n                            trigger={\"Content\"}\n                            disabled={loading}\n                            data-testid={\"cms.content-form.tabs.content\"}\n                            content={\n                                <div className={\"wby-relative\"}>\n                                    {invalidFields ? (\n                                        <ValidationIndicators invalidFields={invalidFields} />\n                                    ) : null}\n                                    {loading && <OverlayLoader />}\n                                    <ContentEntryForm\n                                        entry={entry}\n                                        persistEntry={persistEntry}\n                                        header={<Header />}\n                                        onInvalidFields={invalidFields =>\n                                            setInvalidFields(invalidFields)\n                                        }\n                                    />\n                                </div>\n                            }\n                        />,\n                        <Tabs.Tab\n                            key={\"revisions\"}\n                            value={\"revisions\"}\n                            trigger={\"Revisions\"}\n                            disabled={loading}\n                            data-testid={\"cms.content-form.tabs.revisions\"}\n                            content={<RevisionsList />}\n                        />\n                    ]}\n                ></Tabs>\n            </test-id>\n        </div>\n    );\n});\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SAASC,eAAe,QAAQ,aAAa;AAC7C,SAASC,aAAa;AACtB,SAASC,eAAe;AACxB,SAASC,MAAM;AACf,SAASC,gBAAgB;AACzB,SAASC,eAAe;AAExB,SAASC,oBAAoB;AAC7B,SAASC,aAAa,EAAEC,IAAI,QAAQ,kBAAkB;AAatD,OAAO,MAAMC,YAAY,GAAGT,eAAe,CAAC,cAAc,EAAE,MAAM;EAC9D,MAAM;IAAEU,OAAO;IAAEC,KAAK;IAAEC,SAAS;IAAEC;EAAa,CAAC,GAAGX,eAAe,CAAC,CAAC;EACrE,MAAM,CAACY,aAAa,EAAEC,gBAAgB,CAAC,GAAGhB,QAAQ,CAA6BiB,SAAS,CAAC;EACzF,MAAM;IAAEC;EAAa,CAAC,GAAGZ,eAAe,CAAC;IAAEa,kBAAkB,EAAE;EAAK,CAAC,CAAC;EAEtE,oBACIpB,KAAA,CAAAqB,aAAA,2BACIrB,KAAA,CAAAqB,aAAA;IAAS,eAAY;EAAqB,gBACtCrB,KAAA,CAAAqB,aAAA,CAACX,IAAI;IACDY,EAAE,EAAE,0BAA2B;IAC/BC,IAAI,EAAE,IAAK;IACXC,SAAS,EAAE,IAAK;IAChBC,OAAO,EAAE,IAAK;IACdC,KAAK,EAAEZ,SAAU;IACjBa,aAAa,EAAEZ,YAAa;IAC5Ba,IAAI,EAAE,cACF5B,KAAA,CAAAqB,aAAA,CAACX,IAAI,CAACmB,GAAG;MACLC,GAAG,EAAE,SAAU;MACfJ,KAAK,EAAE,SAAU;MACjBK,OAAO,EAAE,SAAU;MACnBC,QAAQ,EAAEpB,OAAQ;MAClB,eAAa,+BAAgC;MAC7CqB,OAAO,eACHjC,KAAA,CAAAqB,aAAA;QAAKa,SAAS,EAAE;MAAe,GAC1BlB,aAAa,gBACVhB,KAAA,CAAAqB,aAAA,CAACb,oBAAoB;QAACQ,aAAa,EAAEA;MAAc,CAAE,CAAC,GACtD,IAAI,EACPJ,OAAO,iBAAIZ,KAAA,CAAAqB,aAAA,CAACZ,aAAa,MAAE,CAAC,eAC7BT,KAAA,CAAAqB,aAAA,CAACf,gBAAgB;QACbO,KAAK,EAAEA,KAAM;QACbM,YAAY,EAAEA,YAAa;QAC3BgB,MAAM,eAAEnC,KAAA,CAAAqB,aAAA,CAAChB,MAAM,MAAE,CAAE;QACnB+B,eAAe,EAAEpB,aAAa,IAC1BC,gBAAgB,CAACD,aAAa;MACjC,CACJ,CACA;IACR,CACJ,CAAC,eACFhB,KAAA,CAAAqB,aAAA,CAACX,IAAI,CAACmB,GAAG;MACLC,GAAG,EAAE,WAAY;MACjBJ,KAAK,EAAE,WAAY;MACnBK,OAAO,EAAE,WAAY;MACrBC,QAAQ,EAAEpB,OAAQ;MAClB,eAAa,iCAAkC;MAC/CqB,OAAO,eAAEjC,KAAA,CAAAqB,aAAA,CAAClB,aAAa,MAAE;IAAE,CAC9B,CAAC;EACJ,CACC,CACF,CACR,CAAC;AAEd,CAAC,CAAC","ignoreList":[]}

package/admin/views/contentEntries/SingletonContentEntryModule.d.ts

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

package/admin/views/contentEntries/SingletonContentEntryModule.js

@@ -0,0 +1,27 @@
+import React from "react";
+import { ContentEntries } from "./ContentEntries";
+import { CMS_MODEL_SINGLETON_TAG } from "@webiny/app-headless-cms-common";
+import { ContentEntriesProvider } from "./ContentEntriesContext";
+import { DialogsProvider } from "@webiny/app-admin";
+import { SingletonContentEntryProvider } from "./ContentEntry/SingletonContentEntryContext";
+import { SingletonContentEntry } from "./ContentEntry/SingletonContentEntry";
+import { useModel } from "../../components/ModelProvider";
+const ContentEntriesDecorator = ContentEntries.createDecorator(Original => {
+  return function ContentEntries() {
+    const {
+      model
+    } = useModel();
+    if (model.tags.includes(CMS_MODEL_SINGLETON_TAG)) {
+      return /*#__PURE__*/React.createElement(ContentEntriesProvider, {
+        contentModel: model,
+        key: model.modelId
+      }, /*#__PURE__*/React.createElement(DialogsProvider, null, /*#__PURE__*/React.createElement(SingletonContentEntryProvider, null, /*#__PURE__*/React.createElement(SingletonContentEntry, null))));
+    }
+    return /*#__PURE__*/React.createElement(Original, null);
+  };
+});
+export const SingletonContentEntryModule = () => {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ContentEntriesDecorator, null));
+};
+
+//# sourceMappingURL=SingletonContentEntryModule.js.map

package/admin/views/contentEntries/SingletonContentEntryModule.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","ContentEntries","CMS_MODEL_SINGLETON_TAG","ContentEntriesProvider","DialogsProvider","SingletonContentEntryProvider","SingletonContentEntry","useModel","ContentEntriesDecorator","createDecorator","Original","model","tags","includes","createElement","contentModel","key","modelId","SingletonContentEntryModule","Fragment"],"sources":["SingletonContentEntryModule.tsx"],"sourcesContent":["import React from \"react\";\nimport { ContentEntries } from \"~/admin/views/contentEntries/ContentEntries\";\nimport { CMS_MODEL_SINGLETON_TAG } from \"@webiny/app-headless-cms-common\";\nimport { ContentEntriesProvider } from \"~/admin/views/contentEntries/ContentEntriesContext\";\nimport { DialogsProvider } from \"@webiny/app-admin\";\nimport { SingletonContentEntryProvider } from \"~/admin/views/contentEntries/ContentEntry/SingletonContentEntryContext\";\nimport { SingletonContentEntry } from \"~/admin/views/contentEntries/ContentEntry/SingletonContentEntry\";\nimport { useModel } from \"~/admin/components/ModelProvider\";\n\nconst ContentEntriesDecorator = ContentEntries.createDecorator(Original => {\n    return function ContentEntries() {\n        const { model } = useModel();\n\n        if (model.tags.includes(CMS_MODEL_SINGLETON_TAG)) {\n            return (\n                <ContentEntriesProvider contentModel={model} key={model.modelId}>\n                    <DialogsProvider>\n                        <SingletonContentEntryProvider>\n                            <SingletonContentEntry />\n                        </SingletonContentEntryProvider>\n                    </DialogsProvider>\n                </ContentEntriesProvider>\n            );\n        }\n\n        return <Original />;\n    };\n});\n\nexport const SingletonContentEntryModule = () => {\n    return (\n        <>\n            <ContentEntriesDecorator />\n        </>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc;AACvB,SAASC,uBAAuB,QAAQ,iCAAiC;AACzE,SAASC,sBAAsB;AAC/B,SAASC,eAAe,QAAQ,mBAAmB;AACnD,SAASC,6BAA6B;AACtC,SAASC,qBAAqB;AAC9B,SAASC,QAAQ;AAEjB,MAAMC,uBAAuB,GAAGP,cAAc,CAACQ,eAAe,CAACC,QAAQ,IAAI;EACvE,OAAO,SAAST,cAAcA,CAAA,EAAG;IAC7B,MAAM;MAAEU;IAAM,CAAC,GAAGJ,QAAQ,CAAC,CAAC;IAE5B,IAAII,KAAK,CAACC,IAAI,CAACC,QAAQ,CAACX,uBAAuB,CAAC,EAAE;MAC9C,oBACIF,KAAA,CAAAc,aAAA,CAACX,sBAAsB;QAACY,YAAY,EAAEJ,KAAM;QAACK,GAAG,EAAEL,KAAK,CAACM;MAAQ,gBAC5DjB,KAAA,CAAAc,aAAA,CAACV,eAAe,qBACZJ,KAAA,CAAAc,aAAA,CAACT,6BAA6B,qBAC1BL,KAAA,CAAAc,aAAA,CAACR,qBAAqB,MAAE,CACG,CAClB,CACG,CAAC;IAEjC;IAEA,oBAAON,KAAA,CAAAc,aAAA,CAACJ,QAAQ,MAAE,CAAC;EACvB,CAAC;AACL,CAAC,CAAC;AAEF,OAAO,MAAMQ,2BAA2B,GAAGA,CAAA,KAAM;EAC7C,oBACIlB,KAAA,CAAAc,aAAA,CAAAd,KAAA,CAAAmB,QAAA,qBACInB,KAAA,CAAAc,aAAA,CAACN,uBAAuB,MAAE,CAC5B,CAAC;AAEX,CAAC","ignoreList":[]}

package/admin/views/contentEntries/Table/Main.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+interface MainProps {
+    folderId?: string;
+}
+export declare const Main: ({ folderId: initialFolderId }: MainProps) => React.JSX.Element;
+export {};

package/admin/views/contentEntries/Table/Main.js

@@ -0,0 +1,122 @@
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import debounce from "lodash/debounce";
+import { useCreateDialog, useGetFolderLevelPermission } from "@webiny/app-aco";
+import { Scrollbar } from "@webiny/admin-ui";
+import { Empty } from "../../../components/ContentEntries/Empty";
+import { Filters } from "../../../components/ContentEntries/Filters";
+import { Header } from "../../../components/ContentEntries/Header";
+import { LoadMoreButton } from "../../../components/ContentEntries/LoadMoreButton";
+import { Table } from "../../../components/ContentEntries/Table";
+import { useContentEntriesList, useContentEntry } from "../hooks";
+import { ContentEntry } from "../ContentEntry";
+import { useRouter } from "@webiny/react-router";
+import { ROOT_FOLDER } from "../../../constants";
+import { BulkActions } from "../../../components/ContentEntries/BulkActions";
+import { BottomInfoBar } from "../../../components/ContentEntries/BottomInfoBar";
+export const Main = ({
+  folderId: initialFolderId
+}) => {
+  const folderId = initialFolderId === undefined ? ROOT_FOLDER : initialFolderId;
+  const isRoot = initialFolderId === ROOT_FOLDER;
+  const list = useContentEntriesList();
+  const {
+    showDialog: showCreateFolderDialog
+  } = useCreateDialog();
+  const {
+    history
+  } = useRouter();
+
+  // We check permissions on two layers - security and folder level permissions.
+  const {
+    canCreate,
+    contentModel
+  } = useContentEntry();
+  const {
+    getFolderLevelPermission: canManageContent
+  } = useGetFolderLevelPermission("canManageContent");
+  const {
+    getFolderLevelPermission: canManageStructure
+  } = useGetFolderLevelPermission("canManageStructure");
+  const canCreateFolder = useCallback(folderId => {
+    return canManageStructure(folderId);
+  }, [canManageStructure]);
+  const canCreateContent = useCallback(folderId => {
+    return canCreate && canManageContent(folderId);
+  }, [canManageContent, canCreate]);
+  const createEntry = useCallback(() => {
+    const folder = folderId ? `&folderId=${encodeURIComponent(folderId)}` : "";
+    history.push(`/cms/content-entries/${contentModel.modelId}?new=true${folder}`);
+  }, [canCreate, contentModel, folderId]);
+  const {
+    innerHeight: windowHeight
+  } = window;
+  const [tableHeight, setTableHeight] = useState(0);
+  const tableRef = useRef(null);
+  useEffect(() => {
+    setTableHeight(tableRef?.current?.clientHeight || 0);
+    return () => {
+      setTableHeight(0);
+    };
+  });
+  const loadMoreOnScroll = debounce(async ({
+    scrollFrame
+  }) => {
+    if (scrollFrame.top > 0.8) {
+      await list.listMoreRecords();
+    }
+  }, 200);
+  const onCreateFolder = useCallback(() => {
+    showCreateFolderDialog({
+      currentParentId: folderId
+    });
+  }, [folderId]);
+  const {
+    showEmptyView
+  } = useContentEntry();
+  if (!showEmptyView) {
+    return /*#__PURE__*/React.createElement(ContentEntry, null);
+  }
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "wby-h-full wby-relative wby-overflow-hidden"
+  }, /*#__PURE__*/React.createElement(Header, {
+    isRoot: isRoot,
+    title: !list.isListLoading ? list.listTitle : undefined,
+    canCreateFolder: canCreateFolder(folderId),
+    canCreateContent: canCreateContent(folderId),
+    onCreateEntry: createEntry,
+    onCreateFolder: onCreateFolder,
+    searchValue: list.search,
+    onSearchChange: list.setSearch
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "wby-w-full wby-overflow-hidden wby-absolute wby-top-0 wby-bottom-0 wby-left-0",
+    style: {
+      top: "105px"
+    }
+  }, /*#__PURE__*/React.createElement(BulkActions, null), /*#__PURE__*/React.createElement(Filters, null), list.records.length === 0 && list.folders.length === 0 && !list.isListLoading ? /*#__PURE__*/React.createElement(Empty, {
+    isSearch: list.isSearch,
+    canCreateFolder: canCreateFolder(folderId),
+    canCreateContent: canCreateContent(folderId),
+    onCreateEntry: createEntry,
+    onCreateFolder: onCreateFolder
+  }) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Scrollbar, {
+    "data-testid": "default-data-list",
+    onScrollFrame: scrollFrame => loadMoreOnScroll({
+      scrollFrame
+    })
+  }, /*#__PURE__*/React.createElement(Table, {
+    ref: tableRef
+  }), /*#__PURE__*/React.createElement(LoadMoreButton, {
+    show: !list.isListLoading && list.meta.hasMoreItems,
+    disabled: list.isListLoadingMore,
+    windowHeight: windowHeight,
+    tableHeight: tableHeight,
+    onClick: list.listMoreRecords
+  })), /*#__PURE__*/React.createElement(BottomInfoBar, {
+    loading: list.isListLoading,
+    loadingMore: list.isListLoadingMore,
+    totalCount: list.meta.totalCount,
+    currentCount: list.records.length
+  })))));
+};
+
+//# sourceMappingURL=Main.js.map

package/admin/views/contentEntries/Table/Main.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useEffect","useRef","useState","debounce","useCreateDialog","useGetFolderLevelPermission","Scrollbar","Empty","Filters","Header","LoadMoreButton","Table","useContentEntriesList","useContentEntry","ContentEntry","useRouter","ROOT_FOLDER","BulkActions","BottomInfoBar","Main","folderId","initialFolderId","undefined","isRoot","list","showDialog","showCreateFolderDialog","history","canCreate","contentModel","getFolderLevelPermission","canManageContent","canManageStructure","canCreateFolder","canCreateContent","createEntry","folder","encodeURIComponent","push","modelId","innerHeight","windowHeight","window","tableHeight","setTableHeight","tableRef","current","clientHeight","loadMoreOnScroll","scrollFrame","top","listMoreRecords","onCreateFolder","currentParentId","showEmptyView","createElement","Fragment","className","title","isListLoading","listTitle","onCreateEntry","searchValue","search","onSearchChange","setSearch","style","records","length","folders","isSearch","onScrollFrame","ref","show","meta","hasMoreItems","disabled","isListLoadingMore","onClick","loading","loadingMore","totalCount","currentCount"],"sources":["Main.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport debounce from \"lodash/debounce\";\nimport { useCreateDialog, useGetFolderLevelPermission } from \"@webiny/app-aco\";\nimport { Scrollbar } from \"@webiny/admin-ui\";\nimport { Empty } from \"~/admin/components/ContentEntries/Empty\";\nimport { Filters } from \"~/admin/components/ContentEntries/Filters\";\nimport { Header } from \"~/admin/components/ContentEntries/Header\";\nimport { LoadMoreButton } from \"~/admin/components/ContentEntries/LoadMoreButton\";\nimport { Table } from \"~/admin/components/ContentEntries/Table\";\nimport { useContentEntriesList, useContentEntry } from \"~/admin/views/contentEntries/hooks\";\nimport { ContentEntry } from \"~/admin/views/contentEntries/ContentEntry\";\nimport { useRouter } from \"@webiny/react-router\";\nimport { ROOT_FOLDER } from \"~/admin/constants\";\nimport { BulkActions } from \"~/admin/components/ContentEntries/BulkActions\";\nimport { BottomInfoBar } from \"~/admin/components/ContentEntries/BottomInfoBar\";\n\ninterface MainProps {\n    folderId?: string;\n}\n\nexport const Main = ({ folderId: initialFolderId }: MainProps) => {\n    const folderId = initialFolderId === undefined ? ROOT_FOLDER : initialFolderId;\n    const isRoot = initialFolderId === ROOT_FOLDER;\n    const list = useContentEntriesList();\n    const { showDialog: showCreateFolderDialog } = useCreateDialog();\n\n    const { history } = useRouter();\n\n    // We check permissions on two layers - security and folder level permissions.\n    const { canCreate, contentModel } = useContentEntry();\n    const { getFolderLevelPermission: canManageContent } =\n        useGetFolderLevelPermission(\"canManageContent\");\n    const { getFolderLevelPermission: canManageStructure } =\n        useGetFolderLevelPermission(\"canManageStructure\");\n\n    const canCreateFolder = useCallback(\n        (folderId: string) => {\n            return canManageStructure(folderId);\n        },\n        [canManageStructure]\n    );\n\n    const canCreateContent = useCallback(\n        (folderId: string) => {\n            return canCreate && canManageContent(folderId);\n        },\n        [canManageContent, canCreate]\n    );\n\n    const createEntry = useCallback(() => {\n        const folder = folderId ? `&folderId=${encodeURIComponent(folderId)}` : \"\";\n        history.push(`/cms/content-entries/${contentModel.modelId}?new=true${folder}`);\n    }, [canCreate, contentModel, folderId]);\n\n    const { innerHeight: windowHeight } = window;\n    const [tableHeight, setTableHeight] = useState(0);\n    const tableRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n        setTableHeight(tableRef?.current?.clientHeight || 0);\n\n        return () => {\n            setTableHeight(0);\n        };\n    });\n\n    const loadMoreOnScroll = debounce(async ({ scrollFrame }) => {\n        if (scrollFrame.top > 0.8) {\n            await list.listMoreRecords();\n        }\n    }, 200);\n\n    const onCreateFolder = useCallback(() => {\n        showCreateFolderDialog({ currentParentId: folderId });\n    }, [folderId]);\n\n    const { showEmptyView } = useContentEntry();\n\n    if (!showEmptyView) {\n        return <ContentEntry />;\n    }\n\n    return (\n        <>\n            <div className={\"wby-h-full wby-relative wby-overflow-hidden\"}>\n                <Header\n                    isRoot={isRoot}\n                    title={!list.isListLoading ? list.listTitle : undefined}\n                    canCreateFolder={canCreateFolder(folderId)}\n                    canCreateContent={canCreateContent(folderId)}\n                    onCreateEntry={createEntry}\n                    onCreateFolder={onCreateFolder}\n                    searchValue={list.search}\n                    onSearchChange={list.setSearch}\n                />\n                <div\n                    className={\n                        \"wby-w-full wby-overflow-hidden wby-absolute wby-top-0 wby-bottom-0 wby-left-0\"\n                    }\n                    style={{ top: \"105px\" }}\n                >\n                    <BulkActions />\n                    <Filters />\n                    {list.records.length === 0 &&\n                    list.folders.length === 0 &&\n                    !list.isListLoading ? (\n                        <Empty\n                            isSearch={list.isSearch}\n                            canCreateFolder={canCreateFolder(folderId)}\n                            canCreateContent={canCreateContent(folderId)}\n                            onCreateEntry={createEntry}\n                            onCreateFolder={onCreateFolder}\n                        />\n                    ) : (\n                        <>\n                            <Scrollbar\n                                data-testid=\"default-data-list\"\n                                onScrollFrame={scrollFrame => loadMoreOnScroll({ scrollFrame })}\n                            >\n                                <Table ref={tableRef} />\n                                <LoadMoreButton\n                                    show={!list.isListLoading && list.meta.hasMoreItems}\n                                    disabled={list.isListLoadingMore}\n                                    windowHeight={windowHeight}\n                                    tableHeight={tableHeight}\n                                    onClick={list.listMoreRecords}\n                                />\n                            </Scrollbar>\n                            <BottomInfoBar\n                                loading={list.isListLoading}\n                                loadingMore={list.isListLoadingMore}\n                                totalCount={list.meta.totalCount}\n                                currentCount={list.records.length}\n                            />\n                        </>\n                    )}\n                </div>\n            </div>\n        </>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/admin/views/contentEntries/Table/Sidebar.d.ts

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

package/admin/views/contentEntries/Table/Sidebar.js

@@ -0,0 +1,11 @@
+import React from "react";
+import { SidebarHeader } from "../../../components/ContentEntries/SidebarHeader";
+import { SidebarContent } from "../../../components/ContentEntries/SidebarContent";
+import { SidebarFooter } from "../../../components/ContentEntries/SidebarFooter/SidebarFooter";
+export const Sidebar = () => {
+  return /*#__PURE__*/React.createElement("div", {
+    className: "wby-flex wby-flex-col wby-h-main-content"
+  }, /*#__PURE__*/React.createElement(SidebarHeader, null), /*#__PURE__*/React.createElement(SidebarContent, null), /*#__PURE__*/React.createElement(SidebarFooter, null));
+};
+
+//# sourceMappingURL=Sidebar.js.map

package/admin/views/contentEntries/Table/Sidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","SidebarHeader","SidebarContent","SidebarFooter","Sidebar","createElement","className"],"sources":["Sidebar.tsx"],"sourcesContent":["import React from \"react\";\nimport { SidebarHeader } from \"~/admin/components/ContentEntries/SidebarHeader\";\nimport { SidebarContent } from \"~/admin/components/ContentEntries/SidebarContent\";\nimport { SidebarFooter } from \"~/admin/components/ContentEntries/SidebarFooter/SidebarFooter\";\n\nexport const Sidebar = () => {\n    return (\n        <div className={\"wby-flex wby-flex-col wby-h-main-content\"}>\n            <SidebarHeader />\n            <SidebarContent />\n            <SidebarFooter />\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,aAAa;AACtB,SAASC,cAAc;AACvB,SAASC,aAAa;AAEtB,OAAO,MAAMC,OAAO,GAAGA,CAAA,KAAM;EACzB,oBACIJ,KAAA,CAAAK,aAAA;IAAKC,SAAS,EAAE;EAA2C,gBACvDN,KAAA,CAAAK,aAAA,CAACJ,aAAa,MAAE,CAAC,eACjBD,KAAA,CAAAK,aAAA,CAACH,cAAc,MAAE,CAAC,eAClBF,KAAA,CAAAK,aAAA,CAACF,aAAa,MAAE,CACf,CAAC;AAEd,CAAC","ignoreList":[]}

package/admin/views/contentEntries/Table/index.d.ts

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

package/admin/views/contentEntries/Table/index.js

@@ -0,0 +1,75 @@
+import React, { useCallback } from "react";
+import { LeftPanel, RightPanel, SplitView } from "@webiny/app-admin/components/SplitView";
+import { Sidebar } from "./Sidebar";
+import { Main } from "./Main";
+import { ContentEntryProvider } from "../ContentEntry/ContentEntryContext";
+import { AcoProvider, useNavigateFolder } from "@webiny/app-aco";
+import { useI18N } from "@webiny/app-i18n";
+import { useTenancy } from "@webiny/app-tenancy";
+import { useApolloClient, useModel } from "../../../hooks";
+import { ContentEntriesListProvider } from "../hooks";
+import { CMS_ENTRY_LIST_LINK, LOCAL_STORAGE_LATEST_VISITED_FOLDER } from "../../../constants";
+
+/**
+ * Generates a `layoutId` to be used with the `<SplitView />` component.
+ * The `layoutId` is essential for saving user preferences into localStorage.
+ * The generation of the `layoutId` takes into account the current `tenantId`, `localeCode`, and the provided `applicationId`.
+ *
+ *  TODO: export the useLayoutId from a generic use package, such as app-admin. At the moment is not possible because of circular dependency issues.
+ */
+const useLayoutId = applicationId => {
+  const {
+    tenant
+  } = useTenancy();
+  const {
+    getCurrentLocale
+  } = useI18N();
+  const localeCode = getCurrentLocale("content");
+  if (!tenant || !localeCode) {
+    console.warn("Missing tenant or localeCode while creating layoutId");
+    return null;
+  }
+  return `T#${tenant}#L#${localeCode}#A#${applicationId}`;
+};
+const View = () => {
+  const {
+    currentFolderId
+  } = useNavigateFolder();
+  const {
+    model
+  } = useModel();
+  const layoutId = useLayoutId(`cms:${model.modelId}`);
+  return /*#__PURE__*/React.createElement(SplitView, {
+    layoutId: layoutId
+  }, /*#__PURE__*/React.createElement(LeftPanel, {
+    span: 2
+  }, /*#__PURE__*/React.createElement(Sidebar, null)), /*#__PURE__*/React.createElement(RightPanel, {
+    span: 10
+  }, /*#__PURE__*/React.createElement(ContentEntryProvider, {
+    currentFolderId: currentFolderId
+  }, /*#__PURE__*/React.createElement(Main, {
+    folderId: currentFolderId
+  }))));
+};
+export const Table = () => {
+  const {
+    model
+  } = useModel();
+  const client = useApolloClient();
+  const createNavigateFolderListLink = useCallback(() => {
+    return `${CMS_ENTRY_LIST_LINK}/${model.modelId}`;
+  }, [model.modelId]);
+  const createNavigateFolderStorageKey = useCallback(() => {
+    return `${LOCAL_STORAGE_LATEST_VISITED_FOLDER}_${model.modelId}`;
+  }, [model.modelId]);
+  return /*#__PURE__*/React.createElement(AcoProvider, {
+    id: `cms:${model.modelId}`,
+    folderIdPath: "wbyAco_location.folderId",
+    client: client,
+    model: model,
+    createNavigateFolderListLink: createNavigateFolderListLink,
+    createNavigateFolderStorageKey: createNavigateFolderStorageKey
+  }, /*#__PURE__*/React.createElement(ContentEntriesListProvider, null, /*#__PURE__*/React.createElement(View, null)));
+};
+
+//# sourceMappingURL=index.js.map

package/admin/views/contentEntries/Table/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","LeftPanel","RightPanel","SplitView","Sidebar","Main","ContentEntryProvider","AcoProvider","useNavigateFolder","useI18N","useTenancy","useApolloClient","useModel","ContentEntriesListProvider","CMS_ENTRY_LIST_LINK","LOCAL_STORAGE_LATEST_VISITED_FOLDER","useLayoutId","applicationId","tenant","getCurrentLocale","localeCode","console","warn","View","currentFolderId","model","layoutId","modelId","createElement","span","folderId","Table","client","createNavigateFolderListLink","createNavigateFolderStorageKey","id","folderIdPath"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { LeftPanel, RightPanel, SplitView } from \"@webiny/app-admin/components/SplitView\";\nimport { Sidebar } from \"./Sidebar\";\nimport { Main } from \"./Main\";\nimport { ContentEntryProvider } from \"~/admin/views/contentEntries/ContentEntry/ContentEntryContext\";\nimport { AcoProvider, useNavigateFolder } from \"@webiny/app-aco\";\nimport { useI18N } from \"@webiny/app-i18n\";\nimport { useTenancy } from \"@webiny/app-tenancy\";\nimport { useApolloClient, useModel } from \"~/admin/hooks\";\nimport { ContentEntriesListProvider } from \"~/admin/views/contentEntries/hooks\";\nimport { CMS_ENTRY_LIST_LINK, LOCAL_STORAGE_LATEST_VISITED_FOLDER } from \"~/admin/constants\";\n\n/**\n * Generates a `layoutId` to be used with the `<SplitView />` component.\n * The `layoutId` is essential for saving user preferences into localStorage.\n * The generation of the `layoutId` takes into account the current `tenantId`, `localeCode`, and the provided `applicationId`.\n *\n *  TODO: export the useLayoutId from a generic use package, such as app-admin. At the moment is not possible because of circular dependency issues.\n */\nconst useLayoutId = (applicationId: string) => {\n    const { tenant } = useTenancy();\n    const { getCurrentLocale } = useI18N();\n    const localeCode = getCurrentLocale(\"content\");\n\n    if (!tenant || !localeCode) {\n        console.warn(\"Missing tenant or localeCode while creating layoutId\");\n        return null;\n    }\n\n    return `T#${tenant}#L#${localeCode}#A#${applicationId}`;\n};\n\nconst View = () => {\n    const { currentFolderId } = useNavigateFolder();\n    const { model } = useModel();\n    const layoutId = useLayoutId(`cms:${model.modelId}`);\n\n    return (\n        <SplitView layoutId={layoutId}>\n            <LeftPanel span={2}>\n                <Sidebar />\n            </LeftPanel>\n            <RightPanel span={10}>\n                <ContentEntryProvider currentFolderId={currentFolderId}>\n                    <Main folderId={currentFolderId} />\n                </ContentEntryProvider>\n            </RightPanel>\n        </SplitView>\n    );\n};\n\nexport const Table = () => {\n    const { model } = useModel();\n    const client = useApolloClient();\n\n    const createNavigateFolderListLink = useCallback(() => {\n        return `${CMS_ENTRY_LIST_LINK}/${model.modelId}`;\n    }, [model.modelId]);\n    const createNavigateFolderStorageKey = useCallback(() => {\n        return `${LOCAL_STORAGE_LATEST_VISITED_FOLDER}_${model.modelId}`;\n    }, [model.modelId]);\n\n    return (\n        <AcoProvider\n            id={`cms:${model.modelId}`}\n            folderIdPath={\"wbyAco_location.folderId\"}\n            client={client}\n            model={model}\n            createNavigateFolderListLink={createNavigateFolderListLink}\n            createNavigateFolderStorageKey={createNavigateFolderStorageKey}\n        >\n            <ContentEntriesListProvider>\n                <View />\n            </ContentEntriesListProvider>\n        </AcoProvider>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,SAASC,SAAS,EAAEC,UAAU,EAAEC,SAAS,QAAQ,wCAAwC;AACzF,SAASC,OAAO;AAChB,SAASC,IAAI;AACb,SAASC,oBAAoB;AAC7B,SAASC,WAAW,EAAEC,iBAAiB,QAAQ,iBAAiB;AAChE,SAASC,OAAO,QAAQ,kBAAkB;AAC1C,SAASC,UAAU,QAAQ,qBAAqB;AAChD,SAASC,eAAe,EAAEC,QAAQ;AAClC,SAASC,0BAA0B;AACnC,SAASC,mBAAmB,EAAEC,mCAAmC;;AAEjE;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,WAAW,GAAIC,aAAqB,IAAK;EAC3C,MAAM;IAAEC;EAAO,CAAC,GAAGR,UAAU,CAAC,CAAC;EAC/B,MAAM;IAAES;EAAiB,CAAC,GAAGV,OAAO,CAAC,CAAC;EACtC,MAAMW,UAAU,GAAGD,gBAAgB,CAAC,SAAS,CAAC;EAE9C,IAAI,CAACD,MAAM,IAAI,CAACE,UAAU,EAAE;IACxBC,OAAO,CAACC,IAAI,CAAC,sDAAsD,CAAC;IACpE,OAAO,IAAI;EACf;EAEA,OAAO,KAAKJ,MAAM,MAAME,UAAU,MAAMH,aAAa,EAAE;AAC3D,CAAC;AAED,MAAMM,IAAI,GAAGA,CAAA,KAAM;EACf,MAAM;IAAEC;EAAgB,CAAC,GAAGhB,iBAAiB,CAAC,CAAC;EAC/C,MAAM;IAAEiB;EAAM,CAAC,GAAGb,QAAQ,CAAC,CAAC;EAC5B,MAAMc,QAAQ,GAAGV,WAAW,CAAC,OAAOS,KAAK,CAACE,OAAO,EAAE,CAAC;EAEpD,oBACI5B,KAAA,CAAA6B,aAAA,CAACzB,SAAS;IAACuB,QAAQ,EAAEA;EAAS,gBAC1B3B,KAAA,CAAA6B,aAAA,CAAC3B,SAAS;IAAC4B,IAAI,EAAE;EAAE,gBACf9B,KAAA,CAAA6B,aAAA,CAACxB,OAAO,MAAE,CACH,CAAC,eACZL,KAAA,CAAA6B,aAAA,CAAC1B,UAAU;IAAC2B,IAAI,EAAE;EAAG,gBACjB9B,KAAA,CAAA6B,aAAA,CAACtB,oBAAoB;IAACkB,eAAe,EAAEA;EAAgB,gBACnDzB,KAAA,CAAA6B,aAAA,CAACvB,IAAI;IAACyB,QAAQ,EAAEN;EAAgB,CAAE,CAChB,CACd,CACL,CAAC;AAEpB,CAAC;AAED,OAAO,MAAMO,KAAK,GAAGA,CAAA,KAAM;EACvB,MAAM;IAAEN;EAAM,CAAC,GAAGb,QAAQ,CAAC,CAAC;EAC5B,MAAMoB,MAAM,GAAGrB,eAAe,CAAC,CAAC;EAEhC,MAAMsB,4BAA4B,GAAGjC,WAAW,CAAC,MAAM;IACnD,OAAO,GAAGc,mBAAmB,IAAIW,KAAK,CAACE,OAAO,EAAE;EACpD,CAAC,EAAE,CAACF,KAAK,CAACE,OAAO,CAAC,CAAC;EACnB,MAAMO,8BAA8B,GAAGlC,WAAW,CAAC,MAAM;IACrD,OAAO,GAAGe,mCAAmC,IAAIU,KAAK,CAACE,OAAO,EAAE;EACpE,CAAC,EAAE,CAACF,KAAK,CAACE,OAAO,CAAC,CAAC;EAEnB,oBACI5B,KAAA,CAAA6B,aAAA,CAACrB,WAAW;IACR4B,EAAE,EAAE,OAAOV,KAAK,CAACE,OAAO,EAAG;IAC3BS,YAAY,EAAE,0BAA2B;IACzCJ,MAAM,EAAEA,MAAO;IACfP,KAAK,EAAEA,KAAM;IACbQ,4BAA4B,EAAEA,4BAA6B;IAC3DC,8BAA8B,EAAEA;EAA+B,gBAE/DnC,KAAA,CAAA6B,aAAA,CAACf,0BAA0B,qBACvBd,KAAA,CAAA6B,aAAA,CAACL,IAAI,MAAE,CACiB,CACnB,CAAC;AAEtB,CAAC","ignoreList":[]}

package/admin/views/contentEntries/ValidationIndicators.d.ts

@@ -0,0 +1,25 @@
+import React from "react";
+import type { FormValidation } from "@webiny/form";
+export interface ValidationIndicatorsProps {
+    invalidFields: FormValidation;
+    className?: string;
+}
+export declare const ValidationIndicators: (({ invalidFields, className }: ValidationIndicatorsProps) => React.JSX.Element) & {
+    original: ({ invalidFields, className }: ValidationIndicatorsProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: (({ invalidFields, className }: ValidationIndicatorsProps) => React.JSX.Element) & {
+        original: ({ invalidFields, className }: ValidationIndicatorsProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(({ invalidFields, className }: ValidationIndicatorsProps) => React.JSX.Element) & {
+        original: ({ invalidFields, className }: ValidationIndicatorsProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};

package/admin/views/contentEntries/ValidationIndicators.js

@@ -0,0 +1,54 @@
+import React, { useEffect } from "react";
+import { makeDecoratable } from "@webiny/react-composition";
+import { Global, css } from "@emotion/react";
+
+// To customize the icon, define a CSS variable within the validation class:
+// .wby-content-entry-invalid-field {
+//     --error-icon: "🤔"
+// }
+// To customize the border color, use the Admin UI Colors APIs to override the default `destructive` color palette.
+
+const errorColor = `hsl(var(--border-destructive-default))`;
+const errorIcon = `var(--error-icon, "⚠️")`;
+const errorTitleMixin = `
+    content: ${errorIcon}!important;
+    margin-right: var(--spacing-xs-plus)!important;
+`;
+const noErrorTitleMixin = `
+    content: "";
+    margin: 0;
+`;
+const errorBorderMixin = `
+    border: 1px solid ${errorColor};
+`;
+const defaultClass = /*#__PURE__*/css(".wby-content-entry-invalid-field{.webiny_label-invalid{left:var(--spacing-sm-extra);.webiny_label-text::before{", errorTitleMixin, ";}}.webiny_accordion-item-title::before{", errorTitleMixin, ";}.webiny_accordion-title-text::before{", errorTitleMixin, ";}>hcms-parent-field-provider .webiny_group-label-text::before{", errorTitleMixin, ";}&[data-field-renderer=\"radio-buttons\"]{[role=\"radiogroup\"] .webiny_label-text::before{", noErrorTitleMixin, ";}}&[data-field-renderer=\"checkboxes\"]{[role=\"checkbox\"]+label .webiny_label-text::before{", noErrorTitleMixin, ";}}}.wby-content-entry-invalid-field[data-field-type=\"ref\"]{.webiny_group-label-text::before{", errorTitleMixin, ";}.webiny_ref-field-container{", errorBorderMixin, ";}&[data-field-renderer=\"ref-simple-single\"]{[role=\"radiogroup\"] .webiny_label-text::before{", noErrorTitleMixin, ";}[role=\"checkbox\"]+label .webiny_label-text::before{", noErrorTitleMixin, ";}}}.wby-content-entry-invalid-field[data-field-type=\"object\"]{&[data-field-renderer=\"object\"],&[data-field-renderer=\"objects\"]{.webiny_group-label-text::before{", errorTitleMixin, ";}label{left:0;.webiny_label-text::before{", noErrorTitleMixin, ";}}}}" + (process.env.NODE_ENV === "production" ? "" : ";label:defaultClass;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlZhbGlkYXRpb25JbmRpY2F0b3JzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0QndCIiwiZmlsZSI6IlZhbGlkYXRpb25JbmRpY2F0b3JzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyB1c2VFZmZlY3QgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCB0eXBlIHsgRm9ybVZhbGlkYXRpb24gfSBmcm9tIFwiQHdlYmlueS9mb3JtXCI7XG5pbXBvcnQgeyBtYWtlRGVjb3JhdGFibGUgfSBmcm9tIFwiQHdlYmlueS9yZWFjdC1jb21wb3NpdGlvblwiO1xuaW1wb3J0IHsgR2xvYmFsLCBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcblxuLy8gVG8gY3VzdG9taXplIHRoZSBpY29uLCBkZWZpbmUgYSBDU1MgdmFyaWFibGUgd2l0aGluIHRoZSB2YWxpZGF0aW9uIGNsYXNzOlxuLy8gLndieS1jb250ZW50LWVudHJ5LWludmFsaWQtZmllbGQge1xuLy8gICAgIC0tZXJyb3ItaWNvbjogXCLwn6SUXCJcbi8vIH1cbi8vIFRvIGN1c3RvbWl6ZSB0aGUgYm9yZGVyIGNvbG9yLCB1c2UgdGhlIEFkbWluIFVJIENvbG9ycyBBUElzIHRvIG92ZXJyaWRlIHRoZSBkZWZhdWx0IGBkZXN0cnVjdGl2ZWAgY29sb3IgcGFsZXR0ZS5cblxuY29uc3QgZXJyb3JDb2xvciA9IGBoc2wodmFyKC0tYm9yZGVyLWRlc3RydWN0aXZlLWRlZmF1bHQpKWA7XG5jb25zdCBlcnJvckljb24gPSBgdmFyKC0tZXJyb3ItaWNvbiwgXCLimqDvuI9cIilgO1xuXG5jb25zdCBlcnJvclRpdGxlTWl4aW4gPSBgXG4gICAgY29udGVudDogJHtlcnJvckljb259IWltcG9ydGFudDtcbiAgICBtYXJnaW4tcmlnaHQ6IHZhcigtLXNwYWNpbmcteHMtcGx1cykhaW1wb3J0YW50O1xuYDtcblxuY29uc3Qgbm9FcnJvclRpdGxlTWl4aW4gPSBgXG4gICAgY29udGVudDogXCJcIjtcbiAgICBtYXJnaW46IDA7XG5gO1xuXG5jb25zdCBlcnJvckJvcmRlck1peGluID0gYFxuICAgIGJvcmRlcjogMXB4IHNvbGlkICR7ZXJyb3JDb2xvcn07XG5gO1xuXG5jb25zdCBkZWZhdWx0Q2xhc3MgPSBjc3NgXG4gICAgLndieS1jb250ZW50LWVudHJ5LWludmFsaWQtZmllbGQge1xuICAgICAgICAvLyBEZWZhdWx0IGZpZWxkc1xuICAgICAgICAud2ViaW55X2xhYmVsLWludmFsaWQge1xuICAgICAgICAgICAgbGVmdDogdmFyKC0tc3BhY2luZy1zbS1leHRyYSk7XG5cbiAgICAgICAgICAgIC53ZWJpbnlfbGFiZWwtdGV4dDo6YmVmb3JlIHtcbiAgICAgICAgICAgICAgICAke2Vycm9yVGl0bGVNaXhpbn1cbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuXG4gICAgICAgIC8vIGFjY29yZGlvblxuICAgICAgICAud2ViaW55X2FjY29yZGlvbi1pdGVtLXRpdGxlOjpiZWZvcmUge1xuICAgICAgICAgICAgJHtlcnJvclRpdGxlTWl4aW59XG4gICAgICAgIH1cbiAgICAgICAgLndlYmlueV9hY2NvcmRpb24tdGl0bGUtdGV4dDo6YmVmb3JlIHtcbiAgICAgICAgICAgICR7ZXJyb3JUaXRsZU1peGlufVxuICAgICAgICB9XG5cbiAgICAgICAgLy8gbXVsdGlwbGUgZW50cmllc1xuICAgICAgICA+IGhjbXMtcGFyZW50LWZpZWxkLXByb3ZpZGVyIC53ZWJpbnlfZ3JvdXAtbGFiZWwtdGV4dDo6YmVmb3JlIHtcbiAgICAgICAgICAgICR7ZXJyb3JUaXRsZU1peGlufVxuICAgICAgICB9XG5cbiAgICAgICAgLy8gcmFkaW8gYnV0dG9uc1xuICAgICAgICAmW2RhdGEtZmllbGQtcmVuZGVyZXI9XCJyYWRpby1idXR0b25zXCJdIHtcbiAgICAgICAgICAgIFtyb2xlPVwicmFkaW9ncm91cFwiXSAud2ViaW55X2xhYmVsLXRleHQ6OmJlZm9yZSB7XG4gICAgICAgICAgICAgICAgJHtub0Vycm9yVGl0bGVNaXhpbn1cbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuXG4gICAgICAgIC8vIGNoZWNrYm94ZXNcbiAgICAgICAgJltkYXRhLWZpZWxkLXJlbmRlcmVyPVwiY2hlY2tib3hlc1wiXSB7XG4gICAgICAgICAgICBbcm9sZT1cImNoZWNrYm94XCJdICsgbGFiZWwgLndlYmlueV9sYWJlbC10ZXh0OjpiZWZvcmUge1xuICAgICAgICAgICAgICAgICR7bm9FcnJvclRpdGxlTWl4aW59XG4gICAgICAgICAgICB9XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICAvLyByZWZlcmVuY2UgZmllbGRcbiAgICAud2J5LWNvbnRlbnQtZW50cnktaW52YWxpZC1maWVsZFtkYXRhLWZpZWxkLXR5cGU9XCJyZWZcIl0ge1xuICAgICAgICAud2ViaW55X2dyb3VwLWxhYmVsLXRleHQ6OmJlZm9yZSB7XG4gICAgICAgICAgICAke2Vycm9yVGl0bGVNaXhpbn1cbiAgICAgICAgfVxuXG4gICAgICAgIC53ZWJpbnlfcmVmLWZpZWxkLWNvbnRhaW5lciB7XG4gICAgICAgICAgICAke2Vycm9yQm9yZGVyTWl4aW59XG4gICAgICAgIH1cblxuICAgICAgICAmW2RhdGEtZmllbGQtcmVuZGVyZXI9XCJyZWYtc2ltcGxlLXNpbmdsZVwiXSB7XG4gICAgICAgICAgICBbcm9sZT1cInJhZGlvZ3JvdXBcIl0gLndlYmlueV9sYWJlbC10ZXh0OjpiZWZvcmUge1xuICAgICAgICAgICAgICAgICR7bm9FcnJvclRpdGxlTWl4aW59XG4gICAgICAgICAgICB9XG5cbiAgICAgICAgICAgIFtyb2xlPVwiY2hlY2tib3hcIl0gKyBsYWJlbCAud2ViaW55X2xhYmVsLXRleHQ6OmJlZm9yZSB7XG4gICAgICAgICAgICAgICAgJHtub0Vycm9yVGl0bGVNaXhpbn1cbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgIH1cblxuICAgIC8vIE9iamVjdCBmaWVsZFxuICAgIC53YnktY29udGVudC1lbnRyeS1pbnZhbGlkLWZpZWxkW2RhdGEtZmllbGQtdHlwZT1cIm9iamVjdFwiXSB7XG4gICAgICAgICZbZGF0YS1maWVsZC1yZW5kZXJlcj1cIm9iamVjdFwiXSxcbiAgICAgICAgJltkYXRhLWZpZWxkLXJlbmRlcmVyPVwib2JqZWN0c1wiXSB7XG4gICAgICAgICAgICAud2ViaW55X2dyb3VwLWxhYmVsLXRleHQ6OmJlZm9yZSB7XG4gICAgICAgICAgICAgICAgJHtlcnJvclRpdGxlTWl4aW59XG4gICAgICAgICAgICB9XG5cbiAgICAgICAgICAgIGxhYmVsIHtcbiAgICAgICAgICAgICAgICBsZWZ0OiAwO1xuXG4gICAgICAgICAgICAgICAgLndlYmlueV9sYWJlbC10ZXh0OjpiZWZvcmUge1xuICAgICAgICAgICAgICAgICAgICAke25vRXJyb3JUaXRsZU1peGlufVxuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgIH1cbmA7XG5cbmV4cG9ydCBpbnRlcmZhY2UgVmFsaWRhdGlvbkluZGljYXRvcnNQcm9wcyB7XG4gICAgaW52YWxpZEZpZWxkczogRm9ybVZhbGlkYXRpb247XG4gICAgY2xhc3NOYW1lPzogc3RyaW5nO1xufVxuXG5leHBvcnQgY29uc3QgVmFsaWRhdGlvbkluZGljYXRvcnMgPSBtYWtlRGVjb3JhdGFibGUoXG4gICAgXCJWYWxpZGF0aW9uSW5kaWNhdG9yc1wiLFxuICAgICh7XG4gICAgICAgIGludmFsaWRGaWVsZHMsXG4gICAgICAgIGNsYXNzTmFtZSA9IFwid2J5LWNvbnRlbnQtZW50cnktaW52YWxpZC1maWVsZFwiXG4gICAgfTogVmFsaWRhdGlvbkluZGljYXRvcnNQcm9wcykgPT4ge1xuICAgICAgICBjb25zdCB2aXN1YWxpemVEb21CeVBhdGggPSAocGF0aDogc3RyaW5nKSA9PiB7XG4gICAgICAgICAgICBjb25zdCBzZWxlY3RvciA9IGBoY21zLWZpZWxkLXZhbGlkYXRpb25bZGF0YS1wYXRoPVwiJHtwYXRofVwiXWA7XG4gICAgICAgICAgICBjb25zdCBtYXJrZXIgPSBBcnJheS5mcm9tKGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3JBbGwoc2VsZWN0b3IpLnZhbHVlcygpKVswXTtcbiAgICAgICAgICAgIGlmIChtYXJrZXIpIHtcbiAgICAgICAgICAgICAgICBtYXJrZXIuY2xhc3NMaXN0LmFkZChjbGFzc05hbWUpO1xuICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICBpZiAocGF0aC5pbmNsdWRlcyhcIi5cIikpIHtcbiAgICAgICAgICAgICAgICBjb25zdCBwYXRocyA9IHBhdGguc3BsaXQoXCIuXCIpO1xuICAgICAgICAgICAgICAgIGNvbnN0IHBhcmVudFBhdGggPSBwYXRocy5zbGljZSgwLCBwYXRocy5sZW5ndGggLSAxKTtcbiAgICAgICAgICAgICAgICB2aXN1YWxpemVEb21CeVBhdGgocGFyZW50UGF0aC5qb2luKFwiLlwiKSk7XG4gICAgICAgICAgICB9XG4gICAgICAgIH07XG5cbiAgICAgICAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICAgICAgICAgIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3JBbGwoYC4ke2NsYXNzTmFtZX1gKS5mb3JFYWNoKGVsID0+IHtcbiAgICAgICAgICAgICAgICBlbC5jbGFzc0xpc3QucmVtb3ZlKGNsYXNzTmFtZSk7XG4gICAgICAgICAgICB9KTtcblxuICAgICAgICAgICAgZm9yIChjb25zdCBrZXkgb2YgT2JqZWN0LmtleXMoaW52YWxpZEZpZWxkcykpIHtcbiAgICAgICAgICAgICAgICB2aXN1YWxpemVEb21CeVBhdGgoa2V5KTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfSwgW2ludmFsaWRGaWVsZHNdKTtcblxuICAgICAgICByZXR1cm4gPEdsb2JhbCBzdHlsZXM9e2RlZmF1bHRDbGFzc30gLz47XG4gICAgfVxuKTtcbiJdfQ== */");
+export const ValidationIndicators = makeDecoratable("ValidationIndicators", ({
+  invalidFields,
+  className = "wby-content-entry-invalid-field"
+}) => {
+  const visualizeDomByPath = path => {
+    const selector = `hcms-field-validation[data-path="${path}"]`;
+    const marker = Array.from(document.querySelectorAll(selector).values())[0];
+    if (marker) {
+      marker.classList.add(className);
+    }
+    if (path.includes(".")) {
+      const paths = path.split(".");
+      const parentPath = paths.slice(0, paths.length - 1);
+      visualizeDomByPath(parentPath.join("."));
+    }
+  };
+  useEffect(() => {
+    document.querySelectorAll(`.${className}`).forEach(el => {
+      el.classList.remove(className);
+    });
+    for (const key of Object.keys(invalidFields)) {
+      visualizeDomByPath(key);
+    }
+  }, [invalidFields]);
+  return /*#__PURE__*/React.createElement(Global, {
+    styles: defaultClass
+  });
+});
+
+//# sourceMappingURL=ValidationIndicators.js.map

package/admin/views/contentEntries/ValidationIndicators.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","makeDecoratable","Global","css","errorColor","errorIcon","errorTitleMixin","noErrorTitleMixin","errorBorderMixin","defaultClass","process","env","NODE_ENV","ValidationIndicators","invalidFields","className","visualizeDomByPath","path","selector","marker","Array","from","document","querySelectorAll","values","classList","add","includes","paths","split","parentPath","slice","length","join","forEach","el","remove","key","Object","keys","createElement","styles"],"sources":["ValidationIndicators.tsx"],"sourcesContent":["import React, { useEffect } from \"react\";\nimport type { FormValidation } from \"@webiny/form\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport { Global, css } from \"@emotion/react\";\n\n// To customize the icon, define a CSS variable within the validation class:\n// .wby-content-entry-invalid-field {\n//     --error-icon: \"🤔\"\n// }\n// To customize the border color, use the Admin UI Colors APIs to override the default `destructive` color palette.\n\nconst errorColor = `hsl(var(--border-destructive-default))`;\nconst errorIcon = `var(--error-icon, \"⚠️\")`;\n\nconst errorTitleMixin = `\n    content: ${errorIcon}!important;\n    margin-right: var(--spacing-xs-plus)!important;\n`;\n\nconst noErrorTitleMixin = `\n    content: \"\";\n    margin: 0;\n`;\n\nconst errorBorderMixin = `\n    border: 1px solid ${errorColor};\n`;\n\nconst defaultClass = css`\n    .wby-content-entry-invalid-field {\n        // Default fields\n        .webiny_label-invalid {\n            left: var(--spacing-sm-extra);\n\n            .webiny_label-text::before {\n                ${errorTitleMixin}\n            }\n        }\n\n        // accordion\n        .webiny_accordion-item-title::before {\n            ${errorTitleMixin}\n        }\n        .webiny_accordion-title-text::before {\n            ${errorTitleMixin}\n        }\n\n        // multiple entries\n        > hcms-parent-field-provider .webiny_group-label-text::before {\n            ${errorTitleMixin}\n        }\n\n        // radio buttons\n        &[data-field-renderer=\"radio-buttons\"] {\n            [role=\"radiogroup\"] .webiny_label-text::before {\n                ${noErrorTitleMixin}\n            }\n        }\n\n        // checkboxes\n        &[data-field-renderer=\"checkboxes\"] {\n            [role=\"checkbox\"] + label .webiny_label-text::before {\n                ${noErrorTitleMixin}\n            }\n        }\n    }\n\n    // reference field\n    .wby-content-entry-invalid-field[data-field-type=\"ref\"] {\n        .webiny_group-label-text::before {\n            ${errorTitleMixin}\n        }\n\n        .webiny_ref-field-container {\n            ${errorBorderMixin}\n        }\n\n        &[data-field-renderer=\"ref-simple-single\"] {\n            [role=\"radiogroup\"] .webiny_label-text::before {\n                ${noErrorTitleMixin}\n            }\n\n            [role=\"checkbox\"] + label .webiny_label-text::before {\n                ${noErrorTitleMixin}\n            }\n        }\n    }\n\n    // Object field\n    .wby-content-entry-invalid-field[data-field-type=\"object\"] {\n        &[data-field-renderer=\"object\"],\n        &[data-field-renderer=\"objects\"] {\n            .webiny_group-label-text::before {\n                ${errorTitleMixin}\n            }\n\n            label {\n                left: 0;\n\n                .webiny_label-text::before {\n                    ${noErrorTitleMixin}\n                }\n            }\n        }\n    }\n`;\n\nexport interface ValidationIndicatorsProps {\n    invalidFields: FormValidation;\n    className?: string;\n}\n\nexport const ValidationIndicators = makeDecoratable(\n    \"ValidationIndicators\",\n    ({\n        invalidFields,\n        className = \"wby-content-entry-invalid-field\"\n    }: ValidationIndicatorsProps) => {\n        const visualizeDomByPath = (path: string) => {\n            const selector = `hcms-field-validation[data-path=\"${path}\"]`;\n            const marker = Array.from(document.querySelectorAll(selector).values())[0];\n            if (marker) {\n                marker.classList.add(className);\n            }\n\n            if (path.includes(\".\")) {\n                const paths = path.split(\".\");\n                const parentPath = paths.slice(0, paths.length - 1);\n                visualizeDomByPath(parentPath.join(\".\"));\n            }\n        };\n\n        useEffect(() => {\n            document.querySelectorAll(`.${className}`).forEach(el => {\n                el.classList.remove(className);\n            });\n\n            for (const key of Object.keys(invalidFields)) {\n                visualizeDomByPath(key);\n            }\n        }, [invalidFields]);\n\n        return <Global styles={defaultClass} />;\n    }\n);\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,QAAQ,OAAO;AAExC,SAASC,eAAe,QAAQ,2BAA2B;AAC3D,SAASC,MAAM,EAAEC,GAAG,QAAQ,gBAAgB;;AAE5C;AACA;AACA;AACA;AACA;;AAEA,MAAMC,UAAU,GAAG,wCAAwC;AAC3D,MAAMC,SAAS,GAAG,yBAAyB;AAE3C,MAAMC,eAAe,GAAG;AACxB,eAAeD,SAAS;AACxB;AACA,CAAC;AAED,MAAME,iBAAiB,GAAG;AAC1B;AACA;AACA,CAAC;AAED,MAAMC,gBAAgB,GAAG;AACzB,wBAAwBJ,UAAU;AAClC,CAAC;AAED,MAAMK,YAAY,gBAAGN,GAAG,oHAONG,eAAe,8CAMnBA,eAAe,6CAGfA,eAAe,qEAKfA,eAAe,kGAMXC,iBAAiB,oGAOjBA,iBAAiB,qGAQrBD,eAAe,oCAIfE,gBAAgB,sGAKZD,iBAAiB,6DAIjBA,iBAAiB,6KAUjBD,eAAe,gDAOXC,iBAAiB,aAAAG,OAAA,CAAAC,GAAA,CAAAC,QAAA,kDAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,m0LAKtC;AAOD,OAAO,MAAMC,oBAAoB,GAAGZ,eAAe,CAC/C,sBAAsB,EACtB,CAAC;EACGa,aAAa;EACbC,SAAS,GAAG;AACW,CAAC,KAAK;EAC7B,MAAMC,kBAAkB,GAAIC,IAAY,IAAK;IACzC,MAAMC,QAAQ,GAAG,oCAAoCD,IAAI,IAAI;IAC7D,MAAME,MAAM,GAAGC,KAAK,CAACC,IAAI,CAACC,QAAQ,CAACC,gBAAgB,CAACL,QAAQ,CAAC,CAACM,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1E,IAAIL,MAAM,EAAE;MACRA,MAAM,CAACM,SAAS,CAACC,GAAG,CAACX,SAAS,CAAC;IACnC;IAEA,IAAIE,IAAI,CAACU,QAAQ,CAAC,GAAG,CAAC,EAAE;MACpB,MAAMC,KAAK,GAAGX,IAAI,CAACY,KAAK,CAAC,GAAG,CAAC;MAC7B,MAAMC,UAAU,GAAGF,KAAK,CAACG,KAAK,CAAC,CAAC,EAAEH,KAAK,CAACI,MAAM,GAAG,CAAC,CAAC;MACnDhB,kBAAkB,CAACc,UAAU,CAACG,IAAI,CAAC,GAAG,CAAC,CAAC;IAC5C;EACJ,CAAC;EAEDjC,SAAS,CAAC,MAAM;IACZsB,QAAQ,CAACC,gBAAgB,CAAC,IAAIR,SAAS,EAAE,CAAC,CAACmB,OAAO,CAACC,EAAE,IAAI;MACrDA,EAAE,CAACV,SAAS,CAACW,MAAM,CAACrB,SAAS,CAAC;IAClC,CAAC,CAAC;IAEF,KAAK,MAAMsB,GAAG,IAAIC,MAAM,CAACC,IAAI,CAACzB,aAAa,CAAC,EAAE;MAC1CE,kBAAkB,CAACqB,GAAG,CAAC;IAC3B;EACJ,CAAC,EAAE,CAACvB,aAAa,CAAC,CAAC;EAEnB,oBAAOf,KAAA,CAAAyC,aAAA,CAACtC,MAAM;IAACuC,MAAM,EAAEhC;EAAa,CAAE,CAAC;AAC3C,CACJ,CAAC","ignoreList":[]}

package/admin/views/contentEntries/hooks/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./useContentEntries";
+export * from "./useContentEntriesList";
+export * from "./useContentEntry";
+export * from "./useMoveContentEntryToFolder";

package/admin/views/contentEntries/hooks/index.js

@@ -0,0 +1,6 @@
+export * from "./useContentEntries";
+export * from "./useContentEntriesList";
+export * from "./useContentEntry";
+export * from "./useMoveContentEntryToFolder";
+
+//# sourceMappingURL=index.js.map

package/admin/views/contentEntries/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./useContentEntries\";\nexport * from \"./useContentEntriesList\";\nexport * from \"./useContentEntry\";\nexport * from \"./useMoveContentEntryToFolder\";\n"],"mappings":"AAAA;AACA;AACA;AACA","ignoreList":[]}

package/admin/views/contentEntries/hooks/useContentEntries.d.ts

@@ -1 +1,2 @@
-export declare function useContentEntries(): import("../ContentEntriesContext").ContentEntriesContext;
+import { ContentEntriesContext } from "../ContentEntriesContext";
+export declare function useContentEntries(): ContentEntriesContext;