@wix/patterns 1.3.0 → 1.5.0

package/dist/cjs/components/Grid/GridFolders.js

@@ -7,13 +7,14 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _react = _interopRequireWildcard(require("react"));
 var _ToolbarCollectionContentAutoSizer = require("../ToolbarCollectionContentAutoSizer");
 var _mobxReactLite = require("mobx-react-lite");
-var _useGridSyncProps = require("./useGridSyncProps");
+var _useGridBaseSyncProps = require("./useGridBaseSyncProps");
 var _getToolbarCollectionFeaturesInitializers = require("../../state/getToolbarCollectionFeaturesInitializers");
 var _GridFoldersSectionsGroup = require("./GridFoldersSectionsGroup");
 var _CollectionCard = require("../CollectionCard");
 var _ToolbarCollection = require("../ToolbarCollection");
 var _GridFoldersPlaceholderStates = require("./GridFoldersPlaceholderStates");
 var _minimalRequiredWdsRuntimeCheck = require("../../minimalRequiredWdsRuntimeCheck");
+var _useToolbarCollectionSyncProps = require("../ToolbarCollection/useToolbarCollectionSyncProps");
 var _jsxFileName = "/home/builduser/work/db7ea24852bc3350/packages/cairo/dist/cjs/components/Grid/GridFolders.tsx";
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -38,17 +39,23 @@ function _GridFolders(props) {
       requiredBy: 'Cairo/GridFolders'
     });
   }
