@wix/auto-patterns 1.6.0 → 1.8.0

package/dist/esm/hooks/useCommonCollectionFeatures.js

@@ -1,21 +1,37 @@
 import React from 'react';
 import { useEmptyStates } from './useEmptyStates';
-import { usePatternsWizardOverridesContext } from '../providers';
 import { ToolbarTitle } from '@wix/patterns';
-import { Edit } from '@wix/wix-ui-icons-common';
 import { Box, Text, TextButton } from '@wix/design-system';
+import { useActionCell } from './useActionCell';
+import { useBulkActionToolbar } from './useBulkActionToolbar';
 export const useCommonCollectionFeatures = _ref => {
   var _toolbarTitle$subtitl, _toolbarTitle$subtitl2, _toolbarTitle$subtitl3, _toolbarTitle$subtitl4, _toolbarTitle$subtitl5, _toolbarTitle$subtitl6, _toolbarTitle$subtitl7;
   let {
-    actions,
+    actionCell: actionCellConfig,
+    bulkActionToolbar: bulkActionToolbarConfig,
     toolbarTitle,
     search,
-    emptyState: emptyStateConfig
+    emptyState: emptyStateConfig,
+    collection,
+    optimisticActions,
+    collectionType,
+    entityPageId
   } = _ref;
-  const context = usePatternsWizardOverridesContext();
   const {
     emptyState
   } = useEmptyStates(emptyStateConfig);
+  const actionCell = useActionCell({
+    config: actionCellConfig,
+    collectionId: collection.collectionId,
+    optimisticActions,
+    collectionType,
+    entityPageId
+  });
+  const bulkActionToolbar = useBulkActionToolbar({
+    config: bulkActionToolbarConfig,
+    collectionId: collection.collectionId,
+    optimisticActions
+  });
   const title = toolbarTitle && /*#__PURE__*/React.createElement(ToolbarTitle, {
     title: toolbarTitle.title,
     subtitle: {
@@ -44,29 +60,12 @@ export const useCommonCollectionFeatures = _ref => {
     itemsLimit: toolbarTitle.itemsLimit,
     showTotal: toolbarTitle.showTotal
   });
-  const secondaryActionComponents = React.useMemo(() => {
-    const secondaryActions = actions || [];
-    if (secondaryActions.length === 0) {
-      return undefined;
-    }
-    return secondaryActions.map(action => item => ({
-      icon: /*#__PURE__*/React.createElement(Edit, null),
-      text: action.text,
-      onClick: () => {
-        var _context$actions, _context$actions$acti;
-        context == null || (_context$actions = context.actions) == null || (_context$actions$acti = _context$actions[action.id]) == null || _context$actions$acti.call(_context$actions, {
-          item
-        });
-      }
-    }));
-  }, [actions, context == null ? void 0 : context.actions]);
   return {
     search: (search == null ? void 0 : search.shown) !== false,
     title,
     emptyState,
-    actionCell: item => ({
-      secondaryActions: secondaryActionComponents == null ? void 0 : secondaryActionComponents.map(action => action(item))
-    })
+    actionCell,
+    bulkActionToolbar
   };
 };
 //# sourceMappingURL=useCommonCollectionFeatures.js.map

package/dist/esm/hooks/useCommonCollectionFeatures.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEmptyStates","usePatternsWizardOverridesContext","ToolbarTitle","Edit","Box","Text","TextButton","useCommonCollectionFeatures","_ref","_toolbarTitle$subtitl","_toolbarTitle$subtitl2","_toolbarTitle$subtitl3","_toolbarTitle$subtitl4","_toolbarTitle$subtitl5","_toolbarTitle$subtitl6","_toolbarTitle$subtitl7","actions","toolbarTitle","search","emptyState","emptyStateConfig","context","title","createElement","subtitle","text","learnMore","info","content","direction","gap","dataHook","light","size","link","underline","skin","as","rel","target","href","url","label","itemsLimit","showTotal","secondaryActionComponents","useMemo","secondaryActions","length","undefined","map","action","item","icon","onClick","_context$actions","_context$actions$acti","id","call","shown","actionCell"],"sources":["../../../src/hooks/useCommonCollectionFeatures.tsx"],"sourcesContent":["import React from 'react';\nimport { useEmptyStates } from './useEmptyStates';\nimport { usePatternsWizardOverridesContext } from '../providers';\nimport { ToolbarTitle } from '@wix/patterns';\nimport { Edit } from '@wix/wix-ui-icons-common';\nimport { Box, Text, TextButton } from '@wix/design-system';\nimport { BaseCollectionComponentConfig } from '../types';\n\nexport const useCommonCollectionFeatures = ({\n  actions,\n  toolbarTitle,\n  search,\n  emptyState: emptyStateConfig,\n}: BaseCollectionComponentConfig) => {\n  const context = usePatternsWizardOverridesContext();\n\n  const { emptyState } = useEmptyStates(emptyStateConfig);\n\n  const title = toolbarTitle && (\n    <ToolbarTitle\n      title={toolbarTitle.title}\n      subtitle={{\n        text: toolbarTitle.subtitle?.text ?? '',\n        learnMore: toolbarTitle.subtitle?.learnMore,\n        info: toolbarTitle.subtitle?.info && {\n          content: (\n            <Box direction=\"vertical\" gap=\"6px\">\n              <Text\n                dataHook=\"toolbar-title-subtitle-info-content\"\n                light\n                size=\"small\"\n              >\n                {toolbarTitle.subtitle?.info?.content.text}\n              </Text>\n              {toolbarTitle.subtitle?.info?.content.link && (\n                <TextButton\n                  dataHook=\"toolbar-title-subtitle-info-link\"\n                  size=\"small\"\n                  underline=\"always\"\n                  skin=\"light\"\n                  as=\"a\"\n                  rel=\"noopener\"\n                  target=\"_blank\"\n                  href={toolbarTitle.subtitle?.info?.content.link.url}\n                >\n                  {toolbarTitle.subtitle?.info?.content.link.label}\n                </TextButton>\n              )}\n            </Box>\n          ),\n        },\n      }}\n      itemsLimit={toolbarTitle.itemsLimit}\n      showTotal={toolbarTitle.showTotal}\n    />\n  );\n\n  const secondaryActionComponents = React.useMemo(() => {\n    const secondaryActions = actions || [];\n    if (secondaryActions.length === 0) {\n      return undefined;\n    }\n\n    return secondaryActions.map((action) => (item: any) => ({\n      icon: <Edit />,\n      text: action.text,\n      onClick: () => {\n        context?.actions?.[action.id]?.({ item });\n      },\n    }));\n  }, [actions, context?.actions]);\n\n  return {\n    search: search?.shown !== false,\n    title,\n    emptyState,\n    actionCell: (item: any) => ({\n      secondaryActions: secondaryActionComponents?.map((action) =>\n        action(item),\n      ),\n    }),\n  };\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,QAAQ,kBAAkB;AACjD,SAASC,iCAAiC,QAAQ,cAAc;AAChE,SAASC,YAAY,QAAQ,eAAe;AAC5C,SAASC,IAAI,QAAQ,0BAA0B;AAC/C,SAASC,GAAG,EAAEC,IAAI,EAAEC,UAAU,QAAQ,oBAAoB;AAG1D,OAAO,MAAMC,2BAA2B,GAAGC,IAAA,IAKN;EAAA,IAAAC,qBAAA,EAAAC,sBAAA,EAAAC,sBAAA,EAAAC,sBAAA,EAAAC,sBAAA,EAAAC,sBAAA,EAAAC,sBAAA;EAAA,IALO;IAC1CC,OAAO;IACPC,YAAY;IACZC,MAAM;IACNC,UAAU,EAAEC;EACiB,CAAC,GAAAZ,IAAA;EAC9B,MAAMa,OAAO,GAAGpB,iCAAiC,CAAC,CAAC;EAEnD,MAAM;IAAEkB;EAAW,CAAC,GAAGnB,cAAc,CAACoB,gBAAgB,CAAC;EAEvD,MAAME,KAAK,GAAGL,YAAY,iBACxBlB,KAAA,CAAAwB,aAAA,CAACrB,YAAY;IACXoB,KAAK,EAAEL,YAAY,CAACK,KAAM;IAC1BE,QAAQ,EAAE;MACRC,IAAI,EAAE,EAAAhB,qBAAA,GAAAQ,YAAY,CAACO,QAAQ,qBAArBf,qBAAA,CAAuBgB,IAAI,KAAI,EAAE;MACvCC,SAAS,GAAAhB,sBAAA,GAAEO,YAAY,CAACO,QAAQ,qBAArBd,sBAAA,CAAuBgB,SAAS;MAC3CC,IAAI,EAAE,EAAAhB,sBAAA,GAAAM,YAAY,CAACO,QAAQ,qBAArBb,sBAAA,CAAuBgB,IAAI,KAAI;QACnCC,OAAO,eACL7B,KAAA,CAAAwB,aAAA,CAACnB,GAAG;UAACyB,SAAS,EAAC,UAAU;UAACC,GAAG,EAAC;QAAK,gBACjC/B,KAAA,CAAAwB,aAAA,CAAClB,IAAI;UACH0B,QAAQ,EAAC,qCAAqC;UAC9CC,KAAK;UACLC,IAAI,EAAC;QAAO,IAAArB,sBAAA,GAEXK,YAAY,CAACO,QAAQ,cAAAZ,sBAAA,GAArBA,sBAAA,CAAuBe,IAAI,qBAA3Bf,sBAAA,CAA6BgB,OAAO,CAACH,IAClC,CAAC,EACN,EAAAZ,sBAAA,GAAAI,YAAY,CAACO,QAAQ,cAAAX,sBAAA,GAArBA,sBAAA,CAAuBc,IAAI,qBAA3Bd,sBAAA,CAA6Be,OAAO,CAACM,IAAI,kBACxCnC,KAAA,CAAAwB,aAAA,CAACjB,UAAU;UACTyB,QAAQ,EAAC,kCAAkC;UAC3CE,IAAI,EAAC,OAAO;UACZE,SAAS,EAAC,QAAQ;UAClBC,IAAI,EAAC,OAAO;UACZC,EAAE,EAAC,GAAG;UACNC,GAAG,EAAC,UAAU;UACdC,MAAM,EAAC,QAAQ;UACfC,IAAI,GAAA1B,sBAAA,GAAEG,YAAY,CAACO,QAAQ,cAAAV,sBAAA,GAArBA,sBAAA,CAAuBa,IAAI,qBAA3Bb,sBAAA,CAA6Bc,OAAO,CAACM,IAAI,CAACO;QAAI,IAAA1B,sBAAA,GAEnDE,YAAY,CAACO,QAAQ,cAAAT,sBAAA,GAArBA,sBAAA,CAAuBY,IAAI,qBAA3BZ,sBAAA,CAA6Ba,OAAO,CAACM,IAAI,CAACQ,KACjC,CAEX;MAET;IACF,CAAE;IACFC,UAAU,EAAE1B,YAAY,CAAC0B,UAAW;IACpCC,SAAS,EAAE3B,YAAY,CAAC2B;EAAU,CACnC,CACF;EAED,MAAMC,yBAAyB,GAAG9C,KAAK,CAAC+C,OAAO,CAAC,MAAM;IACpD,MAAMC,gBAAgB,GAAG/B,OAAO,IAAI,EAAE;IACtC,IAAI+B,gBAAgB,CAACC,MAAM,KAAK,CAAC,EAAE;MACjC,OAAOC,SAAS;IAClB;IAEA,OAAOF,gBAAgB,CAACG,GAAG,CAAEC,MAAM,IAAMC,IAAS,KAAM;MACtDC,IAAI,eAAEtD,KAAA,CAAAwB,aAAA,CAACpB,IAAI,MAAE,CAAC;MACdsB,IAAI,EAAE0B,MAAM,CAAC1B,IAAI;MACjB6B,OAAO,EAAEA,CAAA,KAAM;QAAA,IAAAC,gBAAA,EAAAC,qBAAA;QACbnC,OAAO,aAAAkC,gBAAA,GAAPlC,OAAO,CAAEL,OAAO,cAAAwC,qBAAA,GAAhBD,gBAAA,CAAmBJ,MAAM,CAACM,EAAE,CAAC,aAA7BD,qBAAA,CAAAE,IAAA,CAAAH,gBAAA,EAAgC;UAAEH;QAAK,CAAC,CAAC;MAC3C;IACF,CAAC,CAAC,CAAC;EACL,CAAC,EAAE,CAACpC,OAAO,EAAEK,OAAO,oBAAPA,OAAO,CAAEL,OAAO,CAAC,CAAC;EAE/B,OAAO;IACLE,MAAM,EAAE,CAAAA,MAAM,oBAANA,MAAM,CAAEyC,KAAK,MAAK,KAAK;IAC/BrC,KAAK;IACLH,UAAU;IACVyC,UAAU,EAAGR,IAAS,KAAM;MAC1BL,gBAAgB,EAAEF,yBAAyB,oBAAzBA,yBAAyB,CAAEK,GAAG,CAAEC,MAAM,IACtDA,MAAM,CAACC,IAAI,CACb;IACF,CAAC;EACH,CAAC;AACH,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useEmptyStates","ToolbarTitle","Box","Text","TextButton","useActionCell","useBulkActionToolbar","useCommonCollectionFeatures","_ref","_toolbarTitle$subtitl","_toolbarTitle$subtitl2","_toolbarTitle$subtitl3","_toolbarTitle$subtitl4","_toolbarTitle$subtitl5","_toolbarTitle$subtitl6","_toolbarTitle$subtitl7","actionCell","actionCellConfig","bulkActionToolbar","bulkActionToolbarConfig","toolbarTitle","search","emptyState","emptyStateConfig","collection","optimisticActions","collectionType","entityPageId","config","collectionId","title","createElement","subtitle","text","learnMore","info","content","direction","gap","dataHook","light","size","link","underline","skin","as","rel","target","href","url","label","itemsLimit","showTotal","shown"],"sources":["../../../src/hooks/useCommonCollectionFeatures.tsx"],"sourcesContent":["import React from 'react';\nimport { useEmptyStates } from './useEmptyStates';\n\nimport { CollectionOptimisticActions, ToolbarTitle } from '@wix/patterns';\n\nimport { Box, Text, TextButton } from '@wix/design-system';\nimport { BaseCollectionComponentConfig, ComponentConfig } from '../types';\nimport { useActionCell } from './useActionCell';\nimport { useBulkActionToolbar } from './useBulkActionToolbar';\n\nexport type UseCommonCollectionFeaturesParams = Pick<\n  BaseCollectionComponentConfig,\n  | 'actionCell'\n  | 'toolbarTitle'\n  | 'search'\n  | 'emptyState'\n  | 'collection'\n  | 'bulkActionToolbar'\n  | 'entityPageId'\n> & {\n  optimisticActions: CollectionOptimisticActions<any, any>;\n  collectionType?: ComponentConfig['type'];\n};\n\nexport const useCommonCollectionFeatures = ({\n  actionCell: actionCellConfig,\n  bulkActionToolbar: bulkActionToolbarConfig,\n  toolbarTitle,\n  search,\n  emptyState: emptyStateConfig,\n  collection,\n  optimisticActions,\n  collectionType,\n  entityPageId,\n}: UseCommonCollectionFeaturesParams) => {\n  const { emptyState } = useEmptyStates(emptyStateConfig);\n  const actionCell = useActionCell({\n    config: actionCellConfig,\n    collectionId: collection.collectionId,\n    optimisticActions,\n    collectionType,\n    entityPageId,\n  });\n\n  const bulkActionToolbar = useBulkActionToolbar({\n    config: bulkActionToolbarConfig,\n    collectionId: collection.collectionId,\n    optimisticActions,\n  });\n\n  const title = toolbarTitle && (\n    <ToolbarTitle\n      title={toolbarTitle.title}\n      subtitle={{\n        text: toolbarTitle.subtitle?.text ?? '',\n        learnMore: toolbarTitle.subtitle?.learnMore,\n        info: toolbarTitle.subtitle?.info && {\n          content: (\n            <Box direction=\"vertical\" gap=\"6px\">\n              <Text\n                dataHook=\"toolbar-title-subtitle-info-content\"\n                light\n                size=\"small\"\n              >\n                {toolbarTitle.subtitle?.info?.content.text}\n              </Text>\n              {toolbarTitle.subtitle?.info?.content.link && (\n                <TextButton\n                  dataHook=\"toolbar-title-subtitle-info-link\"\n                  size=\"small\"\n                  underline=\"always\"\n                  skin=\"light\"\n                  as=\"a\"\n                  rel=\"noopener\"\n                  target=\"_blank\"\n                  href={toolbarTitle.subtitle?.info?.content.link.url}\n                >\n                  {toolbarTitle.subtitle?.info?.content.link.label}\n                </TextButton>\n              )}\n            </Box>\n          ),\n        },\n      }}\n      itemsLimit={toolbarTitle.itemsLimit}\n      showTotal={toolbarTitle.showTotal}\n    />\n  );\n\n  return {\n    search: search?.shown !== false,\n    title,\n    emptyState,\n    actionCell,\n    bulkActionToolbar,\n  };\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/hooks/useFetchData.js

@@ -1,15 +1,39 @@
-import { useCollectionData, usePatternsWizardOverridesContext } from '../providers';
-export const useFetchData = config => {
-  var _overrides$fetchData;
-  const {
-    fetchData: fetchDataOverride
-  } = config;
+import React from 'react';
+import { usePatternsWizardOverridesContext } from '../providers';
+import { useSchema } from '../providers/SchemaContext';
+import { createDataProvider } from '../dataSourceAdapters/factory';
+export const useFetchData = _ref => {
+  let {
+    collectionConfig,
+    visibleFieldIds,
+    filtersMapping
+  } = _ref;
+  const schema = useSchema();
   const overrides = usePatternsWizardOverridesContext();
   const {
-    collection
-  } = useCollectionData();
-  const defaultFetchData = collection.fetchData;
-  const fetchData = fetchDataOverride != null && fetchDataOverride.id ? (overrides == null || (_overrides$fetchData = overrides.fetchData) == null ? void 0 : _overrides$fetchData[fetchDataOverride.id]) ?? defaultFetchData : defaultFetchData;
+    fetchData: fetchDataOverride
+  } = collectionConfig;
+  const defaultDataProvider = React.useMemo(() => {
+    if (!schema) {
+      throw new Error('useFetchData: schema is not available');
+    }
+    return createDataProvider({
+      collectionId: collectionConfig.collectionId,
+      entityTypeSource: collectionConfig.entityTypeSource,
+      schema,
+      visibleFieldIds,
+      filtersMapping
+    });
+  }, [schema, collectionConfig.collectionId, collectionConfig.entityTypeSource, visibleFieldIds, filtersMapping]);
+  const fetchData = React.useMemo(() => {
+    const defaultFetch = defaultDataProvider == null ? void 0 : defaultDataProvider.fetchData;
+    if (fetchDataOverride != null && fetchDataOverride.id) {
+      var _overrides$fetchData;
+      const overrideFetch = overrides == null || (_overrides$fetchData = overrides.fetchData) == null ? void 0 : _overrides$fetchData[fetchDataOverride.id];
+      return overrideFetch ?? defaultFetch;
+    }
+    return defaultFetch;
+  }, [defaultDataProvider, fetchDataOverride == null ? void 0 : fetchDataOverride.id, overrides == null ? void 0 : overrides.fetchData]);
   return {
     fetchData
   };

package/dist/esm/hooks/useFetchData.js.map

@@ -1 +1 @@
-{"version":3,"names":["useCollectionData","usePatternsWizardOverridesContext","useFetchData","config","_overrides$fetchData","fetchData","fetchDataOverride","overrides","collection","defaultFetchData","id"],"sources":["../../../src/hooks/useFetchData.tsx"],"sourcesContent":["import {\n  useCollectionData,\n  usePatternsWizardOverridesContext,\n} from '../providers';\nimport { CollectionConfig } from '../types';\n\nexport const useFetchData = (config: CollectionConfig) => {\n  const { fetchData: fetchDataOverride } = config;\n  const overrides = usePatternsWizardOverridesContext();\n  const { collection } = useCollectionData();\n  const defaultFetchData = collection.fetchData;\n\n  const fetchData = fetchDataOverride?.id\n    ? overrides?.fetchData?.[fetchDataOverride.id] ?? defaultFetchData\n    : defaultFetchData;\n\n  return {\n    fetchData,\n  };\n};\n"],"mappings":"AAAA,SACEA,iBAAiB,EACjBC,iCAAiC,QAC5B,cAAc;AAGrB,OAAO,MAAMC,YAAY,GAAIC,MAAwB,IAAK;EAAA,IAAAC,oBAAA;EACxD,MAAM;IAAEC,SAAS,EAAEC;EAAkB,CAAC,GAAGH,MAAM;EAC/C,MAAMI,SAAS,GAAGN,iCAAiC,CAAC,CAAC;EACrD,MAAM;IAAEO;EAAW,CAAC,GAAGR,iBAAiB,CAAC,CAAC;EAC1C,MAAMS,gBAAgB,GAAGD,UAAU,CAACH,SAAS;EAE7C,MAAMA,SAAS,GAAGC,iBAAiB,YAAjBA,iBAAiB,CAAEI,EAAE,GACnC,CAAAH,SAAS,aAAAH,oBAAA,GAATG,SAAS,CAAEF,SAAS,qBAApBD,oBAAA,CAAuBE,iBAAiB,CAACI,EAAE,CAAC,KAAID,gBAAgB,GAChEA,gBAAgB;EAEpB,OAAO;IACLJ;EACF,CAAC;AACH,CAAC","ignoreList":[]}
+{"version":3,"names":["React","usePatternsWizardOverridesContext","useSchema","createDataProvider","useFetchData","_ref","collectionConfig","visibleFieldIds","filtersMapping","schema","overrides","fetchData","fetchDataOverride","defaultDataProvider","useMemo","Error","collectionId","entityTypeSource","defaultFetch","id","_overrides$fetchData","overrideFetch"],"sources":["../../../src/hooks/useFetchData.tsx"],"sourcesContent":["import React from 'react';\nimport { usePatternsWizardOverridesContext } from '../providers';\nimport { CollectionConfig, Filter } from '../types';\nimport { useSchema } from '../providers/SchemaContext';\nimport { createDataProvider } from '../dataSourceAdapters/factory';\n\nexport const useFetchData = ({\n  collectionConfig,\n  visibleFieldIds,\n  filtersMapping,\n}: {\n  collectionConfig: CollectionConfig;\n  visibleFieldIds: string[];\n  filtersMapping?: Record<string, Filter>;\n}) => {\n  const schema = useSchema();\n  const overrides = usePatternsWizardOverridesContext();\n  const { fetchData: fetchDataOverride } = collectionConfig;\n\n  const defaultDataProvider = React.useMemo(() => {\n    if (!schema) {\n      throw new Error('useFetchData: schema is not available');\n    }\n    return createDataProvider({\n      collectionId: collectionConfig.collectionId,\n      entityTypeSource: collectionConfig.entityTypeSource,\n      schema,\n      visibleFieldIds,\n      filtersMapping,\n    });\n  }, [\n    schema,\n    collectionConfig.collectionId,\n    collectionConfig.entityTypeSource,\n    visibleFieldIds,\n    filtersMapping,\n  ]);\n\n  const fetchData = React.useMemo(() => {\n    const defaultFetch = defaultDataProvider?.fetchData;\n\n    if (fetchDataOverride?.id) {\n      const overrideFetch = overrides?.fetchData?.[fetchDataOverride.id];\n      return overrideFetch ?? defaultFetch;\n    }\n    return defaultFetch;\n  }, [defaultDataProvider, fetchDataOverride?.id, overrides?.fetchData]);\n\n  return {\n    fetchData,\n  };\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,iCAAiC,QAAQ,cAAc;AAEhE,SAASC,SAAS,QAAQ,4BAA4B;AACtD,SAASC,kBAAkB,QAAQ,+BAA+B;AAElE,OAAO,MAAMC,YAAY,GAAGC,IAAA,IAQtB;EAAA,IARuB;IAC3BC,gBAAgB;IAChBC,eAAe;IACfC;EAKF,CAAC,GAAAH,IAAA;EACC,MAAMI,MAAM,GAAGP,SAAS,CAAC,CAAC;EAC1B,MAAMQ,SAAS,GAAGT,iCAAiC,CAAC,CAAC;EACrD,MAAM;IAAEU,SAAS,EAAEC;EAAkB,CAAC,GAAGN,gBAAgB;EAEzD,MAAMO,mBAAmB,GAAGb,KAAK,CAACc,OAAO,CAAC,MAAM;IAC9C,IAAI,CAACL,MAAM,EAAE;MACX,MAAM,IAAIM,KAAK,CAAC,uCAAuC,CAAC;IAC1D;IACA,OAAOZ,kBAAkB,CAAC;MACxBa,YAAY,EAAEV,gBAAgB,CAACU,YAAY;MAC3CC,gBAAgB,EAAEX,gBAAgB,CAACW,gBAAgB;MACnDR,MAAM;MACNF,eAAe;MACfC;IACF,CAAC,CAAC;EACJ,CAAC,EAAE,CACDC,MAAM,EACNH,gBAAgB,CAACU,YAAY,EAC7BV,gBAAgB,CAACW,gBAAgB,EACjCV,eAAe,EACfC,cAAc,CACf,CAAC;EAEF,MAAMG,SAAS,GAAGX,KAAK,CAACc,OAAO,CAAC,MAAM;IACpC,MAAMI,YAAY,GAAGL,mBAAmB,oBAAnBA,mBAAmB,CAAEF,SAAS;IAEnD,IAAIC,iBAAiB,YAAjBA,iBAAiB,CAAEO,EAAE,EAAE;MAAA,IAAAC,oBAAA;MACzB,MAAMC,aAAa,GAAGX,SAAS,aAAAU,oBAAA,GAATV,SAAS,CAAEC,SAAS,qBAApBS,oBAAA,CAAuBR,iBAAiB,CAACO,EAAE,CAAC;MAClE,OAAOE,aAAa,IAAIH,YAAY;IACtC;IACA,OAAOA,YAAY;EACrB,CAAC,EAAE,CAACL,mBAAmB,EAAED,iBAAiB,oBAAjBA,iBAAiB,CAAEO,EAAE,EAAET,SAAS,oBAATA,SAAS,CAAEC,SAAS,CAAC,CAAC;EAEtE,OAAO;IACLA;EACF,CAAC;AACH,CAAC","ignoreList":[]}

package/dist/esm/hooks/useFilters.js

@@ -1,130 +1,119 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
-import { CollectionToolbarFilters, DateRangeFilter, dateRangeFilter, idNameArrayFilter, NumberRangeFilter, numberRangeFilter, RadioGroupFilter, useStaticListFilterCollection } from '@wix/patterns';
-import { useCollectionData } from '../providers';
-import { createEnumFilter } from '../utils/filters';
+import { CollectionToolbarFilters } from '@wix/patterns';
+import { useSchema } from '../providers/SchemaContext';
+import { useSchemaRegistry } from '../providers';
+import { StaticCollectionFilter, DynamicCollectionFilter } from '../components/filters';
+import { createDateTimeFilter, createBooleanFilter, createNumberFilter, createEnumFilter, createReferenceFilter } from '../utils/filterCreators';
 export const useFilters = configuration => {
-  const {
-    schema
-  } = useCollectionData();
+  const schema = useSchema();
+  const schemaRegistry = useSchemaRegistry();
   const filters = React.useMemo(() => {
     const currFilters = [];
     configuration == null || configuration.items.forEach(filter => {
-      var _filter$dateConfig, _filter$dateConfig2, _filter$dateConfig3, _filter$booleanConfig, _filter$booleanConfig2, _filter$numberConfig, _filter$numberConfig2, _filter$numberConfig3;
       const {
-        fieldId: key
+        id,
+        fieldId
       } = filter;
-      const fieldDefinition = schema.fields[key];
+      const fieldDefinition = schema.fields[fieldId];
       if (!fieldDefinition) {
         return;
       }
       const label = filter.displayName || fieldDefinition.displayName;
       const {
-        initiallyOpen,
+        openByDefault,
+        tagLabel,
         sectionTitle
-      } = filter.accordionItemProps || {};
-      const {
-        toolbarTagProps
       } = filter;
-      const commonFilterProps = {
-        accordionItemProps: {
-          label,
-          initiallyOpen,
-          sectionTitle
-        },
-        toolbarItemProps: {
-          label
-        },
-        toolbarTagProps
+      const baseParams = {
+        id,
+        fieldId,
+        commonFilterProps: {
+          sectionTitle,
+          initiallyOpen: openByDefault,
+          accordionItemProps: {
+            label
+          },
+          toolbarItemProps: {
+            label
+          },
+          toolbarTagProps: {
+            label: tagLabel
+          }
+        }
       };
       switch (fieldDefinition.type) {
         case 'DATE':
         case 'DATETIME':
-          currFilters.push({
-            key,
-            filter: dateRangeFilter(),
-            component: DateRangeFilter,
-            props: {
-              ...commonFilterProps,
-              mode: (_filter$dateConfig = filter.dateConfig) == null ? void 0 : _filter$dateConfig.mode,
-              dateRangeOptions: (_filter$dateConfig2 = filter.dateConfig) == null ? void 0 : _filter$dateConfig2.dateRangeOptions,
-              filterByTime: (_filter$dateConfig3 = filter.dateConfig) == null ? void 0 : _filter$dateConfig3.filterByTime
-            }
-          });
+          currFilters.push(createDateTimeFilter({
+            ...baseParams,
+            config: filter.dateConfig
+          }));
           break;
         case 'BOOLEAN':
-          currFilters.push({
-            key,
-            filter: idNameArrayFilter(),
-            component: RadioGroupFilter,
-            props: {
-              ...commonFilterProps,
-              data: [{
-                id: 'checked',
-                name: (filter == null || (_filter$booleanConfig = filter.booleanConfig) == null ? void 0 : _filter$booleanConfig.checkedLabel) || 'Yes'
-              }, {
-                id: 'unchecked',
-                name: (filter == null || (_filter$booleanConfig2 = filter.booleanConfig) == null ? void 0 : _filter$booleanConfig2.uncheckedLabel) || 'No'
-              }]
-            }
-          });
+          currFilters.push(createBooleanFilter({
+            ...baseParams,
+            config: filter.booleanConfig
+          }));
           break;
         case 'NUMBER':
-          currFilters.push({
-            key,
-            filter: numberRangeFilter(),
-            component: NumberRangeFilter,
-            props: {
-              ...commonFilterProps,
-              min: (_filter$numberConfig = filter.numberConfig) == null ? void 0 : _filter$numberConfig.min,
-              max: (_filter$numberConfig2 = filter.numberConfig) == null ? void 0 : _filter$numberConfig2.max,
-              decimal: (_filter$numberConfig3 = filter.numberConfig) == null ? void 0 : _filter$numberConfig3.decimal
-            }
-          });
+          currFilters.push(createNumberFilter({
+            ...baseParams,
+            config: filter.numberConfig
+          }));
           break;
+        case 'REFERENCE':
+          {
+            const {
+              referencedCollectionId
+            } = fieldDefinition.referenceMetadata;
+            const referencedSchema = schemaRegistry.getSchema(referencedCollectionId);
+            if (referencedSchema) {
+              currFilters.push(createReferenceFilter({
+                ...baseParams,
+                config: filter.dynamicOptionsConfig,
+                additionalParams: {
+                  referencedSchema
+                }
+              }));
+            }
+            break;
+          }
         default:
           if (filter != null && filter.enumConfig) {
             currFilters.push(createEnumFilter({
-              filter,
-              commonFilterProps
+              ...baseParams,
+              config: filter.enumConfig
             }));
           }
           break;
       }
     });
     return currFilters;
-  }, [configuration == null ? void 0 : configuration.items, schema.fields]);
-  const FilterCollectionComponent = _ref => {
-    let {
-      filter,
-      collectionData,
-      key,
-      component,
-      ...filterProps
-    } = _ref;
-    const FilterComponent = component;
-    const collection = useStaticListFilterCollection(filter, collectionData ?? []);
-    if (!configuration) {
-      return null;
-    }
-    return /*#__PURE__*/React.createElement(FilterComponent, _extends({
-      key: key,
-      filter: filter
-    }, collectionData ? {
-      collection
-    } : {}, filterProps));
-  };
+  }, [configuration == null ? void 0 : configuration.items, schema.fields, schemaRegistry]);
+  const filtersMapping = React.useMemo(() => {
+    return configuration == null ? void 0 : configuration.items.reduce((acc, filter) => {
+      acc[filter.id] = filter;
+      return acc;
+    }, {});
+  }, [configuration == null ? void 0 : configuration.items]);
   const collectionToolbarFiltersProps = React.useMemo(() => ({
-    inline: (configuration == null ? void 0 : configuration.maxToolbarFilters) || 0,
+    inline: (configuration == null ? void 0 : configuration.maxInlineFilters) || 0,
     panelTitle: configuration == null ? void 0 : configuration.panelTitle
   }), [configuration]);
   const filtersData = filters.reduce((acc, filter) => {
     acc.filters[filter.key] = filter.filter;
-    acc.components.push(filter.collectionData ? /*#__PURE__*/React.createElement(FilterCollectionComponent, _extends({
+    acc.components.push(filter.collectionData ? /*#__PURE__*/React.createElement(StaticCollectionFilter, _extends({
       filter: filter.filter,
       key: filter.key,
       component: filter.component,
       collectionData: filter.collectionData
+    }, filter.props)) : filter.collectionId ? /*#__PURE__*/React.createElement(DynamicCollectionFilter, _extends({
+      filter: filter.filter,
+      key: filter.key,
+      component: filter.component,
+      collectionId: filter.collectionId,
+      componentName: filter.props.componentName
     }, filter.props)) : /*#__PURE__*/React.createElement(filter.component, _extends({
       key: filter.key,
       filter: filter.filter
@@ -136,6 +125,7 @@ export const useFilters = configuration => {
     collectionToolbarFiltersProps
   });
   return {
+    filtersMapping,
     filtersObject: filtersData.filters,
     filterComponent: filtersData.components.length > 0 ? /*#__PURE__*/React.createElement(CollectionToolbarFilters, collectionToolbarFiltersProps, filtersData.components) : undefined
   };

package/dist/esm/hooks/useFilters.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","CollectionToolbarFilters","DateRangeFilter","dateRangeFilter","idNameArrayFilter","NumberRangeFilter","numberRangeFilter","RadioGroupFilter","useStaticListFilterCollection","useCollectionData","createEnumFilter","useFilters","configuration","schema","filters","useMemo","currFilters","items","forEach","filter","_filter$dateConfig","_filter$dateConfig2","_filter$dateConfig3","_filter$booleanConfig","_filter$booleanConfig2","_filter$numberConfig","_filter$numberConfig2","_filter$numberConfig3","fieldId","key","fieldDefinition","fields","label","displayName","initiallyOpen","sectionTitle","accordionItemProps","toolbarTagProps","commonFilterProps","toolbarItemProps","type","push","component","props","mode","dateConfig","dateRangeOptions","filterByTime","data","id","name","booleanConfig","checkedLabel","uncheckedLabel","min","numberConfig","max","decimal","enumConfig","FilterCollectionComponent","_ref","collectionData","filterProps","FilterComponent","collection","createElement","_extends","collectionToolbarFiltersProps","inline","maxToolbarFilters","panelTitle","filtersData","reduce","acc","components","filtersObject","filterComponent","length","undefined"],"sources":["../../../src/hooks/useFilters.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  CollectionToolbarFilters,\n  CollectionToolbarFiltersProps,\n  DateRangeFilter,\n  dateRangeFilter,\n  Filter,\n  idNameArrayFilter,\n  NumberRangeFilter,\n  numberRangeFilter,\n  RadioGroupFilter,\n  useStaticListFilterCollection,\n} from '@wix/patterns';\nimport { FiltersConfig } from '../types';\nimport { useCollectionData } from '../providers';\nimport { createEnumFilter } from '../utils/filters';\n\nexport interface FilterOptions {\n  key: string;\n  filter: Filter<any>;\n  component: React.ElementType;\n  collectionData?: { id: string; name: string }[];\n  props: Record<string, any>;\n}\n\nexport interface ReturnValue {\n  filters: { [key: string]: Filter<any> };\n  components: React.JSX.Element[];\n  collectionToolbarFiltersProps: Pick<\n    CollectionToolbarFiltersProps,\n    'inline' | 'panelTitle' | 'useNewFilters'\n  >;\n}\n\nexport const useFilters = (configuration?: FiltersConfig) => {\n  const { schema } = useCollectionData();\n  const filters = React.useMemo(() => {\n    const currFilters: FilterOptions[] = [];\n    configuration?.items.forEach((filter) => {\n      const { fieldId: key } = filter;\n      const fieldDefinition = schema.fields[key];\n      if (!fieldDefinition) {\n        return;\n      }\n\n      const label = filter.displayName || fieldDefinition.displayName;\n      const { initiallyOpen, sectionTitle } = filter.accordionItemProps || {};\n      const { toolbarTagProps } = filter;\n\n      const commonFilterProps = {\n        accordionItemProps: {\n          label,\n          initiallyOpen,\n          sectionTitle,\n        },\n        toolbarItemProps: {\n          label,\n        },\n        toolbarTagProps,\n      };\n\n      switch (fieldDefinition.type) {\n        case 'DATE':\n        case 'DATETIME':\n          currFilters.push({\n            key,\n            filter: dateRangeFilter(),\n            component: DateRangeFilter,\n            props: {\n              ...commonFilterProps,\n              mode: filter.dateConfig?.mode,\n              dateRangeOptions: filter.dateConfig?.dateRangeOptions,\n              filterByTime: filter.dateConfig?.filterByTime,\n            },\n          });\n\n          break;\n        case 'BOOLEAN':\n          currFilters.push({\n            key,\n            filter: idNameArrayFilter(),\n            component: RadioGroupFilter,\n            props: {\n              ...commonFilterProps,\n              data: [\n                {\n                  id: 'checked',\n                  name: filter?.booleanConfig?.checkedLabel || 'Yes',\n                },\n                {\n                  id: 'unchecked',\n                  name: filter?.booleanConfig?.uncheckedLabel || 'No',\n                },\n              ],\n            },\n          });\n          break;\n        case 'NUMBER':\n          currFilters.push({\n            key,\n            filter: numberRangeFilter(),\n            component: NumberRangeFilter,\n            props: {\n              ...commonFilterProps,\n              min: filter.numberConfig?.min,\n              max: filter.numberConfig?.max,\n              decimal: filter.numberConfig?.decimal,\n            },\n          });\n\n          break;\n\n        default:\n          if (filter?.enumConfig) {\n            currFilters.push(createEnumFilter({ filter, commonFilterProps }));\n          }\n          break;\n      }\n    });\n    return currFilters;\n  }, [configuration?.items, schema.fields]);\n\n  const FilterCollectionComponent: React.FC<{\n    filter: Filter<any>;\n    collectionData?: { id: string; name: string }[];\n    key: string;\n    component: React.ElementType;\n  }> = ({ filter, collectionData, key, component, ...filterProps }) => {\n    const FilterComponent = component;\n\n    const collection = useStaticListFilterCollection(\n      filter,\n      collectionData ?? [],\n    );\n\n    if (!configuration) {\n      return null;\n    }\n\n    return (\n      <FilterComponent\n        key={key}\n        filter={filter}\n        {...(collectionData ? { collection } : {})}\n        {...filterProps}\n      />\n    );\n  };\n\n  const collectionToolbarFiltersProps = React.useMemo<\n    Pick<CollectionToolbarFiltersProps, 'inline' | 'panelTitle'>\n  >(\n    () => ({\n      inline: configuration?.maxToolbarFilters || 0,\n      panelTitle: configuration?.panelTitle,\n    }),\n    [configuration],\n  );\n\n  const filtersData = filters.reduce<ReturnValue>(\n    (acc, filter) => {\n      acc.filters[filter.key] = filter.filter;\n      acc.components.push(\n        filter.collectionData ? (\n          <FilterCollectionComponent\n            filter={filter.filter}\n            key={filter.key}\n            component={filter.component}\n            collectionData={filter.collectionData}\n            {...filter.props}\n          />\n        ) : (\n          <filter.component\n            key={filter.key}\n            filter={filter.filter}\n            {...filter.props}\n          />\n        ),\n      );\n\n      return acc;\n    },\n    { filters: {}, components: [], collectionToolbarFiltersProps },\n  );\n\n  return {\n    filtersObject: filtersData.filters,\n    filterComponent:\n      filtersData.components.length > 0 ? (\n        <CollectionToolbarFilters {...collectionToolbarFiltersProps}>\n          {filtersData.components}\n        </CollectionToolbarFilters>\n      ) : undefined,\n  };\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","CollectionToolbarFilters","useSchema","useSchemaRegistry","StaticCollectionFilter","DynamicCollectionFilter","createDateTimeFilter","createBooleanFilter","createNumberFilter","createEnumFilter","createReferenceFilter","useFilters","configuration","schema","schemaRegistry","filters","useMemo","currFilters","items","forEach","filter","id","fieldId","fieldDefinition","fields","label","displayName","openByDefault","tagLabel","sectionTitle","baseParams","commonFilterProps","initiallyOpen","accordionItemProps","toolbarItemProps","toolbarTagProps","type","push","config","dateConfig","booleanConfig","numberConfig","referencedCollectionId","referenceMetadata","referencedSchema","getSchema","dynamicOptionsConfig","additionalParams","enumConfig","filtersMapping","reduce","acc","collectionToolbarFiltersProps","inline","maxInlineFilters","panelTitle","filtersData","key","components","collectionData","createElement","_extends","component","props","collectionId","componentName","filtersObject","filterComponent","length","undefined"],"sources":["../../../src/hooks/useFilters.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  CollectionToolbarFilters,\n  CollectionToolbarFiltersProps,\n  Filter,\n} from '@wix/patterns';\nimport { Filter as SchemaFilterType, FiltersConfig } from '../types';\nimport { useSchema } from '../providers/SchemaContext';\nimport { useSchemaRegistry } from '../providers';\nimport {\n  StaticCollectionFilter,\n  DynamicCollectionFilter,\n} from '../components/filters';\nimport {\n  createDateTimeFilter,\n  createBooleanFilter,\n  createNumberFilter,\n  createEnumFilter,\n  createReferenceFilter,\n} from '../utils/filterCreators';\n\nexport interface FilterOptions {\n  key: string;\n  fieldId: string;\n  filter: Filter<any>;\n  component: React.ElementType;\n  collectionData?: { id: string; name: string }[];\n  collectionId?: string;\n  componentName?: string;\n  props: Record<string, any>;\n}\n\nexport interface ReturnValue {\n  filters: { [key: string]: Filter<any> };\n  components: React.JSX.Element[];\n  collectionToolbarFiltersProps: Pick<\n    CollectionToolbarFiltersProps,\n    'inline' | 'panelTitle' | 'useNewFilters'\n  >;\n}\n\nexport const useFilters = (configuration?: FiltersConfig) => {\n  const schema = useSchema();\n  const schemaRegistry = useSchemaRegistry();\n  const filters = React.useMemo(() => {\n    const currFilters: FilterOptions[] = [];\n    configuration?.items.forEach((filter) => {\n      const { id, fieldId } = filter;\n      const fieldDefinition = schema.fields[fieldId];\n      if (!fieldDefinition) {\n        return;\n      }\n\n      const label = filter.displayName || fieldDefinition.displayName;\n      const { openByDefault, tagLabel, sectionTitle } = filter;\n\n      const baseParams = {\n        id,\n        fieldId,\n        commonFilterProps: {\n          sectionTitle,\n          initiallyOpen: openByDefault,\n          accordionItemProps: { label },\n          toolbarItemProps: { label },\n          toolbarTagProps: { label: tagLabel },\n        },\n      };\n\n      switch (fieldDefinition.type) {\n        case 'DATE':\n        case 'DATETIME':\n          currFilters.push(\n            createDateTimeFilter({\n              ...baseParams,\n              config: filter.dateConfig,\n            }),\n          );\n          break;\n\n        case 'BOOLEAN':\n          currFilters.push(\n            createBooleanFilter({\n              ...baseParams,\n              config: filter.booleanConfig,\n            }),\n          );\n          break;\n\n        case 'NUMBER':\n          currFilters.push(\n            createNumberFilter({\n              ...baseParams,\n              config: filter.numberConfig,\n            }),\n          );\n          break;\n\n        case 'REFERENCE': {\n          const { referencedCollectionId } = fieldDefinition.referenceMetadata;\n          const referencedSchema = schemaRegistry.getSchema(\n            referencedCollectionId,\n          );\n\n          if (referencedSchema) {\n            currFilters.push(\n              createReferenceFilter({\n                ...baseParams,\n                config: filter.dynamicOptionsConfig,\n                additionalParams: {\n                  referencedSchema,\n                },\n              }),\n            );\n          }\n          break;\n        }\n\n        default:\n          if (filter?.enumConfig) {\n            currFilters.push(\n              createEnumFilter({\n                ...baseParams,\n                config: filter.enumConfig,\n              }),\n            );\n          }\n          break;\n      }\n    });\n    return currFilters;\n  }, [configuration?.items, schema.fields, schemaRegistry]);\n\n  const filtersMapping = React.useMemo(() => {\n    return configuration?.items.reduce((acc, filter) => {\n      acc[filter.id] = filter;\n      return acc;\n    }, {} as Record<string, SchemaFilterType>);\n  }, [configuration?.items]);\n\n  const collectionToolbarFiltersProps = React.useMemo<\n    Pick<CollectionToolbarFiltersProps, 'inline' | 'panelTitle'>\n  >(\n    () => ({\n      inline: configuration?.maxInlineFilters || 0,\n      panelTitle: configuration?.panelTitle,\n    }),\n    [configuration],\n  );\n\n  const filtersData = filters.reduce<ReturnValue>(\n    (acc, filter) => {\n      acc.filters[filter.key] = filter.filter;\n      acc.components.push(\n        filter.collectionData ? (\n          <StaticCollectionFilter\n            filter={filter.filter}\n            key={filter.key}\n            component={filter.component}\n            collectionData={filter.collectionData}\n            {...filter.props}\n          />\n        ) : filter.collectionId ? (\n          <DynamicCollectionFilter\n            filter={filter.filter}\n            key={filter.key}\n            component={filter.component}\n            collectionId={filter.collectionId}\n            componentName={filter.props.componentName}\n            {...filter.props}\n          />\n        ) : (\n          <filter.component\n            key={filter.key}\n            filter={filter.filter}\n            {...filter.props}\n          />\n        ),\n      );\n\n      return acc;\n    },\n    { filters: {}, components: [], collectionToolbarFiltersProps },\n  );\n\n  return {\n    filtersMapping,\n    filtersObject: filtersData.filters,\n    filterComponent:\n      filtersData.components.length > 0 ? (\n        <CollectionToolbarFilters {...collectionToolbarFiltersProps}>\n          {filtersData.components}\n        </CollectionToolbarFilters>\n      ) : undefined,\n  };\n};\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SACEC,wBAAwB,QAGnB,eAAe;AAEtB,SAASC,SAAS,QAAQ,4BAA4B;AACtD,SAASC,iBAAiB,QAAQ,cAAc;AAChD,SACEC,sBAAsB,EACtBC,uBAAuB,QAClB,uBAAuB;AAC9B,SACEC,oBAAoB,EACpBC,mBAAmB,EACnBC,kBAAkB,EAClBC,gBAAgB,EAChBC,qBAAqB,QAChB,yBAAyB;AAsBhC,OAAO,MAAMC,UAAU,GAAIC,aAA6B,IAAK;EAC3D,MAAMC,MAAM,GAAGX,SAAS,CAAC,CAAC;EAC1B,MAAMY,cAAc,GAAGX,iBAAiB,CAAC,CAAC;EAC1C,MAAMY,OAAO,GAAGf,KAAK,CAACgB,OAAO,CAAC,MAAM;IAClC,MAAMC,WAA4B,GAAG,EAAE;IACvCL,aAAa,YAAbA,aAAa,CAAEM,KAAK,CAACC,OAAO,CAAEC,MAAM,IAAK;MACvC,MAAM;QAAEC,EAAE;QAAEC;MAAQ,CAAC,GAAGF,MAAM;MAC9B,MAAMG,eAAe,GAAGV,MAAM,CAACW,MAAM,CAACF,OAAO,CAAC;MAC9C,IAAI,CAACC,eAAe,EAAE;QACpB;MACF;MAEA,MAAME,KAAK,GAAGL,MAAM,CAACM,WAAW,IAAIH,eAAe,CAACG,WAAW;MAC/D,MAAM;QAAEC,aAAa;QAAEC,QAAQ;QAAEC;MAAa,CAAC,GAAGT,MAAM;MAExD,MAAMU,UAAU,GAAG;QACjBT,EAAE;QACFC,OAAO;QACPS,iBAAiB,EAAE;UACjBF,YAAY;UACZG,aAAa,EAAEL,aAAa;UAC5BM,kBAAkB,EAAE;YAAER;UAAM,CAAC;UAC7BS,gBAAgB,EAAE;YAAET;UAAM,CAAC;UAC3BU,eAAe,EAAE;YAAEV,KAAK,EAAEG;UAAS;QACrC;MACF,CAAC;MAED,QAAQL,eAAe,CAACa,IAAI;QAC1B,KAAK,MAAM;QACX,KAAK,UAAU;UACbnB,WAAW,CAACoB,IAAI,CACd/B,oBAAoB,CAAC;YACnB,GAAGwB,UAAU;YACbQ,MAAM,EAAElB,MAAM,CAACmB;UACjB,CAAC,CACH,CAAC;UACD;QAEF,KAAK,SAAS;UACZtB,WAAW,CAACoB,IAAI,CACd9B,mBAAmB,CAAC;YAClB,GAAGuB,UAAU;YACbQ,MAAM,EAAElB,MAAM,CAACoB;UACjB,CAAC,CACH,CAAC;UACD;QAEF,KAAK,QAAQ;UACXvB,WAAW,CAACoB,IAAI,CACd7B,kBAAkB,CAAC;YACjB,GAAGsB,UAAU;YACbQ,MAAM,EAAElB,MAAM,CAACqB;UACjB,CAAC,CACH,CAAC;UACD;QAEF,KAAK,WAAW;UAAE;YAChB,MAAM;cAAEC;YAAuB,CAAC,GAAGnB,eAAe,CAACoB,iBAAiB;YACpE,MAAMC,gBAAgB,GAAG9B,cAAc,CAAC+B,SAAS,CAC/CH,sBACF,CAAC;YAED,IAAIE,gBAAgB,EAAE;cACpB3B,WAAW,CAACoB,IAAI,CACd3B,qBAAqB,CAAC;gBACpB,GAAGoB,UAAU;gBACbQ,MAAM,EAAElB,MAAM,CAAC0B,oBAAoB;gBACnCC,gBAAgB,EAAE;kBAChBH;gBACF;cACF,CAAC,CACH,CAAC;YACH;YACA;UACF;QAEA;UACE,IAAIxB,MAAM,YAANA,MAAM,CAAE4B,UAAU,EAAE;YACtB/B,WAAW,CAACoB,IAAI,CACd5B,gBAAgB,CAAC;cACf,GAAGqB,UAAU;cACbQ,MAAM,EAAElB,MAAM,CAAC4B;YACjB,CAAC,CACH,CAAC;UACH;UACA;MACJ;IACF,CAAC,CAAC;IACF,OAAO/B,WAAW;EACpB,CAAC,EAAE,CAACL,aAAa,oBAAbA,aAAa,CAAEM,KAAK,EAAEL,MAAM,CAACW,MAAM,EAAEV,cAAc,CAAC,CAAC;EAEzD,MAAMmC,cAAc,GAAGjD,KAAK,CAACgB,OAAO,CAAC,MAAM;IACzC,OAAOJ,aAAa,oBAAbA,aAAa,CAAEM,KAAK,CAACgC,MAAM,CAAC,CAACC,GAAG,EAAE/B,MAAM,KAAK;MAClD+B,GAAG,CAAC/B,MAAM,CAACC,EAAE,CAAC,GAAGD,MAAM;MACvB,OAAO+B,GAAG;IACZ,CAAC,EAAE,CAAC,CAAqC,CAAC;EAC5C,CAAC,EAAE,CAACvC,aAAa,oBAAbA,aAAa,CAAEM,KAAK,CAAC,CAAC;EAE1B,MAAMkC,6BAA6B,GAAGpD,KAAK,CAACgB,OAAO,CAGjD,OAAO;IACLqC,MAAM,EAAE,CAAAzC,aAAa,oBAAbA,aAAa,CAAE0C,gBAAgB,KAAI,CAAC;IAC5CC,UAAU,EAAE3C,aAAa,oBAAbA,aAAa,CAAE2C;EAC7B,CAAC,CAAC,EACF,CAAC3C,aAAa,CAChB,CAAC;EAED,MAAM4C,WAAW,GAAGzC,OAAO,CAACmC,MAAM,CAChC,CAACC,GAAG,EAAE/B,MAAM,KAAK;IACf+B,GAAG,CAACpC,OAAO,CAACK,MAAM,CAACqC,GAAG,CAAC,GAAGrC,MAAM,CAACA,MAAM;IACvC+B,GAAG,CAACO,UAAU,CAACrB,IAAI,CACjBjB,MAAM,CAACuC,cAAc,gBACnB3D,KAAA,CAAA4D,aAAA,CAACxD,sBAAsB,EAAAyD,QAAA;MACrBzC,MAAM,EAAEA,MAAM,CAACA,MAAO;MACtBqC,GAAG,EAAErC,MAAM,CAACqC,GAAI;MAChBK,SAAS,EAAE1C,MAAM,CAAC0C,SAAU;MAC5BH,cAAc,EAAEvC,MAAM,CAACuC;IAAe,GAClCvC,MAAM,CAAC2C,KAAK,CACjB,CAAC,GACA3C,MAAM,CAAC4C,YAAY,gBACrBhE,KAAA,CAAA4D,aAAA,CAACvD,uBAAuB,EAAAwD,QAAA;MACtBzC,MAAM,EAAEA,MAAM,CAACA,MAAO;MACtBqC,GAAG,EAAErC,MAAM,CAACqC,GAAI;MAChBK,SAAS,EAAE1C,MAAM,CAAC0C,SAAU;MAC5BE,YAAY,EAAE5C,MAAM,CAAC4C,YAAa;MAClCC,aAAa,EAAE7C,MAAM,CAAC2C,KAAK,CAACE;IAAc,GACtC7C,MAAM,CAAC2C,KAAK,CACjB,CAAC,gBAEF/D,KAAA,CAAA4D,aAAA,CAACxC,MAAM,CAAC0C,SAAS,EAAAD,QAAA;MACfJ,GAAG,EAAErC,MAAM,CAACqC,GAAI;MAChBrC,MAAM,EAAEA,MAAM,CAACA;IAAO,GAClBA,MAAM,CAAC2C,KAAK,CACjB,CAEL,CAAC;IAED,OAAOZ,GAAG;EACZ,CAAC,EACD;IAAEpC,OAAO,EAAE,CAAC,CAAC;IAAE2C,UAAU,EAAE,EAAE;IAAEN;EAA8B,CAC/D,CAAC;EAED,OAAO;IACLH,cAAc;IACdiB,aAAa,EAAEV,WAAW,CAACzC,OAAO;IAClCoD,eAAe,EACbX,WAAW,CAACE,UAAU,CAACU,MAAM,GAAG,CAAC,gBAC/BpE,KAAA,CAAA4D,aAAA,CAAC3D,wBAAwB,EAAKmD,6BAA6B,EACxDI,WAAW,CAACE,UACW,CAAC,GACzBW;EACR,CAAC;AACH,CAAC","ignoreList":[]}

package/dist/esm/hooks/useGridFeatures.js

@@ -3,7 +3,9 @@ import { useGridCollection } from '@wix/patterns';
 import { useCommonCollectionFeatures } from './useCommonCollectionFeatures';
 import { useFilters } from './useFilters';
 import { useMemo } from 'react';
-import { useCollectionData } from '../providers';
+import { useSchema } from '../providers/SchemaContext';
+import { useAutoPatternsOptimisticActions } from './useAutoPatternsOptimisticActions';
+import { getImageUrl } from '../utils/media/getImageUrl';
 export const useGridFeatures = configuration => {
   const {
     item,
@@ -17,28 +19,30 @@ export const useGridFeatures = configuration => {
     selectionConsistencyMode
   } = collection;
   const {
-    title,
-    subtitle,
-    image,
+    titleFieldId,
+    subtitleFieldId,
+    imageFieldId,
     imagePlacement,
-    preset
+    cardContentMode: preset
   } = item;
-  const commonFeatures = useCommonCollectionFeatures(configuration);
   const {
     filterComponent,
-    filtersObject
+    filtersObject,
+    filtersMapping
   } = useFilters(configuration.filters);
+  const visibleFieldIds = useMemo(() => [titleFieldId, subtitleFieldId, imageFieldId].filter(Boolean), [titleFieldId, subtitleFieldId, imageFieldId]);
   const {
     fetchData
-  } = useFetchData(configuration.collection);
-  const {
-    entityIdKey,
-    entityNameKey
-  } = useCollectionData();
+  } = useFetchData({
+    collectionConfig: configuration.collection,
+    visibleFieldIds,
+    filtersMapping
+  });
+  const schema = useSchema();
   const state = useGridCollection({
     queryName: `${collectionId}`,
-    itemKey: gridItem => gridItem[entityIdKey],
-    itemName: gridItem => gridItem[entityNameKey],
+    itemKey: gridItem => gridItem[schema.idField],
+    itemName: gridItem => gridItem[schema.displayField],
     filters: filtersObject,
     toExtendedFields: gridItem => gridItem.extendedFields,
     fetchErrorMessage: _ref => {
@@ -53,16 +57,22 @@ export const useGridFeatures = configuration => {
     disableAutoSelectAllCount,
     selectionConsistencyMode
   });
+  const optimisticActions = useAutoPatternsOptimisticActions(state.collection);
+  const commonFeatures = useCommonCollectionFeatures({
+    ...configuration,
+    optimisticActions,
+    collectionType: 'Grid'
+  });
   const renderItem = useMemo(() => gridItem => ({
-    id: gridItem[entityIdKey],
-    title: `${gridItem[title]}`,
-    ...(subtitle ? {
-      subtitle: `${gridItem[subtitle] ?? ''}`
+    id: gridItem[schema.idField],
+    title: `${gridItem[titleFieldId]}`,
+    ...(subtitleFieldId ? {
+      subtitle: `${gridItem[subtitleFieldId] ?? ''}`
     } : {}),
-    ...(image ? {
-      backgroundImageUrl: `${gridItem[image]}`
+    ...(imageFieldId ? {
+      backgroundImageUrl: getImageUrl(gridItem[imageFieldId])
     } : {})
-  }), [title, subtitle, image, entityIdKey]);
+  }), [titleFieldId, subtitleFieldId, imageFieldId, schema.idField]);
   return {
     ...commonFeatures,
     state,

package/dist/esm/hooks/useGridFeatures.js.map

@@ -1 +1 @@
-{"version":3,"names":["useFetchData","useGridCollection","useCommonCollectionFeatures","useFilters","useMemo","useCollectionData","useGridFeatures","configuration","item","collection","collectionId","limit","persistQueryToUrl","disableAutoSelectAllCount","selectionConsistencyMode","title","subtitle","image","imagePlacement","preset","commonFeatures","filterComponent","filtersObject","filters","fetchData","entityIdKey","entityNameKey","state","queryName","itemKey","gridItem","itemName","toExtendedFields","extendedFields","fetchErrorMessage","_ref","err","String","renderItem","id","backgroundImageUrl"],"sources":["../../../src/hooks/useGridFeatures.tsx"],"sourcesContent":["import { GridConfig } from '../types';\nimport { useFetchData } from './useFetchData';\nimport { useGridCollection } from '@wix/patterns';\nimport { useCommonCollectionFeatures } from './useCommonCollectionFeatures';\nimport { useFilters } from './useFilters';\nimport { useMemo } from 'react';\nimport { useCollectionData } from '../providers';\n\nexport const useGridFeatures = (configuration: GridConfig) => {\n  const { item, collection } = configuration;\n\n  const {\n    collectionId,\n    limit,\n    persistQueryToUrl,\n    disableAutoSelectAllCount,\n    selectionConsistencyMode,\n  } = collection;\n\n  const { title, subtitle, image, imagePlacement, preset } = item;\n\n  const commonFeatures = useCommonCollectionFeatures(configuration);\n\n  const { filterComponent, filtersObject } = useFilters(configuration.filters);\n  const { fetchData } = useFetchData(configuration.collection);\n\n  const { entityIdKey, entityNameKey } = useCollectionData();\n\n  const state = useGridCollection<any>({\n    queryName: `${collectionId}`,\n    itemKey: (gridItem) => gridItem[entityIdKey],\n    itemName: (gridItem) => gridItem[entityNameKey],\n    filters: filtersObject,\n    toExtendedFields: (gridItem) => gridItem.extendedFields,\n    fetchErrorMessage: ({ err }) => String(err),\n    fetchData,\n    limit,\n    persistQueryToUrl,\n    disableAutoSelectAllCount,\n    selectionConsistencyMode,\n  });\n\n  const renderItem = useMemo(\n    () => (gridItem: any) => ({\n      id: gridItem[entityIdKey],\n      title: `${gridItem[title]}`,\n      ...(subtitle ? { subtitle: `${gridItem[subtitle] ?? ''}` } : {}),\n      ...(image ? { backgroundImageUrl: `${gridItem[image]}` } : {}),\n    }),\n    [title, subtitle, image, entityIdKey],\n  );\n\n  return {\n    ...commonFeatures,\n    state,\n    imagePlacement,\n    preset,\n    renderItem,\n    filters: filterComponent,\n  };\n};\n"],"mappings":"AACA,SAASA,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,iBAAiB,QAAQ,eAAe;AACjD,SAASC,2BAA2B,QAAQ,+BAA+B;AAC3E,SAASC,UAAU,QAAQ,cAAc;AACzC,SAASC,OAAO,QAAQ,OAAO;AAC/B,SAASC,iBAAiB,QAAQ,cAAc;AAEhD,OAAO,MAAMC,eAAe,GAAIC,aAAyB,IAAK;EAC5D,MAAM;IAAEC,IAAI;IAAEC;EAAW,CAAC,GAAGF,aAAa;EAE1C,MAAM;IACJG,YAAY;IACZC,KAAK;IACLC,iBAAiB;IACjBC,yBAAyB;IACzBC;EACF,CAAC,GAAGL,UAAU;EAEd,MAAM;IAAEM,KAAK;IAAEC,QAAQ;IAAEC,KAAK;IAAEC,cAAc;IAAEC;EAAO,CAAC,GAAGX,IAAI;EAE/D,MAAMY,cAAc,GAAGlB,2BAA2B,CAACK,aAAa,CAAC;EAEjE,MAAM;IAAEc,eAAe;IAAEC;EAAc,CAAC,GAAGnB,UAAU,CAACI,aAAa,CAACgB,OAAO,CAAC;EAC5E,MAAM;IAAEC;EAAU,CAAC,GAAGxB,YAAY,CAACO,aAAa,CAACE,UAAU,CAAC;EAE5D,MAAM;IAAEgB,WAAW;IAAEC;EAAc,CAAC,GAAGrB,iBAAiB,CAAC,CAAC;EAE1D,MAAMsB,KAAK,GAAG1B,iBAAiB,CAAM;IACnC2B,SAAS,EAAE,GAAGlB,YAAY,EAAE;IAC5BmB,OAAO,EAAGC,QAAQ,IAAKA,QAAQ,CAACL,WAAW,CAAC;IAC5CM,QAAQ,EAAGD,QAAQ,IAAKA,QAAQ,CAACJ,aAAa,CAAC;IAC/CH,OAAO,EAAED,aAAa;IACtBU,gBAAgB,EAAGF,QAAQ,IAAKA,QAAQ,CAACG,cAAc;IACvDC,iBAAiB,EAAEC,IAAA;MAAA,IAAC;QAAEC;MAAI,CAAC,GAAAD,IAAA;MAAA,OAAKE,MAAM,CAACD,GAAG,CAAC;IAAA;IAC3CZ,SAAS;IACTb,KAAK;IACLC,iBAAiB;IACjBC,yBAAyB;IACzBC;EACF,CAAC,CAAC;EAEF,MAAMwB,UAAU,GAAGlC,OAAO,CACxB,MAAO0B,QAAa,KAAM;IACxBS,EAAE,EAAET,QAAQ,CAACL,WAAW,CAAC;IACzBV,KAAK,EAAE,GAAGe,QAAQ,CAACf,KAAK,CAAC,EAAE;IAC3B,IAAIC,QAAQ,GAAG;MAAEA,QAAQ,EAAE,GAAGc,QAAQ,CAACd,QAAQ,CAAC,IAAI,EAAE;IAAG,CAAC,GAAG,CAAC,CAAC,CAAC;IAChE,IAAIC,KAAK,GAAG;MAAEuB,kBAAkB,EAAE,GAAGV,QAAQ,CAACb,KAAK,CAAC;IAAG,CAAC,GAAG,CAAC,CAAC;EAC/D,CAAC,CAAC,EACF,CAACF,KAAK,EAAEC,QAAQ,EAAEC,KAAK,EAAEQ,WAAW,CACtC,CAAC;EAED,OAAO;IACL,GAAGL,cAAc;IACjBO,KAAK;IACLT,cAAc;IACdC,MAAM;IACNmB,UAAU;IACVf,OAAO,EAAEF;EACX,CAAC;AACH,CAAC","ignoreList":[]}
+{"version":3,"names":["useFetchData","useGridCollection","useCommonCollectionFeatures","useFilters","useMemo","useSchema","useAutoPatternsOptimisticActions","getImageUrl","useGridFeatures","configuration","item","collection","collectionId","limit","persistQueryToUrl","disableAutoSelectAllCount","selectionConsistencyMode","titleFieldId","subtitleFieldId","imageFieldId","imagePlacement","cardContentMode","preset","filterComponent","filtersObject","filtersMapping","filters","visibleFieldIds","filter","Boolean","fetchData","collectionConfig","schema","state","queryName","itemKey","gridItem","idField","itemName","displayField","toExtendedFields","extendedFields","fetchErrorMessage","_ref","err","String","optimisticActions","commonFeatures","collectionType","renderItem","id","title","subtitle","backgroundImageUrl"],"sources":["../../../src/hooks/useGridFeatures.tsx"],"sourcesContent":["import { GridConfig } from '../types';\nimport { useFetchData } from './useFetchData';\nimport { useGridCollection } from '@wix/patterns';\nimport { useCommonCollectionFeatures } from './useCommonCollectionFeatures';\nimport { useFilters } from './useFilters';\nimport { useMemo } from 'react';\nimport { useSchema } from '../providers/SchemaContext';\nimport { useAutoPatternsOptimisticActions } from './useAutoPatternsOptimisticActions';\nimport { getImageUrl } from '../utils/media/getImageUrl';\n\nexport const useGridFeatures = (configuration: GridConfig) => {\n  const { item, collection } = configuration;\n\n  const {\n    collectionId,\n    limit,\n    persistQueryToUrl,\n    disableAutoSelectAllCount,\n    selectionConsistencyMode,\n  } = collection;\n\n  const {\n    titleFieldId,\n    subtitleFieldId,\n    imageFieldId,\n    imagePlacement,\n    cardContentMode: preset,\n  } = item;\n\n  const { filterComponent, filtersObject, filtersMapping } = useFilters(\n    configuration.filters,\n  );\n\n  const visibleFieldIds = useMemo(\n    () =>\n      [titleFieldId, subtitleFieldId, imageFieldId].filter(Boolean) as string[],\n    [titleFieldId, subtitleFieldId, imageFieldId],\n  );\n\n  const { fetchData } = useFetchData({\n    collectionConfig: configuration.collection,\n    visibleFieldIds,\n    filtersMapping,\n  });\n  const schema = useSchema();\n\n  const state = useGridCollection<any>({\n    queryName: `${collectionId}`,\n    itemKey: (gridItem) => gridItem[schema.idField],\n    itemName: (gridItem) => gridItem[schema.displayField],\n    filters: filtersObject,\n    toExtendedFields: (gridItem) => gridItem.extendedFields,\n    fetchErrorMessage: ({ err }) => String(err),\n    fetchData,\n    limit,\n    persistQueryToUrl,\n    disableAutoSelectAllCount,\n    selectionConsistencyMode,\n  });\n\n  const optimisticActions = useAutoPatternsOptimisticActions(state.collection);\n\n  const commonFeatures = useCommonCollectionFeatures({\n    ...configuration,\n    optimisticActions,\n    collectionType: 'Grid',\n  });\n\n  const renderItem = useMemo(\n    () => (gridItem: any) => ({\n      id: gridItem[schema.idField],\n      title: `${gridItem[titleFieldId]}`,\n      ...(subtitleFieldId\n        ? { subtitle: `${gridItem[subtitleFieldId] ?? ''}` }\n        : {}),\n      ...(imageFieldId\n        ? { backgroundImageUrl: getImageUrl(gridItem[imageFieldId]) }\n        : {}),\n    }),\n    [titleFieldId, subtitleFieldId, imageFieldId, schema.idField],\n  );\n\n  return {\n    ...commonFeatures,\n    state,\n    imagePlacement,\n    preset,\n    renderItem,\n    filters: filterComponent,\n  };\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/hooks/useNavigationUtils.js

@@ -0,0 +1,47 @@
+import { useCallback } from 'react';
+import { usePatternsNavigate } from '@wix/patterns';
+import { useAppConfigContext, useSchema } from '../providers';
+import { generatePath } from 'react-router-dom';
+import { usePagePath } from './usePagePath';
+export const useNavigation = () => {
+  const {
+    navigateToEntityPage: navigateToEntityPagePatterns
+  } = usePatternsNavigate();
+  const appConfig = useAppConfigContext();
+  const schema = useSchema();
+  const {
+    getPagePath
+  } = usePagePath(appConfig);
+  const navigateToEntityPage = useCallback(_ref => {
+    var _route$params;
+    let {
+      item,
+      entityPageId
+    } = _ref;
+    const entityPage = entityPageId ? appConfig.pages.find(page => page.id === entityPageId) : null;
+    if (!entityPage) {
+      return;
+    }
+    const {
+      route
+    } = entityPage.entityPage;
+    if (route.path && (_route$params = route.params) != null && _route$params.id) {
+      const path = generatePath(route.path, {
+        [route.params.id]: item[schema.idField]
+      });
+      navigateToEntityPagePatterns({
+        path,
+        entity: item
+      });
+    }
+  }, [appConfig, navigateToEntityPagePatterns, schema.idField]);
+  const getParentPagePath = useCallback(parentPageId => {
+    return getPagePath(parentPageId);
+  }, [getPagePath]);
+  return {
+    navigateToEntityPage,
+    getParentPagePath,
+    getPagePath
+  };
+};
+//# sourceMappingURL=useNavigationUtils.js.map

package/dist/esm/hooks/useNavigationUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useCallback","usePatternsNavigate","useAppConfigContext","useSchema","generatePath","usePagePath","useNavigation","navigateToEntityPage","navigateToEntityPagePatterns","appConfig","schema","getPagePath","_ref","_route$params","item","entityPageId","entityPage","pages","find","page","id","route","path","params","idField","entity","getParentPagePath","parentPageId"],"sources":["../../../src/hooks/useNavigationUtils.tsx"],"sourcesContent":["import { useCallback } from 'react';\nimport { usePatternsNavigate } from '@wix/patterns';\nimport { useAppConfigContext, useSchema } from '../providers';\nimport { generatePath } from 'react-router-dom';\nimport { EntityPageConfig } from '../types';\nimport { usePagePath } from './usePagePath';\n\nexport type NavigateToEntityPageFunc = (args: {\n  item: any;\n  entityPageId?: string;\n}) => void;\n\nexport const useNavigation = () => {\n  const { navigateToEntityPage: navigateToEntityPagePatterns } =\n    usePatternsNavigate();\n  const appConfig = useAppConfigContext();\n  const schema = useSchema();\n  const { getPagePath } = usePagePath(appConfig);\n\n  const navigateToEntityPage = useCallback(\n    ({ item, entityPageId }) => {\n      const entityPage = entityPageId\n        ? appConfig.pages.find((page) => page.id === entityPageId)\n        : null;\n\n      if (!entityPage) {\n        return;\n      }\n\n      const { route } = entityPage.entityPage as EntityPageConfig;\n      if (route.path && route.params?.id) {\n        const path = generatePath(route.path, {\n          [route.params.id]: item[schema.idField],\n        });\n        navigateToEntityPagePatterns({\n          path,\n          entity: item,\n        });\n      }\n    },\n    [appConfig, navigateToEntityPagePatterns, schema.idField],\n  );\n\n  const getParentPagePath = useCallback(\n    (parentPageId?: string): string | undefined => {\n      return getPagePath(parentPageId);\n    },\n    [getPagePath],\n  );\n\n  return {\n    navigateToEntityPage,\n    getParentPagePath,\n    getPagePath,\n  };\n};\n"],"mappings":"AAAA,SAASA,WAAW,QAAQ,OAAO;AACnC,SAASC,mBAAmB,QAAQ,eAAe;AACnD,SAASC,mBAAmB,EAAEC,SAAS,QAAQ,cAAc;AAC7D,SAASC,YAAY,QAAQ,kBAAkB;AAE/C,SAASC,WAAW,QAAQ,eAAe;AAO3C,OAAO,MAAMC,aAAa,GAAGA,CAAA,KAAM;EACjC,MAAM;IAAEC,oBAAoB,EAAEC;EAA6B,CAAC,GAC1DP,mBAAmB,CAAC,CAAC;EACvB,MAAMQ,SAAS,GAAGP,mBAAmB,CAAC,CAAC;EACvC,MAAMQ,MAAM,GAAGP,SAAS,CAAC,CAAC;EAC1B,MAAM;IAAEQ;EAAY,CAAC,GAAGN,WAAW,CAACI,SAAS,CAAC;EAE9C,MAAMF,oBAAoB,GAAGP,WAAW,CACtCY,IAAA,IAA4B;IAAA,IAAAC,aAAA;IAAA,IAA3B;MAAEC,IAAI;MAAEC;IAAa,CAAC,GAAAH,IAAA;IACrB,MAAMI,UAAU,GAAGD,YAAY,GAC3BN,SAAS,CAACQ,KAAK,CAACC,IAAI,CAAEC,IAAI,IAAKA,IAAI,CAACC,EAAE,KAAKL,YAAY,CAAC,GACxD,IAAI;IAER,IAAI,CAACC,UAAU,EAAE;MACf;IACF;IAEA,MAAM;MAAEK;IAAM,CAAC,GAAGL,UAAU,CAACA,UAA8B;IAC3D,IAAIK,KAAK,CAACC,IAAI,KAAAT,aAAA,GAAIQ,KAAK,CAACE,MAAM,aAAZV,aAAA,CAAcO,EAAE,EAAE;MAClC,MAAME,IAAI,GAAGlB,YAAY,CAACiB,KAAK,CAACC,IAAI,EAAE;QACpC,CAACD,KAAK,CAACE,MAAM,CAACH,EAAE,GAAGN,IAAI,CAACJ,MAAM,CAACc,OAAO;MACxC,CAAC,CAAC;MACFhB,4BAA4B,CAAC;QAC3Bc,IAAI;QACJG,MAAM,EAAEX;MACV,CAAC,CAAC;IACJ;EACF,CAAC,EACD,CAACL,SAAS,EAAED,4BAA4B,EAAEE,MAAM,CAACc,OAAO,CAC1D,CAAC;EAED,MAAME,iBAAiB,GAAG1B,WAAW,CAClC2B,YAAqB,IAAyB;IAC7C,OAAOhB,WAAW,CAACgB,YAAY,CAAC;EAClC,CAAC,EACD,CAAChB,WAAW,CACd,CAAC;EAED,OAAO;IACLJ,oBAAoB;IACpBmB,iBAAiB;IACjBf;EACF,CAAC;AACH,CAAC","ignoreList":[]}