-  (0, _useGridSyncProps.useGridSyncProps)({
+  (0, _useToolbarCollectionSyncProps.useToolbarCollectionSyncProps)({
+    ...props,
+    state: state.toolbar,
+    isUsingDragAndDrop: false,
+    isUsingBulkActionsToolbar: false,
+    isUsingHorizontalScroll: false,
+    isUsingFolders: true,
+    isUsingTableVirtualization: false
+  });
+  (0, _useGridBaseSyncProps.useGridBaseSyncProps)({
     ...props,
     state: state.items
   });
-  (0, _useGridSyncProps.useGridSyncProps)({
+  (0, _useGridBaseSyncProps.useGridBaseSyncProps)({
     ...props,
-    renderItem: props.renderFolderItem,
-    actionCell: props.folderActionCell,
     renderAddItem: props.renderFolderAddItem,
-    state: state.folders,
-    isUsingFolders: true
+    state: state.folders
   });
   (0, _react.useEffect)(() => state.init({
     featuresInitializers: (0, _getToolbarCollectionFeaturesInitializers.getToolbarCollectionFeaturesInitializers)(props)
@@ -61,7 +68,7 @@ function _GridFolders(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 130,
+      lineNumber: 137,
       columnNumber: 5
     }
   }), /*#__PURE__*/_react.default.createElement(_ToolbarCollection.ToolbarCollection, (0, _extends2.default)({}, props, {
@@ -69,7 +76,7 @@ function _GridFolders(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 136,
+      lineNumber: 143,
       columnNumber: 7
     }
   }), /*#__PURE__*/_react.default.createElement(_GridFoldersPlaceholderStates.GridFoldersPlaceholderStates, {
@@ -81,21 +88,21 @@ function _GridFolders(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 137,
+      lineNumber: 144,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement(_ToolbarCollectionContentAutoSizer.ToolbarCollectionContentAutoSizer, {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 144,
+      lineNumber: 151,
       columnNumber: 11
     }
   }, /*#__PURE__*/_react.default.createElement(_GridFoldersSectionsGroup.GridFoldersSectionsGroup, (0, _extends2.default)({}, props, {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 145,
+      lineNumber: 152,
       columnNumber: 13
     }
   }))))), exportModal ?? toolbar.featuredComponents.exportModal.value);

package/dist/cjs/components/Grid/GridFolders.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_ToolbarCollectionContentAutoSizer","_mobxReactLite","_useGridSyncProps","_getToolbarCollectionFeaturesInitializers","_GridFoldersSectionsGroup","_CollectionCard","_ToolbarCollection","_GridFoldersPlaceholderStates","_minimalRequiredWdsRuntimeCheck","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_GridFolders","props","state","exportModal","dataHook","cardProps","emptyState","noResultsState","renderError","topNotification","toolbar","process","env","NODE_ENV","minimalRequiredWdsRuntimeCheck","required","requiredBy","useGridSyncProps","items","renderItem","renderFolderItem","actionCell","folderActionCell","renderAddItem","renderFolderAddItem","folders","isUsingFolders","useEffect","init","featuresInitializers","getToolbarCollectionFeaturesInitializers","createElement","CollectionCard","_extends2","__self","__source","fileName","lineNumber","columnNumber","ToolbarCollection","GridFoldersPlaceholderStates","ToolbarCollectionContentAutoSizer","GridFoldersSectionsGroup","featuredComponents","value","GridFolders","exports","observer"],"sources":["../../../../src/components/Grid/GridFolders.tsx"],"sourcesContent":["import { AddItemProps } from '@wix/design-system';\nimport React, { ReactElement, ReactNode, useEffect } from 'react';\nimport { FiltersMap } from '@wix/bex-core';\nimport { ToolbarCollectionContentAutoSizer } from '../ToolbarCollectionContentAutoSizer';\nimport { observer } from 'mobx-react-lite';\nimport { GridFoldersState } from '../../state';\nimport { ActionCell } from '../ActionCell';\nimport { SupportedCardGalleryItemProps } from './SupportedCardGalleryItemProps';\nimport { useGridSyncProps } from './useGridSyncProps';\nimport { getToolbarCollectionFeaturesInitializers } from '../../state/getToolbarCollectionFeaturesInitializers';\nimport { GridFoldersSectionsGroup } from './GridFoldersSectionsGroup';\nimport { GridFoldersPresetProps } from './GridFolders.types';\nimport { GridItemBaseProps } from './GridItemBaseProps';\nimport { CollectionCard } from '../CollectionCard';\nimport {\n  ToolbarCollection,\n  ToolbarCollectionBaseProps,\n} from '../ToolbarCollection';\nimport { GridFoldersPlaceholderStates } from './GridFoldersPlaceholderStates';\nimport { PartialAllFilters } from '../../state/FoldersAndItemsCollectionsState';\nimport { minimalRequiredWdsRuntimeCheck } from '../../minimalRequiredWdsRuntimeCheck';\n\nexport interface GridFoldersBaseProps<\n  T1,\n  F1 extends FiltersMap,\n  T2,\n  F2 extends FiltersMap,\n> extends Omit<\n      ToolbarCollectionBaseProps<T1, PartialAllFilters<F1, F2>>,\n      'emptyState' | 'noResultsState' | 'topNotification'\n    >,\n    GridItemBaseProps<T1, F1> {\n  dataHook?: string;\n  /** A GridFoldersState instance created using [useGridFolders](./?path=/story/common-hooks--usegridfolders). */\n  state: GridFoldersState<T1, F1, T2, F2>;\n  /** Optional custom title for the items section */\n  itemsSectionTitle?: string;\n  foldersSectionTitle?: string;\n  /** Same as `renderItem`, but for a folder item. */\n  renderFolderItem?: (\n    item: T2,\n    index: number,\n  ) => Partial<SupportedCardGalleryItemProps>;\n  /** Same as `preset` but for a folder item */\n  folderPreset?: 'full' | 'title';\n  /** Same as `actionCell`, but for a folder item. */\n  folderActionCell?: ActionCell<T2, F2>;\n  /** Same as `renderAddItem`, but for a folder item. */\n  renderFolderAddItem?: () => ReactElement<AddItemProps>;\n  /**\n   * Enable to configure Wix Patterns default EmptyState behaviour.\n   * Will be shown in when the collection is empty.\n   * Pass [`<CollectionEmptyState />`](./?path=/story/components-collection-features--empty-state) component.\n   */\n  emptyState?: ReactNode;\n\n  /**\n   * Enable to configure Wix Patterns default NoResultsState behaviour.\n   * Will be shown in when the the results after search or filter is empty.\n   * Pass [`<NoResultsState />`](./?path=/story/components-collection-features--no-results-state) component.\n   */\n  noResultsState?: ReactNode;\n  topNotification?: ReactElement;\n}\n\nexport type GridFoldersBasePropsWithoutPreset<\n  T1,\n  F1 extends FiltersMap,\n  T2,\n  F2 extends FiltersMap,\n> = Omit<\n  GridFoldersBaseProps<T1, F1, T2, F2>,\n  'preset' | 'folderPreset' | 'renderItem' | 'renderFolderItem'\n>;\n\nexport type GridFoldersProps<\n  T1,\n  F1 extends FiltersMap,\n  T2,\n  F2 extends FiltersMap,\n> = GridFoldersPresetProps<\n  T1,\n  T2,\n  GridFoldersBasePropsWithoutPreset<T1, F1, T2, F2>\n>;\n\nfunction _GridFolders<T1, F1 extends FiltersMap, T2, F2 extends FiltersMap>(\n  props: GridFoldersProps<T1, F1, T2, F2>,\n) {\n  const {\n    state,\n    exportModal,\n    dataHook,\n    cardProps,\n    emptyState,\n    noResultsState,\n    renderError,\n    topNotification,\n  } = props;\n\n  const { toolbar } = state;\n\n  if (process.env.NODE_ENV !== 'production') {\n    // https://github.com/wix-private/wix-design-systems/pull/13091/files#diff-0befb17e7fa12b244a3efce19b067187b39d3a96d4f7e62a59f4f0fd876dc37cR102\n    minimalRequiredWdsRuntimeCheck({\n      required: '^1.89.0',\n      requiredBy: 'Cairo/GridFolders',\n    });\n  }\n\n  useGridSyncProps({ ...props, state: state.items });\n  useGridSyncProps({\n    ...props,\n    renderItem: props.renderFolderItem,\n    actionCell: props.folderActionCell,\n    renderAddItem: props.renderFolderAddItem,\n    state: state.folders,\n    isUsingFolders: true,\n  });\n\n  useEffect(\n    () =>\n      state.init({\n        featuresInitializers: getToolbarCollectionFeaturesInitializers(props),\n      }),\n    [],\n  );\n\n  return (\n    <CollectionCard\n      renderError={false}\n      state={toolbar}\n      dataHook={dataHook}\n      {...cardProps}\n    >\n      <ToolbarCollection {...props} state={toolbar}>\n        <GridFoldersPlaceholderStates\n          state={state}\n          emptyState={emptyState}\n          noResultsState={noResultsState}\n          renderError={renderError}\n          topNotification={topNotification}\n        >\n          <ToolbarCollectionContentAutoSizer>\n            <GridFoldersSectionsGroup {...props} />\n          </ToolbarCollectionContentAutoSizer>\n        </GridFoldersPlaceholderStates>\n      </ToolbarCollection>\n      {exportModal ?? toolbar.featuredComponents.exportModal.value}\n    </CollectionCard>\n  );\n}\n\nexport const GridFolders = observer(_GridFolders);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_ToolbarCollectionContentAutoSizer","_mobxReactLite","_useGridBaseSyncProps","_getToolbarCollectionFeaturesInitializers","_GridFoldersSectionsGroup","_CollectionCard","_ToolbarCollection","_GridFoldersPlaceholderStates","_minimalRequiredWdsRuntimeCheck","_useToolbarCollectionSyncProps","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_GridFolders","props","state","exportModal","dataHook","cardProps","emptyState","noResultsState","renderError","topNotification","toolbar","process","env","NODE_ENV","minimalRequiredWdsRuntimeCheck","required","requiredBy","useToolbarCollectionSyncProps","isUsingDragAndDrop","isUsingBulkActionsToolbar","isUsingHorizontalScroll","isUsingFolders","isUsingTableVirtualization","useGridBaseSyncProps","items","renderAddItem","renderFolderAddItem","folders","useEffect","init","featuresInitializers","getToolbarCollectionFeaturesInitializers","createElement","CollectionCard","_extends2","__self","__source","fileName","lineNumber","columnNumber","ToolbarCollection","GridFoldersPlaceholderStates","ToolbarCollectionContentAutoSizer","GridFoldersSectionsGroup","featuredComponents","value","GridFolders","exports","observer"],"sources":["../../../../src/components/Grid/GridFolders.tsx"],"sourcesContent":["import { AddItemProps } from '@wix/design-system';\nimport React, { ReactElement, ReactNode, useEffect } from 'react';\nimport { FiltersMap } from '@wix/bex-core';\nimport { ToolbarCollectionContentAutoSizer } from '../ToolbarCollectionContentAutoSizer';\nimport { observer } from 'mobx-react-lite';\nimport { GridFoldersState } from '../../state';\nimport { ActionCell } from '../ActionCell';\nimport { SupportedCardGalleryItemProps } from './SupportedCardGalleryItemProps';\nimport { useGridBaseSyncProps } from './useGridBaseSyncProps';\nimport { getToolbarCollectionFeaturesInitializers } from '../../state/getToolbarCollectionFeaturesInitializers';\nimport { GridFoldersSectionsGroup } from './GridFoldersSectionsGroup';\nimport { GridFoldersPresetProps } from './GridFolders.types';\nimport { GridItemBaseProps } from './GridItemBaseProps';\nimport { CollectionCard } from '../CollectionCard';\nimport {\n  ToolbarCollection,\n  ToolbarCollectionBaseProps,\n} from '../ToolbarCollection';\nimport { GridFoldersPlaceholderStates } from './GridFoldersPlaceholderStates';\nimport { PartialAllFilters } from '../../state/FoldersAndItemsCollectionsState';\nimport { minimalRequiredWdsRuntimeCheck } from '../../minimalRequiredWdsRuntimeCheck';\nimport { useToolbarCollectionSyncProps } from '../ToolbarCollection/useToolbarCollectionSyncProps';\n\nexport interface GridFoldersBaseProps<\n  T1,\n  F1 extends FiltersMap,\n  T2,\n  F2 extends FiltersMap,\n> extends Omit<\n      ToolbarCollectionBaseProps<T1, PartialAllFilters<F1, F2>>,\n      'emptyState' | 'noResultsState' | 'topNotification'\n    >,\n    GridItemBaseProps<T1, F1> {\n  dataHook?: string;\n  /** A GridFoldersState instance created using [useGridFolders](./?path=/story/common-hooks--usegridfolders). */\n  state: GridFoldersState<T1, F1, T2, F2>;\n  /** Optional custom title for the items section */\n  itemsSectionTitle?: string;\n  foldersSectionTitle?: string;\n  /** Same as `renderItem`, but for a folder item. */\n  renderFolderItem?: (\n    item: T2,\n    index: number,\n  ) => Partial<SupportedCardGalleryItemProps>;\n  /** Same as `preset` but for a folder item */\n  folderPreset?: 'full' | 'title';\n  /** Same as `actionCell`, but for a folder item. */\n  folderActionCell?: ActionCell<T2, F2>;\n  /** Same as `renderAddItem`, but for a folder item. */\n  renderFolderAddItem?: () => ReactElement<AddItemProps>;\n  /**\n   * Shown when the collection is empty.\n   * Pass [`<CollectionEmptyState />`](./?path=/story/components-collection-features--empty-state) component.\n   */\n  emptyState?: ReactNode;\n\n  /**\n   * Enable to configure Wix Patterns default NoResultsState behaviour.\n   * Will be shown in when the the results after search or filter is empty.\n   * Pass [`<NoResultsState />`](./?path=/story/components-collection-features--no-results-state) component.\n   */\n  noResultsState?: ReactNode;\n  topNotification?: ReactElement;\n}\n\nexport type GridFoldersBasePropsWithoutPreset<\n  T1,\n  F1 extends FiltersMap,\n  T2,\n  F2 extends FiltersMap,\n> = Omit<\n  GridFoldersBaseProps<T1, F1, T2, F2>,\n  'preset' | 'folderPreset' | 'renderItem' | 'renderFolderItem'\n>;\n\nexport type GridFoldersProps<\n  T1,\n  F1 extends FiltersMap,\n  T2,\n  F2 extends FiltersMap,\n> = GridFoldersPresetProps<\n  T1,\n  T2,\n  GridFoldersBasePropsWithoutPreset<T1, F1, T2, F2>\n>;\n\nfunction _GridFolders<T1, F1 extends FiltersMap, T2, F2 extends FiltersMap>(\n  props: GridFoldersProps<T1, F1, T2, F2>,\n) {\n  const {\n    state,\n    exportModal,\n    dataHook,\n    cardProps,\n    emptyState,\n    noResultsState,\n    renderError,\n    topNotification,\n  } = props;\n\n  const { toolbar } = state;\n\n  if (process.env.NODE_ENV !== 'production') {\n    // https://github.com/wix-private/wix-design-systems/pull/13091/files#diff-0befb17e7fa12b244a3efce19b067187b39d3a96d4f7e62a59f4f0fd876dc37cR102\n    minimalRequiredWdsRuntimeCheck({\n      required: '^1.89.0',\n      requiredBy: 'Cairo/GridFolders',\n    });\n  }\n\n  useToolbarCollectionSyncProps({\n    ...props,\n    state: state.toolbar,\n    isUsingDragAndDrop: false,\n    isUsingBulkActionsToolbar: false,\n    isUsingHorizontalScroll: false,\n    isUsingFolders: true,\n    isUsingTableVirtualization: false,\n  });\n\n  useGridBaseSyncProps({ ...props, state: state.items });\n  useGridBaseSyncProps({\n    ...props,\n    renderAddItem: props.renderFolderAddItem,\n    state: state.folders,\n  });\n\n  useEffect(\n    () =>\n      state.init({\n        featuresInitializers: getToolbarCollectionFeaturesInitializers(props),\n      }),\n    [],\n  );\n\n  return (\n    <CollectionCard\n      renderError={false}\n      state={toolbar}\n      dataHook={dataHook}\n      {...cardProps}\n    >\n      <ToolbarCollection {...props} state={toolbar}>\n        <GridFoldersPlaceholderStates\n          state={state}\n          emptyState={emptyState}\n          noResultsState={noResultsState}\n          renderError={renderError}\n          topNotification={topNotification}\n        >\n          <ToolbarCollectionContentAutoSizer>\n            <GridFoldersSectionsGroup {...props} />\n          </ToolbarCollectionContentAutoSizer>\n        </GridFoldersPlaceholderStates>\n      </ToolbarCollection>\n      {exportModal ?? toolbar.featuredComponents.exportModal.value}\n    </CollectionCard>\n  );\n}\n\nexport const GridFolders = observer(_GridFolders);\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/Grid/GridPlaceholderStates.js

@@ -20,7 +20,7 @@ function _GridPlaceholderStates(props) {
     collection
   } = state;
   return /*#__PURE__*/_react.default.createElement(_PlaceholderStatesBase.PlaceholderStatesBase, {
-    state: state.toolbar.multi,
+    state: state.multi,
     topNotification: typeof topNotification === 'function' ? () => topNotification({
       query: collection.result.originQuery
     }) : topNotification,

package/dist/cjs/components/Grid/GridPlaceholderStates.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_mobxReactLite","_PlaceholderStatesBase","_jsxFileName","_GridPlaceholderStates","props","state","emptyState","noResultsState","renderError","topNotification","children","collection","default","createElement","PlaceholderStatesBase","toolbar","multi","query","result","originQuery","loadingState","__self","__source","fileName","lineNumber","columnNumber","GridPlaceholderStates","exports","observer"],"sources":["../../../../src/components/Grid/GridPlaceholderStates.tsx"],"sourcesContent":["import React from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { PlaceholderStatesBase } from '../PlaceholderStates/PlaceholderStatesBase';\nimport { GridBaseState } from '../../state';\nimport { ToolbarCollectionBaseProps } from '../ToolbarCollection';\nimport { FiltersMap } from '@wix/bex-core';\n\nexport interface GridPlaceholderStatesProps<T, F extends FiltersMap>\n  extends ToolbarCollectionBaseProps<T, F> {\n  state: GridBaseState<T, F>;\n}\n\nfunction _GridPlaceholderStates<T, F extends FiltersMap>(\n  props: GridPlaceholderStatesProps<T, F>,\n) {\n  const {\n    state,\n    emptyState,\n    noResultsState,\n    renderError,\n    topNotification,\n    children,\n  } = props;\n  const { collection } = state;\n  return (\n    <PlaceholderStatesBase\n      state={state.toolbar.multi}\n      topNotification={\n        typeof topNotification === 'function'\n          ? () => topNotification({ query: collection.result.originQuery })\n          : topNotification\n      }\n      emptyState={emptyState}\n      noResultsState={noResultsState}\n      renderError={renderError}\n      loadingState={null}\n    >\n      {children}\n    </PlaceholderStatesBase>\n  );\n}\n\nexport const GridPlaceholderStates = observer(_GridPlaceholderStates);\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,cAAA,GAAAD,OAAA;AACA,IAAAE,sBAAA,GAAAF,OAAA;AAAmF,IAAAG,YAAA;AAUnF,SAASC,sBAAsBA,CAC7BC,KAAuC,EACvC;EACA,MAAM;IACJC,KAAK;IACLC,UAAU;IACVC,cAAc;IACdC,WAAW;IACXC,eAAe;IACfC;EACF,CAAC,GAAGN,KAAK;EACT,MAAM;IAAEO;EAAW,CAAC,GAAGN,KAAK;EAC5B,oBACER,MAAA,CAAAe,OAAA,CAAAC,aAAA,CAACZ,sBAAA,CAAAa,qBAAqB;IACpBT,KAAK,EAAEA,KAAK,CAACU,OAAO,CAACC,KAAM;IAC3BP,eAAe,EACb,OAAOA,eAAe,KAAK,UAAU,GACjC,MAAMA,eAAe,CAAC;MAAEQ,KAAK,EAAEN,UAAU,CAACO,MAAM,CAACC;IAAY,CAAC,CAAC,GAC/DV,eACL;IACDH,UAAU,EAAEA,UAAW;IACvBC,cAAc,EAAEA,cAAe;IAC/BC,WAAW,EAAEA,WAAY;IACzBY,YAAY,EAAE,IAAK;IAAAC,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAArB,YAAA;MAAAsB,UAAA;MAAAC,YAAA;IAAA;EAAA,GAElBf,QACoB,CAAC;AAE5B;AAEO,MAAMgB,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAG,IAAAE,uBAAQ,EAACzB,sBAAsB,CAAC","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_mobxReactLite","_PlaceholderStatesBase","_jsxFileName","_GridPlaceholderStates","props","state","emptyState","noResultsState","renderError","topNotification","children","collection","default","createElement","PlaceholderStatesBase","multi","query","result","originQuery","loadingState","__self","__source","fileName","lineNumber","columnNumber","GridPlaceholderStates","exports","observer"],"sources":["../../../../src/components/Grid/GridPlaceholderStates.tsx"],"sourcesContent":["import React from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { PlaceholderStatesBase } from '../PlaceholderStates/PlaceholderStatesBase';\nimport { ToolbarCollectionState } from '../../state';\nimport { ToolbarCollectionBaseProps } from '../ToolbarCollection';\nimport { FiltersMap } from '@wix/bex-core';\n\nexport interface GridPlaceholderStatesProps<T, F extends FiltersMap>\n  extends ToolbarCollectionBaseProps<T, F> {\n  state: ToolbarCollectionState<T, F>;\n}\n\nfunction _GridPlaceholderStates<T, F extends FiltersMap>(\n  props: GridPlaceholderStatesProps<T, F>,\n) {\n  const {\n    state,\n    emptyState,\n    noResultsState,\n    renderError,\n    topNotification,\n    children,\n  } = props;\n  const { collection } = state;\n  return (\n    <PlaceholderStatesBase\n      state={state.multi}\n      topNotification={\n        typeof topNotification === 'function'\n          ? () => topNotification({ query: collection.result.originQuery })\n          : topNotification\n      }\n      emptyState={emptyState}\n      noResultsState={noResultsState}\n      renderError={renderError}\n      loadingState={null}\n    >\n      {children}\n    </PlaceholderStatesBase>\n  );\n}\n\nexport const GridPlaceholderStates = observer(_GridPlaceholderStates);\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,cAAA,GAAAD,OAAA;AACA,IAAAE,sBAAA,GAAAF,OAAA;AAAmF,IAAAG,YAAA;AAUnF,SAASC,sBAAsBA,CAC7BC,KAAuC,EACvC;EACA,MAAM;IACJC,KAAK;IACLC,UAAU;IACVC,cAAc;IACdC,WAAW;IACXC,eAAe;IACfC;EACF,CAAC,GAAGN,KAAK;EACT,MAAM;IAAEO;EAAW,CAAC,GAAGN,KAAK;EAC5B,oBACER,MAAA,CAAAe,OAAA,CAAAC,aAAA,CAACZ,sBAAA,CAAAa,qBAAqB;IACpBT,KAAK,EAAEA,KAAK,CAACU,KAAM;IACnBN,eAAe,EACb,OAAOA,eAAe,KAAK,UAAU,GACjC,MAAMA,eAAe,CAAC;MAAEO,KAAK,EAAEL,UAAU,CAACM,MAAM,CAACC;IAAY,CAAC,CAAC,GAC/DT,eACL;IACDH,UAAU,EAAEA,UAAW;IACvBC,cAAc,EAAEA,cAAe;IAC/BC,WAAW,EAAEA,WAAY;IACzBW,YAAY,EAAE,IAAK;IAAAC,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAApB,YAAA;MAAAqB,UAAA;MAAAC,YAAA;IAAA;EAAA,GAElBd,QACoB,CAAC;AAE5B;AAEO,MAAMe,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAG,IAAAE,uBAAQ,EAACxB,sBAAsB,CAAC","ignoreList":[]}

package/dist/cjs/components/Grid/{useGridSyncProps.js → useGridBaseSyncProps.js}

@@ -1,32 +1,22 @@
 "use strict";
 
 exports.__esModule = true;
-exports.useGridSyncProps = useGridSyncProps;
+exports.useGridBaseSyncProps = useGridBaseSyncProps;
 var _react = require("react");
 var _mobx = require("mobx");
-var _useToolbarCollectionSyncProps = require("../ToolbarCollection/useToolbarCollectionSyncProps");
 var _state = require("../../state");
 var _providers = require("../../providers");
-function useGridSyncProps(props) {
+function useGridBaseSyncProps(props) {
   const {
     state,
     renderAddItem,
     preset,
     dragAndDrop,
-    isUsingFolders
+    range
   } = props;
   const {
     scrollableContentRef
   } = (0, _providers.useScrollableContentContext)();
-  (0, _useToolbarCollectionSyncProps.useToolbarCollectionSyncProps)({
-    ...props,
-    state: state.toolbar,
-    isUsingDragAndDrop: !!props.dragAndDrop,
-    isUsingBulkActionsToolbar: false,
-    isUsingHorizontalScroll: false,
-    isUsingFolders: isUsingFolders ?? false,
-    isUsingTableVirtualization: false
-  });
   (0, _react.useEffect)(() => {
     const {
       collection
@@ -44,6 +34,12 @@ function useGridSyncProps(props) {
       state.trailingItemsCount = [renderAddItem].filter(Boolean).length;
     });
   }, [renderAddItem]);
+  (0, _react.useEffect)(() => {
+    (0, _mobx.runInAction)(() => {
+      state._localLimit = range == null ? void 0 : range.length;
+      state._localStart = (range == null ? void 0 : range.start) ?? 0;
+    });
+  }, [range]);
   (0, _react.useEffect)(() => {
     (0, _mobx.runInAction)(() => {
       state.preset = preset ?? 'title';
@@ -63,4 +59,4 @@ function useGridSyncProps(props) {
     });
   }, []);
 }
-//# sourceMappingURL=useGridSyncProps.js.map
+//# sourceMappingURL=useGridBaseSyncProps.js.map

package/dist/cjs/components/Grid/useGridBaseSyncProps.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_mobx","_state","_providers","useGridBaseSyncProps","props","state","renderAddItem","preset","dragAndDrop","range","scrollableContentRef","useScrollableContentContext","useEffect","collection","scrollableContent","current","runInAction","trailingItemsCount","filter","Boolean","length","_localLimit","_localStart","start","_draggable","imagePlacement","gridSizePresets","sizePreset"],"sources":["../../../../src/components/Grid/useGridBaseSyncProps.ts"],"sourcesContent":["import { ReactElement, useEffect } from 'react';\nimport { FiltersMap } from '@wix/bex-core';\nimport { runInAction } from 'mobx';\nimport { GridBaseState, gridSizePresets } from '../../state';\nimport { AddItemProps } from '@wix/design-system';\nimport { DragAndDrop } from '../DragAndDrop';\nimport { useScrollableContentContext } from '../../providers';\n\nexport interface UseGridBaseSyncPropsParams<T, F extends FiltersMap> {\n  state: GridBaseState<T, F>;\n  preset?: 'full' | 'title' | 'empty';\n  range?: { start: number; length: number };\n  renderAddItem?: () => ReactElement<AddItemProps>;\n  dragAndDrop?: DragAndDrop;\n  imagePlacement?: 'side' | 'top';\n}\n\nexport function useGridBaseSyncProps<T, F extends FiltersMap>(\n  props: UseGridBaseSyncPropsParams<T, F>,\n) {\n  const { state, renderAddItem, preset, dragAndDrop, range } = props;\n  const { scrollableContentRef } = useScrollableContentContext();\n\n  useEffect(() => {\n    const { collection } = state;\n\n    const scrollableContent = scrollableContentRef?.current;\n\n    if (scrollableContent) {\n      collection.scrollableContent = scrollableContent;\n    }\n\n    return () => {\n      collection.scrollableContent = null;\n    };\n  }, []);\n\n  useEffect(() => {\n    runInAction(() => {\n      state.trailingItemsCount = [renderAddItem].filter(Boolean).length;\n    });\n  }, [renderAddItem]);\n\n  useEffect(() => {\n    runInAction(() => {\n      state._localLimit = range?.length;\n      state._localStart = range?.start ?? 0;\n    });\n  }, [range]);\n\n  useEffect(() => {\n    runInAction(() => {\n      state.preset = preset ?? 'title';\n    });\n  }, [preset]);\n\n  useEffect(() => {\n    runInAction(() => {\n      state._draggable = dragAndDrop ? 'draggable' : 'none';\n    });\n  }, [dragAndDrop]);\n\n  useEffect(() => {\n    runInAction(() => {\n      if (!props.imagePlacement || !gridSizePresets[props.imagePlacement]) {\n        return;\n      }\n      state.sizePreset = gridSizePresets[props.imagePlacement];\n    });\n  }, []);\n}\n"],"mappings":";;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AAGA,IAAAG,UAAA,GAAAH,OAAA;AAWO,SAASI,oBAAoBA,CAClCC,KAAuC,EACvC;EACA,MAAM;IAAEC,KAAK;IAAEC,aAAa;IAAEC,MAAM;IAAEC,WAAW;IAAEC;EAAM,CAAC,GAAGL,KAAK;EAClE,MAAM;IAAEM;EAAqB,CAAC,GAAG,IAAAC,sCAA2B,EAAC,CAAC;EAE9D,IAAAC,gBAAS,EAAC,MAAM;IACd,MAAM;MAAEC;IAAW,CAAC,GAAGR,KAAK;IAE5B,MAAMS,iBAAiB,GAAGJ,oBAAoB,oBAApBA,oBAAoB,CAAEK,OAAO;IAEvD,IAAID,iBAAiB,EAAE;MACrBD,UAAU,CAACC,iBAAiB,GAAGA,iBAAiB;IAClD;IAEA,OAAO,MAAM;MACXD,UAAU,CAACC,iBAAiB,GAAG,IAAI;IACrC,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,IAAAF,gBAAS,EAAC,MAAM;IACd,IAAAI,iBAAW,EAAC,MAAM;MAChBX,KAAK,CAACY,kBAAkB,GAAG,CAACX,aAAa,CAAC,CAACY,MAAM,CAACC,OAAO,CAAC,CAACC,MAAM;IACnE,CAAC,CAAC;EACJ,CAAC,EAAE,CAACd,aAAa,CAAC,CAAC;EAEnB,IAAAM,gBAAS,EAAC,MAAM;IACd,IAAAI,iBAAW,EAAC,MAAM;MAChBX,KAAK,CAACgB,WAAW,GAAGZ,KAAK,oBAALA,KAAK,CAAEW,MAAM;MACjCf,KAAK,CAACiB,WAAW,GAAG,CAAAb,KAAK,oBAALA,KAAK,CAAEc,KAAK,KAAI,CAAC;IACvC,CAAC,CAAC;EACJ,CAAC,EAAE,CAACd,KAAK,CAAC,CAAC;EAEX,IAAAG,gBAAS,EAAC,MAAM;IACd,IAAAI,iBAAW,EAAC,MAAM;MAChBX,KAAK,CAACE,MAAM,GAAGA,MAAM,IAAI,OAAO;IAClC,CAAC,CAAC;EACJ,CAAC,EAAE,CAACA,MAAM,CAAC,CAAC;EAEZ,IAAAK,gBAAS,EAAC,MAAM;IACd,IAAAI,iBAAW,EAAC,MAAM;MAChBX,KAAK,CAACmB,UAAU,GAAGhB,WAAW,GAAG,WAAW,GAAG,MAAM;IACvD,CAAC,CAAC;EACJ,CAAC,EAAE,CAACA,WAAW,CAAC,CAAC;EAEjB,IAAAI,gBAAS,EAAC,MAAM;IACd,IAAAI,iBAAW,EAAC,MAAM;MAChB,IAAI,CAACZ,KAAK,CAACqB,cAAc,IAAI,CAACC,sBAAe,CAACtB,KAAK,CAACqB,cAAc,CAAC,EAAE;QACnE;MACF;MACApB,KAAK,CAACsB,UAAU,GAAGD,sBAAe,CAACtB,KAAK,CAACqB,cAAc,CAAC;IAC1D,CAAC,CAAC;EACJ,CAAC,EAAE,EAAE,CAAC;AACR","ignoreList":[]}

package/dist/cjs/components/Grid/useRenderItem.js

@@ -32,7 +32,7 @@ function useRenderItem(params) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 44,
+      lineNumber: 42,
       columnNumber: 7
     }
   }), [renderItem, actionCell, renderAddItem, dragAndDrop, preset]);

package/dist/cjs/components/Grid/useRenderItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_GridItem","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","useRenderItem","params","renderItem","state","renderAddItem","dragAndDrop","actionCell","preset","useCallback","index","itemKey","_itemKey","index2d","createElement","GridItem","rowIndex","columnIndex","__self","__source","fileName","lineNumber","columnNumber"],"sources":["../../../../src/components/Grid/useRenderItem.tsx"],"sourcesContent":["import React, { ReactElement, useCallback } from 'react';\nimport { RenderItem } from './RenderItem';\nimport { SupportedCardGalleryItemProps } from './SupportedCardGalleryItemProps';\nimport { ActionCellAPI, GridBaseState } from '../../state';\nimport { FiltersMap } from '@wix/bex-core';\nimport { AddItemProps } from '@wix/design-system';\nimport { DragAndDrop } from '../DragAndDrop';\nimport { ActionCellProps } from '../ActionCell';\nimport { GridItem } from './GridItem';\n\nexport interface UseRenderItemParams<T, F extends FiltersMap> {\n  preset?: 'full' | 'title' | 'empty';\n\n  renderItem?: (\n    item: T,\n    index: number,\n  ) => Partial<SupportedCardGalleryItemProps>;\n\n  state: GridBaseState<T, F>;\n\n  renderAddItem?: () => ReactElement<AddItemProps>;\n\n  actionCell?:\n    | ActionCellProps\n    | ((item: T, index: number, api: ActionCellAPI<T, F>) => ActionCellProps);\n\n  dragAndDrop?: DragAndDrop;\n}\n\nexport function useRenderItem<T, F extends FiltersMap>(\n  params: UseRenderItemParams<T, F>,\n) {\n  const {\n    renderItem,\n    state,\n    renderAddItem,\n    dragAndDrop,\n    actionCell,\n    preset = 'title',\n  } = params;\n\n  return useCallback<RenderItem>(\n    (index, { itemKey: _itemKey, index2d } = {}) => (\n      <GridItem\n        state={state}\n        index={index}\n        rowIndex={index2d?.rowIndex}\n        columnIndex={index2d?.columnIndex}\n        renderItem={renderItem}\n        actionCell={actionCell}\n        renderAddItem={renderAddItem}\n        dragAndDrop={dragAndDrop}\n        preset={preset}\n      />\n    ),\n    [renderItem, actionCell, renderAddItem, dragAndDrop, preset],\n  );\n}\n"],"mappings":";;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAQA,IAAAC,SAAA,GAAAD,OAAA;AAAsC,IAAAE,YAAA;AAAA,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAL,wBAAAK,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAqB/B,SAASW,aAAaA,CAC3BC,MAAiC,EACjC;EACA,MAAM;IACJC,UAAU;IACVC,KAAK;IACLC,aAAa;IACbC,WAAW;IACXC,UAAU;IACVC,MAAM,GAAG;EACX,CAAC,GAAGN,MAAM;EAEV,OAAO,IAAAO,kBAAW,EAChB,CAACC,KAAK,EAAE;IAAEC,OAAO,EAAEC,QAAQ;IAAEC;EAAQ,CAAC,GAAG,CAAC,CAAC,kBACzCrC,MAAA,CAAAW,OAAA,CAAA2B,aAAA,CAACnC,SAAA,CAAAoC,QAAQ;IACPX,KAAK,EAAEA,KAAM;IACbM,KAAK,EAAEA,KAAM;IACbM,QAAQ,EAAEH,OAAO,oBAAPA,OAAO,CAAEG,QAAS;IAC5BC,WAAW,EAAEJ,OAAO,oBAAPA,OAAO,CAAEI,WAAY;IAClCd,UAAU,EAAEA,UAAW;IACvBI,UAAU,EAAEA,UAAW;IACvBF,aAAa,EAAEA,aAAc;IAC7BC,WAAW,EAAEA,WAAY;IACzBE,MAAM,EAAEA,MAAO;IAAAU,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAxC,YAAA;MAAAyC,UAAA;MAAAC,YAAA;IAAA;EAAA,CAChB,CACF,EACD,CAACnB,UAAU,EAAEI,UAAU,EAAEF,aAAa,EAAEC,WAAW,EAAEE,MAAM,CAC7D,CAAC;AACH","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_GridItem","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","useRenderItem","params","renderItem","state","renderAddItem","dragAndDrop","actionCell","preset","useCallback","index","itemKey","_itemKey","index2d","createElement","GridItem","rowIndex","columnIndex","__self","__source","fileName","lineNumber","columnNumber"],"sources":["../../../../src/components/Grid/useRenderItem.tsx"],"sourcesContent":["import React, { ReactElement, useCallback } from 'react';\nimport { RenderItem } from './RenderItem';\nimport { SupportedCardGalleryItemProps } from './SupportedCardGalleryItemProps';\nimport { GridBaseState } from '../../state';\nimport { FiltersMap } from '@wix/bex-core';\nimport { AddItemProps } from '@wix/design-system';\nimport { DragAndDrop } from '../DragAndDrop';\nimport { ActionCell } from '../ActionCell';\nimport { GridItem } from './GridItem';\n\nexport interface UseRenderItemParams<T, F extends FiltersMap> {\n  preset?: 'full' | 'title' | 'empty';\n\n  renderItem?: (\n    item: T,\n    index: number,\n  ) => Partial<SupportedCardGalleryItemProps>;\n\n  state: GridBaseState<T, F>;\n\n  renderAddItem?: () => ReactElement<AddItemProps>;\n\n  actionCell?: ActionCell<T, F>;\n\n  dragAndDrop?: DragAndDrop;\n}\n\nexport function useRenderItem<T, F extends FiltersMap>(\n  params: UseRenderItemParams<T, F>,\n) {\n  const {\n    renderItem,\n    state,\n    renderAddItem,\n    dragAndDrop,\n    actionCell,\n    preset = 'title',\n  } = params;\n\n  return useCallback<RenderItem>(\n    (index, { itemKey: _itemKey, index2d } = {}) => (\n      <GridItem\n        state={state}\n        index={index}\n        rowIndex={index2d?.rowIndex}\n        columnIndex={index2d?.columnIndex}\n        renderItem={renderItem}\n        actionCell={actionCell}\n        renderAddItem={renderAddItem}\n        dragAndDrop={dragAndDrop}\n        preset={preset}\n      />\n    ),\n    [renderItem, actionCell, renderAddItem, dragAndDrop, preset],\n  );\n}\n"],"mappings":";;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAQA,IAAAC,SAAA,GAAAD,OAAA;AAAsC,IAAAE,YAAA;AAAA,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAL,wBAAAK,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAmB/B,SAASW,aAAaA,CAC3BC,MAAiC,EACjC;EACA,MAAM;IACJC,UAAU;IACVC,KAAK;IACLC,aAAa;IACbC,WAAW;IACXC,UAAU;IACVC,MAAM,GAAG;EACX,CAAC,GAAGN,MAAM;EAEV,OAAO,IAAAO,kBAAW,EAChB,CAACC,KAAK,EAAE;IAAEC,OAAO,EAAEC,QAAQ;IAAEC;EAAQ,CAAC,GAAG,CAAC,CAAC,kBACzCrC,MAAA,CAAAW,OAAA,CAAA2B,aAAA,CAACnC,SAAA,CAAAoC,QAAQ;IACPX,KAAK,EAAEA,KAAM;IACbM,KAAK,EAAEA,KAAM;IACbM,QAAQ,EAAEH,OAAO,oBAAPA,OAAO,CAAEG,QAAS;IAC5BC,WAAW,EAAEJ,OAAO,oBAAPA,OAAO,CAAEI,WAAY;IAClCd,UAAU,EAAEA,UAAW;IACvBI,UAAU,EAAEA,UAAW;IACvBF,aAAa,EAAEA,aAAc;IAC7BC,WAAW,EAAEA,WAAY;IACzBE,MAAM,EAAEA,MAAO;IAAAU,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAxC,YAAA;MAAAyC,UAAA;MAAAC,YAAA;IAAA;EAAA,CAChB,CACF,EACD,CAACnB,UAAU,EAAEI,UAAU,EAAEF,aAAa,EAAEC,WAAW,EAAEE,MAAM,CAC7D,CAAC;AACH","ignoreList":[]}

package/dist/cjs/components/GridSections/GridSectionAndRepeater.js

@@ -0,0 +1,55 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.GridSectionAndRepeater = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var _designSystem = require("@wix/design-system");
+var _mobxReactLite = require("mobx-react-lite");
+var _GridContent = require("../Grid/GridContent");
+var _GridSectionHeader = require("./GridSectionHeader");
+var _jsxFileName = "/home/builduser/work/db7ea24852bc3350/packages/cairo/dist/cjs/components/GridSections/GridSectionAndRepeater.tsx";
+function _GridSectionAndRepeater(props) {
+  const {
+    sectionDescriptor,
+    state
+  } = props;
+  const {
+    section,
+    range
+  } = sectionDescriptor;
+  const isLast = state.sections[state.sections.length - 1].section.id === section.id;
+  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    direction: "vertical",
+    width: "100%",
+    dataHook: "grid-section-and-repeater",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 31,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement(_GridSectionHeader.GridSectionHeader, {
+    sectionDescriptor: sectionDescriptor,
+    state: state,
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 32,
+      columnNumber: 7
+    }
+  }), /*#__PURE__*/_react.default.createElement(_GridContent.GridContent, (0, _extends2.default)({}, props, {
+    range: range,
+    state: state,
+    withInfiniteScrollLoader: isLast,
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 34,
+      columnNumber: 7
+    }
+  })));
+}
+const GridSectionAndRepeater = exports.GridSectionAndRepeater = (0, _mobxReactLite.observer)(_GridSectionAndRepeater);
+//# sourceMappingURL=GridSectionAndRepeater.js.map

package/dist/cjs/components/GridSections/GridSectionAndRepeater.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_designSystem","_mobxReactLite","_GridContent","_GridSectionHeader","_jsxFileName","_GridSectionAndRepeater","props","sectionDescriptor","state","section","range","isLast","sections","length","id","default","createElement","Box","direction","width","dataHook","__self","__source","fileName","lineNumber","columnNumber","GridSectionHeader","GridContent","_extends2","withInfiniteScrollLoader","GridSectionAndRepeater","exports","observer"],"sources":["../../../../src/components/GridSections/GridSectionAndRepeater.tsx"],"sourcesContent":["import React from 'react';\nimport { GridSectionsState, SectionRange } from './GridSectionsState';\nimport { FiltersMap } from '@wix/bex-core';\nimport { Box } from '@wix/design-system';\nimport { observer } from 'mobx-react-lite';\nimport { SupportedCardGalleryItemProps } from '../Grid/SupportedCardGalleryItemProps';\nimport { GridContent } from '../Grid/GridContent';\nimport { GridSectionHeader } from './GridSectionHeader';\n\nexport interface GridSectionAndRepeaterProps<T, F extends FiltersMap> {\n  sectionDescriptor: SectionRange;\n  state: GridSectionsState<T, F>;\n  preset?: 'full' | 'title' | 'empty';\n  renderItem?: (\n    item: T,\n    index: number,\n  ) => Partial<SupportedCardGalleryItemProps>;\n}\n\nfunction _GridSectionAndRepeater<T, F extends FiltersMap>(\n  props: GridSectionAndRepeaterProps<T, F>,\n) {\n  const { sectionDescriptor, state } = props;\n\n  const { section, range } = sectionDescriptor;\n\n  const isLast =\n    state.sections[state.sections.length - 1].section.id === section.id;\n\n  return (\n    <Box direction=\"vertical\" width=\"100%\" dataHook=\"grid-section-and-repeater\">\n      <GridSectionHeader sectionDescriptor={sectionDescriptor} state={state} />\n\n      <GridContent\n        {...props}\n        range={range}\n        state={state}\n        withInfiniteScrollLoader={isLast}\n      />\n    </Box>\n  );\n}\n\nexport const GridSectionAndRepeater = observer(_GridSectionAndRepeater);\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAGA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,cAAA,GAAAF,OAAA;AAEA,IAAAG,YAAA,GAAAH,OAAA;AACA,IAAAI,kBAAA,GAAAJ,OAAA;AAAwD,IAAAK,YAAA;AAYxD,SAASC,uBAAuBA,CAC9BC,KAAwC,EACxC;EACA,MAAM;IAAEC,iBAAiB;IAAEC;EAAM,CAAC,GAAGF,KAAK;EAE1C,MAAM;IAAEG,OAAO;IAAEC;EAAM,CAAC,GAAGH,iBAAiB;EAE5C,MAAMI,MAAM,GACVH,KAAK,CAACI,QAAQ,CAACJ,KAAK,CAACI,QAAQ,CAACC,MAAM,GAAG,CAAC,CAAC,CAACJ,OAAO,CAACK,EAAE,KAAKL,OAAO,CAACK,EAAE;EAErE,oBACEjB,MAAA,CAAAkB,OAAA,CAAAC,aAAA,CAAChB,aAAA,CAAAiB,GAAG;IAACC,SAAS,EAAC,UAAU;IAACC,KAAK,EAAC,MAAM;IAACC,QAAQ,EAAC,2BAA2B;IAAAC,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAnB,YAAA;MAAAoB,UAAA;MAAAC,YAAA;IAAA;EAAA,gBACzE5B,MAAA,CAAAkB,OAAA,CAAAC,aAAA,CAACb,kBAAA,CAAAuB,iBAAiB;IAACnB,iBAAiB,EAAEA,iBAAkB;IAACC,KAAK,EAAEA,KAAM;IAAAa,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAnB,YAAA;MAAAoB,UAAA;MAAAC,YAAA;IAAA;EAAA,CAAE,CAAC,eAEzE5B,MAAA,CAAAkB,OAAA,CAAAC,aAAA,CAACd,YAAA,CAAAyB,WAAW,MAAAC,SAAA,CAAAb,OAAA,MACNT,KAAK;IACTI,KAAK,EAAEA,KAAM;IACbF,KAAK,EAAEA,KAAM;IACbqB,wBAAwB,EAAElB,MAAO;IAAAU,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAnB,YAAA;MAAAoB,UAAA;MAAAC,YAAA;IAAA;EAAA,EAClC,CACE,CAAC;AAEV;AAEO,MAAMK,sBAAsB,GAAAC,OAAA,CAAAD,sBAAA,GAAG,IAAAE,uBAAQ,EAAC3B,uBAAuB,CAAC","ignoreList":[]}

package/dist/cjs/components/GridSections/GridSectionHeader.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.GridSectionHeader = void 0;
+var _designSystem = require("@wix/design-system");
+var _react = _interopRequireDefault(require("react"));
+var _mobxReactLite = require("mobx-react-lite");
+var _GridSectionHeaderActionBar = require("./GridSectionHeaderActionBar");
+var _jsxFileName = "/home/builduser/work/db7ea24852bc3350/packages/cairo/dist/cjs/components/GridSections/GridSectionHeader.tsx";
+function _GridSectionHeader(props) {
+  const {
+    sectionDescriptor
+  } = props;
+  const {
+    section
+  } = sectionDescriptor;
+  return /*#__PURE__*/_react.default.createElement(_designSystem.SectionHeader, {
+    dataHook: "grid-section-header",
+    title: section.title,
+    skin: "neutral",
+    divider: "none",
+    suffix: /*#__PURE__*/_react.default.createElement(_GridSectionHeaderActionBar.GridSectionHeaderActionBar, {
+      section: section,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 26,
+        columnNumber: 15
+      }
+    }),
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 21,
+      columnNumber: 5
+    }
+  });
+}
+const GridSectionHeader = exports.GridSectionHeader = (0, _mobxReactLite.observer)(_GridSectionHeader);
+//# sourceMappingURL=GridSectionHeader.js.map

package/dist/cjs/components/GridSections/GridSectionHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_designSystem","require","_react","_interopRequireDefault","_mobxReactLite","_GridSectionHeaderActionBar","_jsxFileName","_GridSectionHeader","props","sectionDescriptor","section","default","createElement","SectionHeader","dataHook","title","skin","divider","suffix","GridSectionHeaderActionBar","__self","__source","fileName","lineNumber","columnNumber","GridSectionHeader","exports","observer"],"sources":["../../../../src/components/GridSections/GridSectionHeader.tsx"],"sourcesContent":["import { SectionHeader } from '@wix/design-system';\nimport React from 'react';\nimport { FiltersMap } from '@wix/bex-core';\nimport { GridSectionsState, SectionRange } from './GridSectionsState';\nimport { observer } from 'mobx-react-lite';\nimport { GridSectionHeaderActionBar } from './GridSectionHeaderActionBar';\n\nexport interface GridSectionHeaderProps<T, F extends FiltersMap> {\n  sectionDescriptor: SectionRange;\n  state: GridSectionsState<T, F>;\n}\n\nfunction _GridSectionHeader<T, F extends FiltersMap>(\n  props: GridSectionHeaderProps<T, F>,\n) {\n  const { sectionDescriptor } = props;\n\n  const { section } = sectionDescriptor;\n\n  return (\n    <SectionHeader\n      dataHook=\"grid-section-header\"\n      title={section.title}\n      skin=\"neutral\"\n      divider=\"none\"\n      suffix={<GridSectionHeaderActionBar section={section} />}\n    />\n  );\n}\n\nexport const GridSectionHeader = observer(_GridSectionHeader);\n"],"mappings":";;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,cAAA,GAAAH,OAAA;AACA,IAAAI,2BAAA,GAAAJ,OAAA;AAA0E,IAAAK,YAAA;AAO1E,SAASC,kBAAkBA,CACzBC,KAAmC,EACnC;EACA,MAAM;IAAEC;EAAkB,CAAC,GAAGD,KAAK;EAEnC,MAAM;IAAEE;EAAQ,CAAC,GAAGD,iBAAiB;EAErC,oBACEP,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACZ,aAAA,CAAAa,aAAa;IACZC,QAAQ,EAAC,qBAAqB;IAC9BC,KAAK,EAAEL,OAAO,CAACK,KAAM;IACrBC,IAAI,EAAC,SAAS;IACdC,OAAO,EAAC,MAAM;IACdC,MAAM,eAAEhB,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACP,2BAAA,CAAAc,0BAA0B;MAACT,OAAO,EAAEA,OAAQ;MAAAU,MAAA;MAAAC,QAAA;QAAAC,QAAA,EAAAhB,YAAA;QAAAiB,UAAA;QAAAC,YAAA;MAAA;IAAA,CAAE,CAAE;IAAAJ,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAhB,YAAA;MAAAiB,UAAA;MAAAC,YAAA;IAAA;EAAA,CAC1D,CAAC;AAEN;AAEO,MAAMC,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAAE,uBAAQ,EAACpB,kBAAkB,CAAC","ignoreList":[]}

package/dist/cjs/components/GridSections/GridSectionHeader.uni.driver.js

@@ -0,0 +1,12 @@
+"use strict";
+
+exports.__esModule = true;
+exports.GridSectionHeaderUniDriver = GridSectionHeaderUniDriver;
+var _unidriver = require("@wix/design-system/dist/testkit/unidriver");
+function GridSectionHeaderUniDriver(base, body) {
+  return {
+    ...(0, _unidriver.SectionHeaderUniDriver)(base, body),
+    getPrimaryAction: () => (0, _unidriver.TextButtonUniDriver)(base.$('[data-hook="grid-section-header-primary-action"]'), body)
+  };
+}
+//# sourceMappingURL=GridSectionHeader.uni.driver.js.map

package/dist/cjs/components/GridSections/GridSectionHeader.uni.driver.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_unidriver","require","GridSectionHeaderUniDriver","base","body","SectionHeaderUniDriver","getPrimaryAction","TextButtonUniDriver","$"],"sources":["../../../../src/components/GridSections/GridSectionHeader.uni.driver.ts"],"sourcesContent":["import { UniDriver } from '@wix/wix-ui-test-utils/unidriver';\nimport {\n  SectionHeaderUniDriver,\n  TextButtonUniDriver,\n} from '@wix/design-system/dist/testkit/unidriver';\n\nexport function GridSectionHeaderUniDriver(base: UniDriver, body: UniDriver) {\n  return {\n    ...SectionHeaderUniDriver(base, body),\n    getPrimaryAction: () =>\n      TextButtonUniDriver(\n        base.$('[data-hook=\"grid-section-header-primary-action\"]'),\n        body,\n      ),\n  };\n}\n"],"mappings":";;;;AACA,IAAAA,UAAA,GAAAC,OAAA;AAKO,SAASC,0BAA0BA,CAACC,IAAe,EAAEC,IAAe,EAAE;EAC3E,OAAO;IACL,GAAG,IAAAC,iCAAsB,EAACF,IAAI,EAAEC,IAAI,CAAC;IACrCE,gBAAgB,EAAEA,CAAA,KAChB,IAAAC,8BAAmB,EACjBJ,IAAI,CAACK,CAAC,CAAC,kDAAkD,CAAC,EAC1DJ,IACF;EACJ,CAAC;AACH","ignoreList":[]}

package/dist/cjs/components/GridSections/GridSectionHeaderActionBar.js

@@ -0,0 +1,36 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.GridSectionHeaderActionBar = GridSectionHeaderActionBar;
+var _designSystem = require("@wix/design-system");
+var _react = _interopRequireDefault(require("react"));
+var _jsxFileName = "/home/builduser/work/db7ea24852bc3350/packages/cairo/dist/cjs/components/GridSections/GridSectionHeaderActionBar.tsx";
+function GridSectionHeaderActionBar(props) {
+  const {
+    section: {
+      primaryAction
+    }
+  } = props;
+  return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    direction: "horizontal",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 16,
+      columnNumber: 5
+    }
+  }, primaryAction && /*#__PURE__*/_react.default.createElement(_designSystem.TextButton, {
+    prefixIcon: primaryAction.prefixIcon,
+    dataHook: "grid-section-header-primary-action",
+    onClick: primaryAction.onClick,
+    size: "small",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 18,
+      columnNumber: 9
+    }
+  }, primaryAction.label));
+}
+//# sourceMappingURL=GridSectionHeaderActionBar.js.map

package/dist/cjs/components/GridSections/GridSectionHeaderActionBar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_designSystem","require","_react","_interopRequireDefault","_jsxFileName","GridSectionHeaderActionBar","props","section","primaryAction","default","createElement","Box","direction","__self","__source","fileName","lineNumber","columnNumber","TextButton","prefixIcon","dataHook","onClick","size","label"],"sources":["../../../../src/components/GridSections/GridSectionHeaderActionBar.tsx"],"sourcesContent":["import { Box, TextButton } from '@wix/design-system';\nimport React from 'react';\nimport { Section } from './GridSectionsState';\n\nexport interface GridSectionHeaderActionBarProps {\n  section: Section;\n}\n\nexport function GridSectionHeaderActionBar(\n  props: GridSectionHeaderActionBarProps,\n) {\n  const {\n    section: { primaryAction },\n  } = props;\n  return (\n    <Box direction=\"horizontal\">\n      {primaryAction && (\n        <TextButton\n          prefixIcon={primaryAction.prefixIcon}\n          dataHook=\"grid-section-header-primary-action\"\n          onClick={primaryAction.onClick}\n          size=\"small\"\n        >\n          {primaryAction.label}\n        </TextButton>\n      )}\n    </Box>\n  );\n}\n"],"mappings":";;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAA0B,IAAAG,YAAA;AAOnB,SAASC,0BAA0BA,CACxCC,KAAsC,EACtC;EACA,MAAM;IACJC,OAAO,EAAE;MAAEC;IAAc;EAC3B,CAAC,GAAGF,KAAK;EACT,oBACEJ,MAAA,CAAAO,OAAA,CAAAC,aAAA,CAACV,aAAA,CAAAW,GAAG;IAACC,SAAS,EAAC,YAAY;IAAAC,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAX,YAAA;MAAAY,UAAA;MAAAC,YAAA;IAAA;EAAA,GACxBT,aAAa,iBACZN,MAAA,CAAAO,OAAA,CAAAC,aAAA,CAACV,aAAA,CAAAkB,UAAU;IACTC,UAAU,EAAEX,aAAa,CAACW,UAAW;IACrCC,QAAQ,EAAC,oCAAoC;IAC7CC,OAAO,EAAEb,aAAa,CAACa,OAAQ;IAC/BC,IAAI,EAAC,OAAO;IAAAT,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAX,YAAA;MAAAY,UAAA;MAAAC,YAAA;IAAA;EAAA,GAEXT,aAAa,CAACe,KACL,CAEX,CAAC;AAEV","ignoreList":[]}

package/dist/cjs/components/GridSections/GridSectionsContent.js

@@ -0,0 +1,67 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.GridSectionsContent = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _GridSectionsState = require("./GridSectionsState");
+var _mobxReactLite = require("mobx-react-lite");
+var _GridSectionAndRepeater = require("./GridSectionAndRepeater");
+var _react = _interopRequireWildcard(require("react"));
+var _GridContent = require("../Grid/GridContent");
+var _mobx = require("mobx");
+var _jsxFileName = "/home/builduser/work/db7ea24852bc3350/packages/cairo/dist/cjs/components/GridSections/GridSectionsContent.tsx";
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _GridSectionsContent(props) {
+  const {
+    state: grid,
+    renderSection
+  } = props;
+  const {
+    toolbar
+  } = grid;
+  const {
+    showInitialLoader,
+    multi: {
+      showRefreshLoader
+    }
+  } = toolbar;
+  const [state] = (0, _react.useState)(() => grid._sections ?? (grid._sections = new _GridSectionsState.GridSectionsState({
+    toolbar: grid.toolbar,
+    collection: grid.collection,
+    renderSection
+  })));
+  const {
+    sections
+  } = state;
+  (0, _react.useEffect)(() => {
+    (0, _mobx.runInAction)(() => {
+      state.renderSection = renderSection;
+    });
+  }, [renderSection]);
+  if (!sections.length || showInitialLoader || showRefreshLoader) {
+    return /*#__PURE__*/_react.default.createElement(_GridContent.GridContent, (0, _extends2.default)({}, props, {
+      state: state,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 51,
+        columnNumber: 12
+      }
+    }));
+  }
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, sections.map(sectionDescriptor => /*#__PURE__*/_react.default.createElement(_GridSectionAndRepeater.GridSectionAndRepeater, (0, _extends2.default)({}, props, {
+    key: sectionDescriptor.section.id,
+    sectionDescriptor: sectionDescriptor,
+    state: state,
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 57,
+      columnNumber: 9
+    }
+  }))));
+}
+const GridSectionsContent = exports.GridSectionsContent = (0, _mobxReactLite.observer)(_GridSectionsContent);
+//# sourceMappingURL=GridSectionsContent.js.map

package/dist/cjs/components/GridSections/GridSectionsContent.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_GridSectionsState","require","_mobxReactLite","_GridSectionAndRepeater","_react","_interopRequireWildcard","_GridContent","_mobx","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_GridSectionsContent","props","state","grid","renderSection","toolbar","showInitialLoader","multi","showRefreshLoader","useState","_sections","GridSectionsState","collection","sections","useEffect","runInAction","length","createElement","GridContent","_extends2","__self","__source","fileName","lineNumber","columnNumber","Fragment","map","sectionDescriptor","GridSectionAndRepeater","key","section","id","GridSectionsContent","exports","observer"],"sources":["../../../../src/components/GridSections/GridSectionsContent.tsx"],"sourcesContent":["import { GridSectionsState, Section } from './GridSectionsState';\nimport { CollectionState, FiltersMap } from '@wix/bex-core';\nimport { observer } from 'mobx-react-lite';\nimport { GridSectionAndRepeater } from './GridSectionAndRepeater';\nimport React, { useEffect, useState } from 'react';\nimport { GridContent, GridContentBaseProps } from '../Grid/GridContent';\nimport { GridBaseState, ToolbarCollectionState } from '../../state';\nimport { runInAction } from 'mobx';\n\nexport interface GridSectionsContentProps<T, F extends FiltersMap>\n  extends GridContentBaseProps<T, F> {\n  state: {\n    toolbar: ToolbarCollectionState<T, F>;\n    collection: CollectionState<T, F>;\n    _grid?: GridBaseState<T, F>;\n    _sections?: GridSectionsState<T, F>;\n  };\n  renderSection?: (item: T) => Section;\n}\n\nfunction _GridSectionsContent<T, F extends FiltersMap>(\n  props: GridSectionsContentProps<T, F>,\n) {\n  const { state: grid, renderSection } = props;\n\n  const { toolbar } = grid;\n\n  const {\n    showInitialLoader,\n    multi: { showRefreshLoader },\n  } = toolbar;\n\n  const [state] = useState(\n    () =>\n      (grid._sections ??= new GridSectionsState({\n        toolbar: grid.toolbar,\n        collection: grid.collection,\n        renderSection,\n      })),\n  );\n\n  const { sections } = state;\n\n  useEffect(() => {\n    runInAction(() => {\n      state.renderSection = renderSection;\n    });\n  }, [renderSection]);\n\n  if (!sections.length || showInitialLoader || showRefreshLoader) {\n    return <GridContent {...props} state={state} />;\n  }\n\n  return (\n    <>\n      {sections.map((sectionDescriptor) => (\n        <GridSectionAndRepeater\n          {...props}\n          key={sectionDescriptor.section.id}\n          sectionDescriptor={sectionDescriptor}\n          state={state}\n        />\n      ))}\n    </>\n  );\n}\n\nexport const GridSectionsContent = observer(_GridSectionsContent);\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/GridSections/GridSectionsState.js

@@ -0,0 +1,47 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.GridSectionsState = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _mobx = require("mobx");
+class GridSectionsState {
+  constructor(params) {
+    (0, _defineProperty2.default)(this, "renderSection", void 0);
+    (0, _defineProperty2.default)(this, "toolbar", void 0);
+    (0, _defineProperty2.default)(this, "collection", void 0);
+    (0, _defineProperty2.default)(this, "_subGrids", []);
+    this.collection = params.collection;
+    this.toolbar = params.toolbar;
+    this.renderSection = params.renderSection;
+    (0, _mobx.makeObservable)(this, {
+      sections: _mobx.computed,
+      renderSection: _mobx.observable.ref
+    });
+  }
+  get sections() {
+    const {
+      collection,
+      renderSection
+    } = this;
+    if (!renderSection) {
+      return [];
+    }
+    return Object.values(collection.result.items.reduce((acc, item, index) => {
+      const section = renderSection(item);
+      if (!acc[section.id]) {
+        acc[section.id] = {
+          section,
+          range: {
+            start: index,
+            length: 0
+          }
+        };
+      }
+      acc[section.id].range.length++;
+      return acc;
+    }, {}));
+  }
+}
+exports.GridSectionsState = GridSectionsState;
+//# sourceMappingURL=GridSectionsState.js.map

package/dist/cjs/components/GridSections/GridSectionsState.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_mobx","require","GridSectionsState","constructor","params","_defineProperty2","default","collection","toolbar","renderSection","makeObservable","sections","computed","observable","ref","Object","values","result","items","reduce","acc","item","index","section","id","range","start","length","exports"],"sources":["../../../../src/components/GridSections/GridSectionsState.ts"],"sourcesContent":["import { CollectionState, FiltersMap } from '@wix/bex-core';\nimport { computed, makeObservable, observable } from 'mobx';\nimport { GridBaseState, ToolbarCollectionState } from '../../state';\nimport { CtaBaseProps } from '../CtaProps';\n\nexport interface Section {\n  id: string;\n  title: string;\n  primaryAction?: CtaBaseProps;\n}\n\nexport interface SectionRange {\n  section: Section;\n  range: {\n    start: number;\n    length: number;\n  };\n}\n\nexport type RenderSection<T> = (item: T) => Section;\n\nexport interface GridSectionsStateParams<T, F extends FiltersMap> {\n  readonly collection: CollectionState<T, F>;\n  readonly toolbar: ToolbarCollectionState<T, F>;\n  readonly renderSection?: RenderSection<T>;\n}\n\nexport class GridSectionsState<T, F extends FiltersMap> {\n  renderSection?: RenderSection<T>;\n  readonly toolbar;\n  readonly collection;\n\n  readonly _subGrids = [] as GridBaseState<T, F>[];\n\n  constructor(params: GridSectionsStateParams<T, F>) {\n    this.collection = params.collection;\n    this.toolbar = params.toolbar;\n    this.renderSection = params.renderSection;\n\n    makeObservable(this, {\n      sections: computed,\n      renderSection: observable.ref,\n    });\n  }\n\n  get sections() {\n    const { collection, renderSection } = this;\n\n    if (!renderSection) {\n      return [];\n    }\n\n    return Object.values(\n      collection.result.items.reduce((acc, item, index) => {\n        const section = renderSection(item);\n        if (!acc[section.id]) {\n          acc[section.id] = {\n            section,\n            range: {\n              start: index,\n              length: 0,\n            },\n          };\n        }\n        acc[section.id].range.length++;\n        return acc;\n      }, {} as Record<string, SectionRange>),\n    );\n  }\n}\n"],"mappings":";;;;;;AACA,IAAAA,KAAA,GAAAC,OAAA;AA0BO,MAAMC,iBAAiB,CAA0B;EAOtDC,WAAWA,CAACC,MAAqC,EAAE;IAAA,IAAAC,gBAAA,CAAAC,OAAA;IAAA,IAAAD,gBAAA,CAAAC,OAAA;IAAA,IAAAD,gBAAA,CAAAC,OAAA;IAAA,IAAAD,gBAAA,CAAAC,OAAA,qBAF9B,EAAE;IAGrB,IAAI,CAACC,UAAU,GAAGH,MAAM,CAACG,UAAU;IACnC,IAAI,CAACC,OAAO,GAAGJ,MAAM,CAACI,OAAO;IAC7B,IAAI,CAACC,aAAa,GAAGL,MAAM,CAACK,aAAa;IAEzC,IAAAC,oBAAc,EAAC,IAAI,EAAE;MACnBC,QAAQ,EAAEC,cAAQ;MAClBH,aAAa,EAAEI,gBAAU,CAACC;IAC5B,CAAC,CAAC;EACJ;EAEA,IAAIH,QAAQA,CAAA,EAAG;IACb,MAAM;MAAEJ,UAAU;MAAEE;IAAc,CAAC,GAAG,IAAI;IAE1C,IAAI,CAACA,aAAa,EAAE;MAClB,OAAO,EAAE;IACX;IAEA,OAAOM,MAAM,CAACC,MAAM,CAClBT,UAAU,CAACU,MAAM,CAACC,KAAK,CAACC,MAAM,CAAC,CAACC,GAAG,EAAEC,IAAI,EAAEC,KAAK,KAAK;MACnD,MAAMC,OAAO,GAAGd,aAAa,CAACY,IAAI,CAAC;MACnC,IAAI,CAACD,GAAG,CAACG,OAAO,CAACC,EAAE,CAAC,EAAE;QACpBJ,GAAG,CAACG,OAAO,CAACC,EAAE,CAAC,GAAG;UAChBD,OAAO;UACPE,KAAK,EAAE;YACLC,KAAK,EAAEJ,KAAK;YACZK,MAAM,EAAE;UACV;QACF,CAAC;MACH;MACAP,GAAG,CAACG,OAAO,CAACC,EAAE,CAAC,CAACC,KAAK,CAACE,MAAM,EAAE;MAC9B,OAAOP,GAAG;IACZ,CAAC,EAAE,CAAC,CAAiC,CACvC,CAAC;EACH;AACF;AAACQ,OAAA,CAAA1B,iBAAA,GAAAA,iBAAA","ignoreList":[]}

package/dist/cjs/components/Heading/Heading.st.css.js

@@ -5,14 +5,14 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
 // @ts-nocheck
 
-var _namespace_ = "Heading3722466155";
+var _namespace_ = "Heading1110286094";
 var _style_ = _stylableEsmRuntime.classesRuntime.bind(null, _namespace_);
 var cssStates = exports.cssStates = _stylableEsmRuntime.statesRuntime.bind(null, _namespace_);
 var style = exports.style = _style_;
 var st = exports.st = _style_;
 var namespace = exports.namespace = _namespace_;
 var classes = exports.classes = {
-  "root": "Heading3722466155__root"
+  "root": "Heading1110286094__root"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/Heading/Heading.st.css.js.map

@@ -1 +1 @@
-{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/Heading/Heading.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"Heading3722466155\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"Heading3722466155__root\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,mBAAmB;AACrC,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAAK,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AACnB,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC;AAAyB,CAAC;AAChD,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/Heading/Heading.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"Heading1110286094\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"Heading1110286094__root\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport var vars = {}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,mBAAmB;AACrC,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAAK,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AACnB,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC;AAAyB,CAAC;AAChD,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG,CAAC,CAAC","ignoreList":[]}