@wix/patterns 1.176.0 → 1.178.0

package/dist/cjs/components/TabsFilter/TabsDropdown.js

@@ -25,7 +25,7 @@ function _TabsDropdown(props) {
     itemKey
   } = filter;
   const table = (0, _ToolbarCollectionContext.useToolbarCollectionContext)();
-  const container = _react.default.useRef();
+  const container = (0, _react.useRef)();
   const [state] = (0, _react.useState)(() => new _TabsFilterState.TabsFilterState({
     table
   }));

package/dist/cjs/components/TabsFilter/TabsDropdown.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_designSystem","_mobxReactLite","_ToolbarCollectionContext","_TabsFilterState","_TabTotal","_types","_SingleSelectFilterBase","_hooks","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_TabsDropdown","props","data","dataProp","items","filter","selectedId","itemKey","table","useToolbarCollectionContext","container","React","useRef","state","useState","TabsFilterState","useEffect","init","current","itemsCount","length","options","useMemo","map","item","listItemSelectBuilder","id","title","name","label","suffix","createElement","TabTotalDropdownOption","value","find","__self","__source","fileName","lineNumber","columnNumber","dropdownSelect","useDropdownSelectFilterState","Box","minWidth","maxWidth","paddingLeft","SingleSelectFilterBase","dataHook","disabled","onSelect","option","tab","values","ALL_TAB_ITEM_ID","refresh","Input","Affix","key","TabsDropdown","exports","observer"],"sources":["../../../../src/components/TabsFilter/TabsDropdown.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { Box, Input, listItemSelectBuilder } from '@wix/design-system';\nimport { Filter } from '@wix/bex-core';\nimport { observer } from 'mobx-react-lite';\nimport { useToolbarCollectionContext } from '../ToolbarCollectionContext';\nimport { TabsFilterState } from './TabsFilterState';\nimport { TabTotalDropdownOption } from '../TabTotal';\nimport { ALL_TAB_ITEM_ID, TabsFilterItem, TabsFilterItemBase } from './types';\nimport { SingleSelectFilterBase } from '../SingleSelectFilterBase';\nimport { useDropdownSelectFilterState } from '../../hooks';\n\nexport interface TabsFilterProps<V> {\n  items: TabsFilterItemBase[];\n  data: V[];\n  filter: Filter<V[]>;\n  selectedId: string;\n}\n\nfunction _TabsDropdown<V>(props: TabsFilterProps<V>) {\n  const { data: dataProp, items, filter, selectedId } = props;\n\n  const { itemKey } = filter;\n\n  const table = useToolbarCollectionContext();\n\n  const container = React.useRef<HTMLDivElement>();\n\n  const [state] = useState(\n    () =>\n      new TabsFilterState({\n        table,\n      }),\n  );\n\n  useEffect(\n    () =>\n      state.init({\n        container: container.current,\n        itemsCount: items.length,\n      }),\n    [],\n  );\n\n  const options = React.useMemo(\n    () =>\n      items.map((item) =>\n        listItemSelectBuilder({\n          id: item.id,\n          title: item.name,\n          label: item.name,\n          suffix: (\n            <TabTotalDropdownOption\n              value={dataProp.find((data) => itemKey(data) === item.id)}\n            />\n          ),\n        }),\n      ),\n    [items],\n  );\n\n  const { dropdownSelect, init } = useDropdownSelectFilterState<V>({\n    filter,\n  });\n\n  useEffect(() => init(), []);\n\n  return (\n    <Box minWidth={140} maxWidth={200} paddingLeft=\"SP4\">\n      <SingleSelectFilterBase\n        dataHook=\"tabs-dropdown\"\n        filter={filter}\n        dropdownSelect={dropdownSelect}\n        options={options}\n        disabled={!options.length}\n        selectedId={selectedId}\n        onSelect={(option) => {\n          const tab = items.find((item) => item.id === option.id);\n\n          if (tab) {\n            const values =\n              tab.id === ALL_TAB_ITEM_ID\n                ? []\n                : [(tab as TabsFilterItem<V>).value];\n\n            filter.refresh(values);\n          }\n        }}\n        suffix={\n          <Input.Affix>\n            <TabTotalDropdownOption\n              key={selectedId}\n              value={dataProp.find((value) => itemKey(value) === selectedId)}\n            />\n          </Input.Affix>\n        }\n      />\n    </Box>\n  );\n}\n\nexport const TabsDropdown = observer(_TabsDropdown);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_designSystem","_mobxReactLite","_ToolbarCollectionContext","_TabsFilterState","_TabTotal","_types","_SingleSelectFilterBase","_hooks","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_TabsDropdown","props","data","dataProp","items","filter","selectedId","itemKey","table","useToolbarCollectionContext","container","useRef","state","useState","TabsFilterState","useEffect","init","current","itemsCount","length","options","React","useMemo","map","item","listItemSelectBuilder","id","title","name","label","suffix","createElement","TabTotalDropdownOption","value","find","__self","__source","fileName","lineNumber","columnNumber","dropdownSelect","useDropdownSelectFilterState","Box","minWidth","maxWidth","paddingLeft","SingleSelectFilterBase","dataHook","disabled","onSelect","option","tab","values","ALL_TAB_ITEM_ID","refresh","Input","Affix","key","TabsDropdown","exports","observer"],"sources":["../../../../src/components/TabsFilter/TabsDropdown.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Box, Input, listItemSelectBuilder } from '@wix/design-system';\nimport { Filter } from '@wix/bex-core';\nimport { observer } from 'mobx-react-lite';\nimport { useToolbarCollectionContext } from '../ToolbarCollectionContext';\nimport { TabsFilterState } from './TabsFilterState';\nimport { TabTotalDropdownOption } from '../TabTotal';\nimport { ALL_TAB_ITEM_ID, TabsFilterItem, TabsFilterItemBase } from './types';\nimport { SingleSelectFilterBase } from '../SingleSelectFilterBase';\nimport { useDropdownSelectFilterState } from '../../hooks';\n\nexport interface TabsFilterProps<V> {\n  items: TabsFilterItemBase[];\n  data: V[];\n  filter: Filter<V[]>;\n  selectedId: string;\n}\n\nfunction _TabsDropdown<V>(props: TabsFilterProps<V>) {\n  const { data: dataProp, items, filter, selectedId } = props;\n\n  const { itemKey } = filter;\n\n  const table = useToolbarCollectionContext();\n\n  const container = useRef<HTMLDivElement>();\n\n  const [state] = useState(\n    () =>\n      new TabsFilterState({\n        table,\n      }),\n  );\n\n  useEffect(\n    () =>\n      state.init({\n        container: container.current,\n        itemsCount: items.length,\n      }),\n    [],\n  );\n\n  const options = React.useMemo(\n    () =>\n      items.map((item) =>\n        listItemSelectBuilder({\n          id: item.id,\n          title: item.name,\n          label: item.name,\n          suffix: (\n            <TabTotalDropdownOption\n              value={dataProp.find((data) => itemKey(data) === item.id)}\n            />\n          ),\n        }),\n      ),\n    [items],\n  );\n\n  const { dropdownSelect, init } = useDropdownSelectFilterState<V>({\n    filter,\n  });\n\n  useEffect(() => init(), []);\n\n  return (\n    <Box minWidth={140} maxWidth={200} paddingLeft=\"SP4\">\n      <SingleSelectFilterBase\n        dataHook=\"tabs-dropdown\"\n        filter={filter}\n        dropdownSelect={dropdownSelect}\n        options={options}\n        disabled={!options.length}\n        selectedId={selectedId}\n        onSelect={(option) => {\n          const tab = items.find((item) => item.id === option.id);\n\n          if (tab) {\n            const values =\n              tab.id === ALL_TAB_ITEM_ID\n                ? []\n                : [(tab as TabsFilterItem<V>).value];\n\n            filter.refresh(values);\n          }\n        }}\n        suffix={\n          <Input.Affix>\n            <TabTotalDropdownOption\n              key={selectedId}\n              value={dataProp.find((value) => itemKey(value) === selectedId)}\n            />\n          </Input.Affix>\n        }\n      />\n    </Box>\n  );\n}\n\nexport const TabsDropdown = observer(_TabsDropdown);\n"],"mappings":"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","ignoreList":[]}

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

@@ -5,15 +5,15 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
 // @ts-nocheck
 
-var _namespace_ = "TabsFilter4197575831";
+var _namespace_ = "TabsFilter1588113129";
 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": "TabsFilter4197575831__root",
-  "title": "TabsFilter4197575831__title"
+  "root": "TabsFilter1588113129__root",
+  "title": "TabsFilter1588113129__title"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/TabsFilter/TabsFilter.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/TabsFilter/TabsFilter.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"TabsFilter4197575831\";\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\":\"TabsFilter4197575831__root\",\"title\":\"TabsFilter4197575831__title\"};\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,sBAAsB;AACxC,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,4BAA4B;EAAC,OAAO,EAAC;AAA6B,CAAC;AACzF,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/TabsFilter/TabsFilter.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"TabsFilter1588113129\";\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\":\"TabsFilter1588113129__root\",\"title\":\"TabsFilter1588113129__title\"};\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,sBAAsB;AACxC,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,4BAA4B;EAAC,OAAO,EAAC;AAA6B,CAAC;AACzF,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":[]}

package/dist/cjs/components/TabsFilter/TabsResponsiveState.js

@@ -57,7 +57,7 @@ class TabsResponsiveState {
         this.mode = 'tabs';
       }
     }));
-    this.onResizeThrottled = params.container.lodash.throttle(() => requestAnimationFrame(this._onResize), 300);
+    this.onResizeThrottled = params.container.lodash.throttle(() => window.requestAnimationFrame(this._onResize), 300);
     (0, _mobx.makeObservable)(this, {
       mode: _mobx.observable.ref,
       panelMinWidth: _mobx.observable.ref

package/dist/cjs/components/TabsFilter/TabsResponsiveState.js.map

@@ -1 +1 @@
-{"version":3,"names":["_mobx","require","_bexCore","TabsResponsiveState","constructor","params","_defineProperty2","default","Map","action","container","process","env","NODE_ENV","nextPanelWidth","getPanelMinWidth","panelMinWidth","itemsMinWidths","getItemsMinWidth","clientWidth","mode","onResizeThrottled","lodash","throttle","requestAnimationFrame","_onResize","makeObservable","observable","ref","getBadgesWidth","Array","from","badges","values","reduce","sum","badge","itemBadgeMargin","itemTextMinWidth","length","itemsCount","map","_","index","get","maybeBadgeWidth","itemPadding","itemMinWidth","badgesWidth","init","disposer","addResizeObserver","exports"],"sources":["../../../../src/components/TabsFilter/TabsResponsiveState.ts"],"sourcesContent":["import { action, makeObservable, observable } from 'mobx';\nimport { addResizeObserver, WixPatternsContainer } from '@wix/bex-core';\n\nexport interface TabsResponsiveStateParams {\n  container: WixPatternsContainer;\n}\n\nexport class TabsResponsiveState {\n  container?: HTMLDivElement;\n  // We save the badges in a Map and not in an Array because the badge is optional\n  // on a per-tab basis, but we still need to know the index of each badge.\n  badges = new Map<number, HTMLSpanElement>();\n  mode: 'tabs' | 'dropdown' = 'tabs';\n\n  panelMinWidth = 0;\n  itemsCount = 0;\n  itemPadding = 32;\n  itemMaxWidth = 200;\n  itemTextMinWidth = 48;\n  itemBadgeMargin = 6;\n  itemsMinWidths: number[] = [];\n\n  readonly onResizeThrottled;\n\n  constructor(params: TabsResponsiveStateParams) {\n    this.onResizeThrottled = params.container.lodash.throttle(\n      () => requestAnimationFrame(this._onResize),\n      300,\n    );\n\n    makeObservable(this, {\n      mode: observable.ref,\n      panelMinWidth: observable.ref,\n    });\n  }\n\n  getBadgesWidth() {\n    return Array.from(this.badges.values()).reduce((sum, badge) => {\n      return sum + badge.clientWidth + this.itemBadgeMargin;\n    }, 0);\n  }\n\n  getItemsMinWidth() {\n    const { itemTextMinWidth, itemBadgeMargin } = this;\n\n    return Array.from<number>({ length: this.itemsCount }).map((_, index) => {\n      const badge = this.badges.get(index);\n      const maybeBadgeWidth = badge ? badge.clientWidth + itemBadgeMargin : 0;\n\n      return itemTextMinWidth + maybeBadgeWidth;\n    });\n  }\n\n  getPanelMinWidth() {\n    const { itemsCount, itemTextMinWidth, itemPadding } = this;\n\n    const itemMinWidth = itemTextMinWidth + itemPadding;\n    const badgesWidth = this.getBadgesWidth();\n\n    return itemsCount * itemMinWidth + badgesWidth;\n  }\n\n  _onResize = action(() => {\n    const { container } = this;\n\n    if (process.env.NODE_ENV === 'test') {\n      return;\n    }\n\n    if (!container) {\n      return;\n    }\n\n    const nextPanelWidth = this.getPanelMinWidth();\n\n    // If the measurements show 0, this means that not all elements have loaded yet,\n    // so we skip such events.\n    if (nextPanelWidth !== 0 && nextPanelWidth > this.panelMinWidth) {\n      this.itemsMinWidths = this.getItemsMinWidth();\n      this.panelMinWidth = nextPanelWidth;\n    }\n\n    // The \"container\" is a node that wraps both Tabs and Dropdown components (but only\n    // one of them is rendered). It expands for as much space as all its elements\n    // inside need and shrinks down to the smallest possible state of the elements inside.\n    // Basically max-width and min-width with complications.\n    //\n    // Complications here are badges — they don't shrink, only tabs titles shrink.\n    //\n    // The state is switched when the certain container width (aka panelMinWidth) is reached.\n    // It is defined as: itemsCount * (itemMinWidth + itemPadding) + all badges widths.\n    // Tabs is shown when the container width is more or equal than panelMinWidth.\n    // Dropdown is shown when the container width is less than panelMinWidth.\n    if (\n      this.panelMinWidth !== 0 &&\n      container.clientWidth < this.panelMinWidth\n    ) {\n      this.mode = 'dropdown';\n    } else {\n      this.mode = 'tabs';\n    }\n  });\n\n  init({\n    container,\n    itemsCount,\n  }: {\n    container?: HTMLDivElement;\n    itemsCount: number;\n  }) {\n    this.container = container;\n    this.itemsCount = itemsCount;\n\n    const disposer = addResizeObserver(container, this.onResizeThrottled);\n\n    this.onResizeThrottled();\n\n    return () => {\n      disposer?.();\n    };\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_mobx","require","_bexCore","TabsResponsiveState","constructor","params","_defineProperty2","default","Map","action","container","process","env","NODE_ENV","nextPanelWidth","getPanelMinWidth","panelMinWidth","itemsMinWidths","getItemsMinWidth","clientWidth","mode","onResizeThrottled","lodash","throttle","window","requestAnimationFrame","_onResize","makeObservable","observable","ref","getBadgesWidth","Array","from","badges","values","reduce","sum","badge","itemBadgeMargin","itemTextMinWidth","length","itemsCount","map","_","index","get","maybeBadgeWidth","itemPadding","itemMinWidth","badgesWidth","init","disposer","addResizeObserver","exports"],"sources":["../../../../src/components/TabsFilter/TabsResponsiveState.ts"],"sourcesContent":["import { action, makeObservable, observable } from 'mobx';\nimport { addResizeObserver, WixPatternsContainer } from '@wix/bex-core';\n\nexport interface TabsResponsiveStateParams {\n  container: WixPatternsContainer;\n}\n\nexport class TabsResponsiveState {\n  container?: HTMLDivElement;\n  // We save the badges in a Map and not in an Array because the badge is optional\n  // on a per-tab basis, but we still need to know the index of each badge.\n  badges = new Map<number, HTMLSpanElement>();\n  mode: 'tabs' | 'dropdown' = 'tabs';\n\n  panelMinWidth = 0;\n  itemsCount = 0;\n  itemPadding = 32;\n  itemMaxWidth = 200;\n  itemTextMinWidth = 48;\n  itemBadgeMargin = 6;\n  itemsMinWidths: number[] = [];\n\n  readonly onResizeThrottled;\n\n  constructor(params: TabsResponsiveStateParams) {\n    this.onResizeThrottled = params.container.lodash.throttle(\n      () => window.requestAnimationFrame(this._onResize),\n      300,\n    );\n\n    makeObservable(this, {\n      mode: observable.ref,\n      panelMinWidth: observable.ref,\n    });\n  }\n\n  getBadgesWidth() {\n    return Array.from(this.badges.values()).reduce((sum, badge) => {\n      return sum + badge.clientWidth + this.itemBadgeMargin;\n    }, 0);\n  }\n\n  getItemsMinWidth() {\n    const { itemTextMinWidth, itemBadgeMargin } = this;\n\n    return Array.from<number>({ length: this.itemsCount }).map((_, index) => {\n      const badge = this.badges.get(index);\n      const maybeBadgeWidth = badge ? badge.clientWidth + itemBadgeMargin : 0;\n\n      return itemTextMinWidth + maybeBadgeWidth;\n    });\n  }\n\n  getPanelMinWidth() {\n    const { itemsCount, itemTextMinWidth, itemPadding } = this;\n\n    const itemMinWidth = itemTextMinWidth + itemPadding;\n    const badgesWidth = this.getBadgesWidth();\n\n    return itemsCount * itemMinWidth + badgesWidth;\n  }\n\n  _onResize = action(() => {\n    const { container } = this;\n\n    if (process.env.NODE_ENV === 'test') {\n      return;\n    }\n\n    if (!container) {\n      return;\n    }\n\n    const nextPanelWidth = this.getPanelMinWidth();\n\n    // If the measurements show 0, this means that not all elements have loaded yet,\n    // so we skip such events.\n    if (nextPanelWidth !== 0 && nextPanelWidth > this.panelMinWidth) {\n      this.itemsMinWidths = this.getItemsMinWidth();\n      this.panelMinWidth = nextPanelWidth;\n    }\n\n    // The \"container\" is a node that wraps both Tabs and Dropdown components (but only\n    // one of them is rendered). It expands for as much space as all its elements\n    // inside need and shrinks down to the smallest possible state of the elements inside.\n    // Basically max-width and min-width with complications.\n    //\n    // Complications here are badges — they don't shrink, only tabs titles shrink.\n    //\n    // The state is switched when the certain container width (aka panelMinWidth) is reached.\n    // It is defined as: itemsCount * (itemMinWidth + itemPadding) + all badges widths.\n    // Tabs is shown when the container width is more or equal than panelMinWidth.\n    // Dropdown is shown when the container width is less than panelMinWidth.\n    if (\n      this.panelMinWidth !== 0 &&\n      container.clientWidth < this.panelMinWidth\n    ) {\n      this.mode = 'dropdown';\n    } else {\n      this.mode = 'tabs';\n    }\n  });\n\n  init({\n    container,\n    itemsCount,\n  }: {\n    container?: HTMLDivElement;\n    itemsCount: number;\n  }) {\n    this.container = container;\n    this.itemsCount = itemsCount;\n\n    const disposer = addResizeObserver(container, this.onResizeThrottled);\n\n    this.onResizeThrottled();\n\n    return () => {\n      disposer?.();\n    };\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/Tags/BulkAssignTagsPopover/EmptyState.js

@@ -5,7 +5,6 @@ exports.EmptyState = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _mobxReactLite = require("mobx-react-lite");
 var _designSystem = require("@wix/design-system");
-var _wixUiIconsCommon = require("@wix/wix-ui-icons-common");
 var _react2 = require("@wix/bex-core/react");
 var _CreateTagButton = require("./CreateTagButton");
 var _jsxFileName = "/home/builduser/work/db7ea24852bc3350/packages/cairo/dist/cjs/components/Tags/BulkAssignTagsPopover/EmptyState.tsx";
@@ -21,9 +20,39 @@ const _EmptyState = ({
     const value = e.target.value;
     state.handleSearchChange(value);
   }, [state.handleSearchChange]);
-  const retry = (0, _react.useCallback)(() => {
-    state.retry();
-  }, [state.retry]);
+  const renderErrorState = (0, _react.useCallback)(() => {
+    var _resolvedError$action, _resolvedError$action2, _resolvedError$action3;
+    const resolvedError = state.error;
+    return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+      height: "100%",
+      verticalAlign: "middle",
+      __self: void 0,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 34,
+        columnNumber: 7
+      }
+    }, /*#__PURE__*/_react.default.createElement(_designSystem.EmptyState, {
+      dataHook: "bulk-assign-tags-error-state",
+      theme: "page-no-border",
+      subtitle: resolvedError == null ? void 0 : resolvedError.message,
+      __self: void 0,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 35,
+        columnNumber: 9
+      }
+    }, (resolvedError == null || (_resolvedError$action = resolvedError.action) == null ? void 0 : _resolvedError$action.onClick) && /*#__PURE__*/_react.default.createElement(_designSystem.TextButton, {
+      dataHook: "bulk-assign-tags-error-state-retry-button",
+      onClick: resolvedError == null || (_resolvedError$action2 = resolvedError.action) == null ? void 0 : _resolvedError$action2.onClick,
+      __self: void 0,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 41,
+        columnNumber: 13
+      }
+    }, resolvedError == null || (_resolvedError$action3 = resolvedError.action) == null ? void 0 : _resolvedError$action3.text)));
+  }, [state.error]);
   return /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
     direction: "vertical",
     boxSizing: "border-box",
@@ -31,7 +60,7 @@ const _EmptyState = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 37,
+      lineNumber: 54,
       columnNumber: 5
     }
   }, state.isInEmptyState && /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
@@ -40,14 +69,14 @@ const _EmptyState = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 39,
+      lineNumber: 56,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 40,
+      lineNumber: 57,
       columnNumber: 11
     }
   }, /*#__PURE__*/_react.default.createElement(_designSystem.Search, {
@@ -57,7 +86,7 @@ const _EmptyState = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 41,
+      lineNumber: 58,
       columnNumber: 13
     }
   })), !!state.searchValue && /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
@@ -65,7 +94,7 @@ const _EmptyState = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 50,
+      lineNumber: 67,
       columnNumber: 13
     }
   }, /*#__PURE__*/_react.default.createElement(_CreateTagButton.CreateTagButton, {
@@ -74,53 +103,17 @@ const _EmptyState = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 51,
+      lineNumber: 68,
       columnNumber: 15
     }
-  }))), state.isError && /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
-    height: "100%",
-    verticalAlign: "middle",
-    __self: void 0,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 57,
-      columnNumber: 9
-    }
-  }, /*#__PURE__*/_react.default.createElement(_designSystem.EmptyState, {
-    dataHook: "bulk-assign-tags-error-state",
-    theme: "page-no-border",
-    subtitle: t('cairo.tags.collectionPage.popover.loadTags.error.body'),
-    __self: void 0,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 58,
-      columnNumber: 11
-    }
-  }, /*#__PURE__*/_react.default.createElement(_designSystem.TextButton, {
-    dataHook: "bulk-assign-tags-error-state-retry-button",
-    prefixIcon: /*#__PURE__*/_react.default.createElement(_wixUiIconsCommon.Refresh, {
-      __self: void 0,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 67,
-        columnNumber: 27
-      }
-    }),
-    onClick: retry,
-    __self: void 0,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 65,
-      columnNumber: 13
-    }
-  }, t('cairo.tags.loadTags.error.CTA')))), state.isInEmptyState && !state.searchValue && /*#__PURE__*/_react.default.createElement(_designSystem.EmptyState, {
+  }))), state.isError && renderErrorState(), state.isInEmptyState && !state.searchValue && /*#__PURE__*/_react.default.createElement(_designSystem.EmptyState, {
     dataHook: "bulk-assign-tags-empty-state",
     theme: "page-no-border",
     subtitle: t('cairo.tags.collectionPage.popover.emptyState.body'),
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 76,
+      lineNumber: 75,
       columnNumber: 9
     }
   }));

package/dist/cjs/components/Tags/BulkAssignTagsPopover/EmptyState.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_mobxReactLite","_designSystem","_wixUiIconsCommon","_react2","_CreateTagButton","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_EmptyState","state","translate","useWixPatternsContainer","handleEmptyStateSearchChange","useCallback","value","target","handleSearchChange","retry","createElement","Box","direction","boxSizing","height","__self","__source","fileName","lineNumber","columnNumber","isInEmptyState","padding","Search","dataHook","placeholder","onChange","searchValue","marginTop","CreateTagButton","isError","verticalAlign","EmptyState","theme","subtitle","TextButton","prefixIcon","Refresh","onClick","exports","observer"],"sources":["../../../../../src/components/Tags/BulkAssignTagsPopover/EmptyState.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport { observer } from 'mobx-react-lite';\nimport {\n  Box,\n  Search,\n  TextButton,\n  EmptyState as WSREmptyState,\n} from '@wix/design-system';\nimport { Refresh as RefreshIcon } from '@wix/wix-ui-icons-common';\nimport { useWixPatternsContainer } from '@wix/bex-core/react';\nimport { TagsBulkAssignPopoverState } from '../../../state/TagsBulkAssignPopoverState';\nimport { CreateTagButton } from './CreateTagButton';\nimport { FiltersMap } from '@wix/bex-core';\n\ninterface EmptyStateProps<T, F extends FiltersMap> {\n  state: TagsBulkAssignPopoverState<T, F>;\n}\n\nconst _EmptyState = <T, F extends FiltersMap>({\n  state,\n}: EmptyStateProps<T, F>) => {\n  const { translate: t } = useWixPatternsContainer();\n\n  const handleEmptyStateSearchChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const value = e.target.value;\n      state.handleSearchChange(value);\n    },\n    [state.handleSearchChange],\n  );\n\n  const retry = useCallback(() => {\n    state.retry();\n  }, [state.retry]);\n\n  return (\n    <Box direction=\"vertical\" boxSizing=\"border-box\" height=\"100%\">\n      {state.isInEmptyState && (\n        <Box direction=\"vertical\" padding=\"SP5 SP5 0\">\n          <Box>\n            <Search\n              dataHook=\"bulk-assign-tags-empty-state-search\"\n              placeholder={t(\n                'cairo.tags.collectionPage.popover.emptyState.search.placeholder',\n              )}\n              onChange={handleEmptyStateSearchChange}\n            ></Search>\n          </Box>\n          {!!state.searchValue && (\n            <Box marginTop=\"SP4\">\n              <CreateTagButton state={state} searchValue={state.searchValue} />\n            </Box>\n          )}\n        </Box>\n      )}\n      {state.isError && (\n        <Box height=\"100%\" verticalAlign=\"middle\">\n          <WSREmptyState\n            dataHook=\"bulk-assign-tags-error-state\"\n            theme=\"page-no-border\"\n            subtitle={t(\n              'cairo.tags.collectionPage.popover.loadTags.error.body',\n            )}\n          >\n            <TextButton\n              dataHook=\"bulk-assign-tags-error-state-retry-button\"\n              prefixIcon={<RefreshIcon />}\n              onClick={retry}\n            >\n              {t('cairo.tags.loadTags.error.CTA')}\n            </TextButton>\n          </WSREmptyState>\n        </Box>\n      )}\n      {state.isInEmptyState && !state.searchValue && (\n        <WSREmptyState\n          dataHook=\"bulk-assign-tags-empty-state\"\n          theme=\"page-no-border\"\n          subtitle={t('cairo.tags.collectionPage.popover.emptyState.body')}\n        />\n      )}\n    </Box>\n  );\n};\n\nexport const EmptyState = observer(_EmptyState);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_mobxReactLite","_designSystem","_react2","_CreateTagButton","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_EmptyState","state","translate","useWixPatternsContainer","handleEmptyStateSearchChange","useCallback","value","target","handleSearchChange","renderErrorState","_resolvedError$action","_resolvedError$action2","_resolvedError$action3","resolvedError","error","createElement","Box","height","verticalAlign","__self","__source","fileName","lineNumber","columnNumber","EmptyState","dataHook","theme","subtitle","message","action","onClick","TextButton","text","direction","boxSizing","isInEmptyState","padding","Search","placeholder","onChange","searchValue","marginTop","CreateTagButton","isError","exports","observer"],"sources":["../../../../../src/components/Tags/BulkAssignTagsPopover/EmptyState.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport { observer } from 'mobx-react-lite';\nimport {\n  Box,\n  Search,\n  TextButton,\n  EmptyState as WSREmptyState,\n} from '@wix/design-system';\nimport { useWixPatternsContainer } from '@wix/bex-core/react';\nimport { TagsBulkAssignPopoverState } from '../../../state/TagsBulkAssignPopoverState';\nimport { CreateTagButton } from './CreateTagButton';\nimport { FiltersMap } from '@wix/bex-core';\n\ninterface EmptyStateProps<T, F extends FiltersMap> {\n  state: TagsBulkAssignPopoverState<T, F>;\n}\n\nconst _EmptyState = <T, F extends FiltersMap>({\n  state,\n}: EmptyStateProps<T, F>) => {\n  const { translate: t } = useWixPatternsContainer();\n\n  const handleEmptyStateSearchChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const value = e.target.value;\n      state.handleSearchChange(value);\n    },\n    [state.handleSearchChange],\n  );\n\n  const renderErrorState = useCallback(() => {\n    const resolvedError = state.error;\n    return (\n      <Box height=\"100%\" verticalAlign=\"middle\">\n        <WSREmptyState\n          dataHook=\"bulk-assign-tags-error-state\"\n          theme=\"page-no-border\"\n          subtitle={resolvedError?.message}\n        >\n          {resolvedError?.action?.onClick && (\n            <TextButton\n              dataHook=\"bulk-assign-tags-error-state-retry-button\"\n              onClick={resolvedError?.action?.onClick}\n            >\n              {resolvedError?.action?.text}\n            </TextButton>\n          )}\n        </WSREmptyState>\n      </Box>\n    );\n  }, [state.error]);\n\n  return (\n    <Box direction=\"vertical\" boxSizing=\"border-box\" height=\"100%\">\n      {state.isInEmptyState && (\n        <Box direction=\"vertical\" padding=\"SP5 SP5 0\">\n          <Box>\n            <Search\n              dataHook=\"bulk-assign-tags-empty-state-search\"\n              placeholder={t(\n                'cairo.tags.collectionPage.popover.emptyState.search.placeholder',\n              )}\n              onChange={handleEmptyStateSearchChange}\n            ></Search>\n          </Box>\n          {!!state.searchValue && (\n            <Box marginTop=\"SP4\">\n              <CreateTagButton state={state} searchValue={state.searchValue} />\n            </Box>\n          )}\n        </Box>\n      )}\n      {state.isError && renderErrorState()}\n      {state.isInEmptyState && !state.searchValue && (\n        <WSREmptyState\n          dataHook=\"bulk-assign-tags-empty-state\"\n          theme=\"page-no-border\"\n          subtitle={t('cairo.tags.collectionPage.popover.emptyState.body')}\n        />\n      )}\n    </Box>\n  );\n};\n\nexport const EmptyState = observer(_EmptyState);\n"],"mappings":";;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,cAAA,GAAAD,OAAA;AACA,IAAAE,aAAA,GAAAF,OAAA;AAMA,IAAAG,OAAA,GAAAH,OAAA;AAEA,IAAAI,gBAAA,GAAAJ,OAAA;AAAoD,IAAAK,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,SAAAR,wBAAAQ,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;AAOpD,MAAMW,WAAW,GAAGA,CAA0B;EAC5CC;AACqB,CAAC,KAAK;EAC3B,MAAM;IAAEC,SAAS,EAAElB;EAAE,CAAC,GAAG,IAAAmB,+BAAuB,EAAC,CAAC;EAElD,MAAMC,4BAA4B,GAAG,IAAAC,kBAAW,EAC7CxB,CAAsC,IAAK;IAC1C,MAAMyB,KAAK,GAAGzB,CAAC,CAAC0B,MAAM,CAACD,KAAK;IAC5BL,KAAK,CAACO,kBAAkB,CAACF,KAAK,CAAC;EACjC,CAAC,EACD,CAACL,KAAK,CAACO,kBAAkB,CAC3B,CAAC;EAED,MAAMC,gBAAgB,GAAG,IAAAJ,kBAAW,EAAC,MAAM;IAAA,IAAAK,qBAAA,EAAAC,sBAAA,EAAAC,sBAAA;IACzC,MAAMC,aAAa,GAAGZ,KAAK,CAACa,KAAK;IACjC,oBACE1C,MAAA,CAAAc,OAAA,CAAA6B,aAAA,CAACvC,aAAA,CAAAwC,GAAG;MAACC,MAAM,EAAC,MAAM;MAACC,aAAa,EAAC,QAAQ;MAAAC,MAAA;MAAAC,QAAA;QAAAC,QAAA,EAAA1C,YAAA;QAAA2C,UAAA;QAAAC,YAAA;MAAA;IAAA,gBACvCnD,MAAA,CAAAc,OAAA,CAAA6B,aAAA,CAACvC,aAAA,CAAAgD,UAAa;MACZC,QAAQ,EAAC,8BAA8B;MACvCC,KAAK,EAAC,gBAAgB;MACtBC,QAAQ,EAAEd,aAAa,oBAAbA,aAAa,CAAEe,OAAQ;MAAAT,MAAA;MAAAC,QAAA;QAAAC,QAAA,EAAA1C,YAAA;QAAA2C,UAAA;QAAAC,YAAA;MAAA;IAAA,GAEhC,CAAAV,aAAa,aAAAH,qBAAA,GAAbG,aAAa,CAAEgB,MAAM,qBAArBnB,qBAAA,CAAuBoB,OAAO,kBAC7B1D,MAAA,CAAAc,OAAA,CAAA6B,aAAA,CAACvC,aAAA,CAAAuD,UAAU;MACTN,QAAQ,EAAC,2CAA2C;MACpDK,OAAO,EAAEjB,aAAa,aAAAF,sBAAA,GAAbE,aAAa,CAAEgB,MAAM,qBAArBlB,sBAAA,CAAuBmB,OAAQ;MAAAX,MAAA;MAAAC,QAAA;QAAAC,QAAA,EAAA1C,YAAA;QAAA2C,UAAA;QAAAC,YAAA;MAAA;IAAA,GAEvCV,aAAa,aAAAD,sBAAA,GAAbC,aAAa,CAAEgB,MAAM,qBAArBjB,sBAAA,CAAuBoB,IACd,CAED,CACZ,CAAC;EAEV,CAAC,EAAE,CAAC/B,KAAK,CAACa,KAAK,CAAC,CAAC;EAEjB,oBACE1C,MAAA,CAAAc,OAAA,CAAA6B,aAAA,CAACvC,aAAA,CAAAwC,GAAG;IAACiB,SAAS,EAAC,UAAU;IAACC,SAAS,EAAC,YAAY;IAACjB,MAAM,EAAC,MAAM;IAAAE,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA1C,YAAA;MAAA2C,UAAA;MAAAC,YAAA;IAAA;EAAA,GAC3DtB,KAAK,CAACkC,cAAc,iBACnB/D,MAAA,CAAAc,OAAA,CAAA6B,aAAA,CAACvC,aAAA,CAAAwC,GAAG;IAACiB,SAAS,EAAC,UAAU;IAACG,OAAO,EAAC,WAAW;IAAAjB,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA1C,YAAA;MAAA2C,UAAA;MAAAC,YAAA;IAAA;EAAA,gBAC3CnD,MAAA,CAAAc,OAAA,CAAA6B,aAAA,CAACvC,aAAA,CAAAwC,GAAG;IAAAG,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA1C,YAAA;MAAA2C,UAAA;MAAAC,YAAA;IAAA;EAAA,gBACFnD,MAAA,CAAAc,OAAA,CAAA6B,aAAA,CAACvC,aAAA,CAAA6D,MAAM;IACLZ,QAAQ,EAAC,qCAAqC;IAC9Ca,WAAW,EAAEtD,CAAC,CACZ,iEACF,CAAE;IACFuD,QAAQ,EAAEnC,4BAA6B;IAAAe,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA1C,YAAA;MAAA2C,UAAA;MAAAC,YAAA;IAAA;EAAA,CAChC,CACN,CAAC,EACL,CAAC,CAACtB,KAAK,CAACuC,WAAW,iBAClBpE,MAAA,CAAAc,OAAA,CAAA6B,aAAA,CAACvC,aAAA,CAAAwC,GAAG;IAACyB,SAAS,EAAC,KAAK;IAAAtB,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA1C,YAAA;MAAA2C,UAAA;MAAAC,YAAA;IAAA;EAAA,gBAClBnD,MAAA,CAAAc,OAAA,CAAA6B,aAAA,CAACrC,gBAAA,CAAAgE,eAAe;IAACzC,KAAK,EAAEA,KAAM;IAACuC,WAAW,EAAEvC,KAAK,CAACuC,WAAY;IAAArB,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA1C,YAAA;MAAA2C,UAAA;MAAAC,YAAA;IAAA;EAAA,CAAE,CAC7D,CAEJ,CACN,EACAtB,KAAK,CAAC0C,OAAO,IAAIlC,gBAAgB,CAAC,CAAC,EACnCR,KAAK,CAACkC,cAAc,IAAI,CAAClC,KAAK,CAACuC,WAAW,iBACzCpE,MAAA,CAAAc,OAAA,CAAA6B,aAAA,CAACvC,aAAA,CAAAgD,UAAa;IACZC,QAAQ,EAAC,8BAA8B;IACvCC,KAAK,EAAC,gBAAgB;IACtBC,QAAQ,EAAE3C,CAAC,CAAC,mDAAmD,CAAE;IAAAmC,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA1C,YAAA;MAAA2C,UAAA;MAAAC,YAAA;IAAA;EAAA,CAClE,CAEA,CAAC;AAEV,CAAC;AAEM,MAAMC,UAAU,GAAAoB,OAAA,CAAApB,UAAA,GAAG,IAAAqB,uBAAQ,EAAC7C,WAAW,CAAC","ignoreList":[]}

package/dist/cjs/components/Tags/ManageTags/ManageTagsModal/ManageTagsModal.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_ = "ManageTagsModal301310005";
+var _namespace_ = "ManageTagsModal116169156";
 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": "ManageTagsModal301310005__root"
+  "root": "ManageTagsModal116169156__root"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/Tags/ManageTags/ManageTagsModal/ManageTagsModal.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/Tags/ManageTags/ManageTagsModal/ManageTagsModal.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"ManageTagsModal301310005\";\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\":\"ManageTagsModal301310005__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,0BAA0B;AAC5C,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;AAAgC,CAAC;AACvD,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/Tags/ManageTags/ManageTagsModal/ManageTagsModal.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"ManageTagsModal116169156\";\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\":\"ManageTagsModal116169156__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,0BAA0B;AAC5C,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;AAAgC,CAAC;AACvD,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":[]}

package/dist/cjs/components/TagsFilter/tagsFilterBuilder.js

@@ -8,8 +8,10 @@ var _TagsFilter = require("./TagsFilter");
 var _react = _interopRequireDefault(require("react"));
 var _jsxFileName = "/home/builduser/work/db7ea24852bc3350/packages/cairo/dist/cjs/components/TagsFilter/tagsFilterBuilder.tsx";
 const buildTagsFilterElement = state => {
+  var _state$collection$fil;
   const label = state.container.translate('cairo.tags.filterPanel.dropdown.title');
   return /*#__PURE__*/_react.default.createElement(_TagsFilter.TagsFilter, {
+    key: (_state$collection$fil = state.collection.filters.tags) == null ? void 0 : _state$collection$fil.name,
     filter: state.collection.filters.tags,
     accordionItemProps: {
       label

package/dist/cjs/components/TagsFilter/tagsFilterBuilder.js.map

@@ -1 +1 @@
-{"version":3,"names":["_useSelector","require","_TagsFilter","_react","_interopRequireDefault","_jsxFileName","buildTagsFilterElement","state","label","container","translate","default","createElement","TagsFilter","filter","collection","filters","tags","accordionItemProps","toolbarItemProps","__self","__source","fileName","lineNumber","columnNumber","exports","useTagsFilter","useSelector","toolbar","buildTagsFilterWrapper","buildTagsFilter","extractTagsFilter","key","tagsFilterValue","length","tagIds","map","tag","id"],"sources":["../../../../src/components/TagsFilter/tagsFilterBuilder.tsx"],"sourcesContent":["import { FiltersMap, RawFilters } from '@wix/bex-core';\nimport { TableState, ToolbarCollectionState } from '../../state';\nimport { Tag } from '@wix/bex-utils/@wix/ambassador-os-tags-v1-tag/types';\nimport { useSelector } from '../../useSelector';\nimport { TagsFilter } from './TagsFilter';\nimport React from 'react';\n\nexport const buildTagsFilterElement = <T, F extends FiltersMap>(\n  state: ToolbarCollectionState<T, F>,\n) => {\n  const label = state.container.translate(\n    'cairo.tags.filterPanel.dropdown.title',\n  );\n\n  return (\n    <TagsFilter\n      filter={state.collection.filters.tags!}\n      accordionItemProps={{\n        label,\n      }}\n      toolbarItemProps={{\n        label,\n      }}\n    />\n  );\n};\n\nexport const useTagsFilter = <T, F extends FiltersMap>(\n  state: TableState<T, F>,\n) => {\n  useSelector(() => state.toolbar.collection.filters.tags);\n\n  const buildTagsFilterWrapper = () => {\n    return buildTagsFilterElement(state.toolbar);\n  };\n\n  return { buildTagsFilter: buildTagsFilterWrapper };\n};\n\nexport const extractTagsFilter = <F extends FiltersMap>(\n  filters: RawFilters<F>,\n  key: string = 'tags.privateTags.tagIds',\n) => {\n  const tagsFilterValue = filters.tags as Tag[] | undefined;\n  if (!tagsFilterValue?.length) {\n    return {};\n  }\n\n  const tagIds = tagsFilterValue.map((tag) => tag.id);\n\n  return { [key]: tagIds };\n};\n"],"mappings":";;;;;AAGA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAC,sBAAA,CAAAH,OAAA;AAA0B,IAAAI,YAAA;AAEnB,MAAMC,sBAAsB,GACjCC,KAAmC,IAChC;EACH,MAAMC,KAAK,GAAGD,KAAK,CAACE,SAAS,CAACC,SAAS,CACrC,uCACF,CAAC;EAED,oBACEP,MAAA,CAAAQ,OAAA,CAAAC,aAAA,CAACV,WAAA,CAAAW,UAAU;IACTC,MAAM,EAAEP,KAAK,CAACQ,UAAU,CAACC,OAAO,CAACC,IAAM;IACvCC,kBAAkB,EAAE;MAClBV;IACF,CAAE;IACFW,gBAAgB,EAAE;MAChBX;IACF,CAAE;IAAAY,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAjB,YAAA;MAAAkB,UAAA;MAAAC,YAAA;IAAA;EAAA,CACH,CAAC;AAEN,CAAC;AAACC,OAAA,CAAAnB,sBAAA,GAAAA,sBAAA;AAEK,MAAMoB,aAAa,GACxBnB,KAAuB,IACpB;EACH,IAAAoB,wBAAW,EAAC,MAAMpB,KAAK,CAACqB,OAAO,CAACb,UAAU,CAACC,OAAO,CAACC,IAAI,CAAC;EAExD,MAAMY,sBAAsB,GAAGA,CAAA,KAAM;IACnC,OAAOvB,sBAAsB,CAACC,KAAK,CAACqB,OAAO,CAAC;EAC9C,CAAC;EAED,OAAO;IAAEE,eAAe,EAAED;EAAuB,CAAC;AACpD,CAAC;AAACJ,OAAA,CAAAC,aAAA,GAAAA,aAAA;AAEK,MAAMK,iBAAiB,GAAGA,CAC/Bf,OAAsB,EACtBgB,GAAW,GAAG,yBAAyB,KACpC;EACH,MAAMC,eAAe,GAAGjB,OAAO,CAACC,IAAyB;EACzD,IAAI,EAACgB,eAAe,YAAfA,eAAe,CAAEC,MAAM,GAAE;IAC5B,OAAO,CAAC,CAAC;EACX;EAEA,MAAMC,MAAM,GAAGF,eAAe,CAACG,GAAG,CAAEC,GAAG,IAAKA,GAAG,CAACC,EAAE,CAAC;EAEnD,OAAO;IAAE,CAACN,GAAG,GAAGG;EAAO,CAAC;AAC1B,CAAC;AAACV,OAAA,CAAAM,iBAAA,GAAAA,iBAAA","ignoreList":[]}
+{"version":3,"names":["_useSelector","require","_TagsFilter","_react","_interopRequireDefault","_jsxFileName","buildTagsFilterElement","state","_state$collection$fil","label","container","translate","default","createElement","TagsFilter","key","collection","filters","tags","name","filter","accordionItemProps","toolbarItemProps","__self","__source","fileName","lineNumber","columnNumber","exports","useTagsFilter","useSelector","toolbar","buildTagsFilterWrapper","buildTagsFilter","extractTagsFilter","tagsFilterValue","length","tagIds","map","tag","id"],"sources":["../../../../src/components/TagsFilter/tagsFilterBuilder.tsx"],"sourcesContent":["import { FiltersMap, RawFilters } from '@wix/bex-core';\nimport { TableState, ToolbarCollectionState } from '../../state';\nimport { Tag } from '@wix/bex-utils/@wix/ambassador-os-tags-v1-tag/types';\nimport { useSelector } from '../../useSelector';\nimport { TagsFilter } from './TagsFilter';\nimport React from 'react';\n\nexport const buildTagsFilterElement = <T, F extends FiltersMap>(\n  state: ToolbarCollectionState<T, F>,\n) => {\n  const label = state.container.translate(\n    'cairo.tags.filterPanel.dropdown.title',\n  );\n\n  return (\n    <TagsFilter\n      key={state.collection.filters.tags?.name}\n      filter={state.collection.filters.tags!}\n      accordionItemProps={{\n        label,\n      }}\n      toolbarItemProps={{\n        label,\n      }}\n    />\n  );\n};\n\nexport const useTagsFilter = <T, F extends FiltersMap>(\n  state: TableState<T, F>,\n) => {\n  useSelector(() => state.toolbar.collection.filters.tags);\n\n  const buildTagsFilterWrapper = () => {\n    return buildTagsFilterElement(state.toolbar);\n  };\n\n  return { buildTagsFilter: buildTagsFilterWrapper };\n};\n\nexport const extractTagsFilter = <F extends FiltersMap>(\n  filters: RawFilters<F>,\n  key: string = 'tags.privateTags.tagIds',\n) => {\n  const tagsFilterValue = filters.tags as Tag[] | undefined;\n  if (!tagsFilterValue?.length) {\n    return {};\n  }\n\n  const tagIds = tagsFilterValue.map((tag) => tag.id);\n\n  return { [key]: tagIds };\n};\n"],"mappings":";;;;;AAGA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAC,sBAAA,CAAAH,OAAA;AAA0B,IAAAI,YAAA;AAEnB,MAAMC,sBAAsB,GACjCC,KAAmC,IAChC;EAAA,IAAAC,qBAAA;EACH,MAAMC,KAAK,GAAGF,KAAK,CAACG,SAAS,CAACC,SAAS,CACrC,uCACF,CAAC;EAED,oBACER,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACX,WAAA,CAAAY,UAAU;IACTC,GAAG,GAAAP,qBAAA,GAAED,KAAK,CAACS,UAAU,CAACC,OAAO,CAACC,IAAI,qBAA7BV,qBAAA,CAA+BW,IAAK;IACzCC,MAAM,EAAEb,KAAK,CAACS,UAAU,CAACC,OAAO,CAACC,IAAM;IACvCG,kBAAkB,EAAE;MAClBZ;IACF,CAAE;IACFa,gBAAgB,EAAE;MAChBb;IACF,CAAE;IAAAc,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAApB,YAAA;MAAAqB,UAAA;MAAAC,YAAA;IAAA;EAAA,CACH,CAAC;AAEN,CAAC;AAACC,OAAA,CAAAtB,sBAAA,GAAAA,sBAAA;AAEK,MAAMuB,aAAa,GACxBtB,KAAuB,IACpB;EACH,IAAAuB,wBAAW,EAAC,MAAMvB,KAAK,CAACwB,OAAO,CAACf,UAAU,CAACC,OAAO,CAACC,IAAI,CAAC;EAExD,MAAMc,sBAAsB,GAAGA,CAAA,KAAM;IACnC,OAAO1B,sBAAsB,CAACC,KAAK,CAACwB,OAAO,CAAC;EAC9C,CAAC;EAED,OAAO;IAAEE,eAAe,EAAED;EAAuB,CAAC;AACpD,CAAC;AAACJ,OAAA,CAAAC,aAAA,GAAAA,aAAA;AAEK,MAAMK,iBAAiB,GAAGA,CAC/BjB,OAAsB,EACtBF,GAAW,GAAG,yBAAyB,KACpC;EACH,MAAMoB,eAAe,GAAGlB,OAAO,CAACC,IAAyB;EACzD,IAAI,EAACiB,eAAe,YAAfA,eAAe,CAAEC,MAAM,GAAE;IAC5B,OAAO,CAAC,CAAC;EACX;EAEA,MAAMC,MAAM,GAAGF,eAAe,CAACG,GAAG,CAAEC,GAAG,IAAKA,GAAG,CAACC,EAAE,CAAC;EAEnD,OAAO;IAAE,CAACzB,GAAG,GAAGsB;EAAO,CAAC;AAC1B,CAAC;AAACT,OAAA,CAAAM,iBAAA,GAAAA,iBAAA","ignoreList":[]}

package/dist/cjs/components/ToolbarCollectionContentAutoSizer/ToolbarCollectionContentAutoSizer.js

@@ -16,7 +16,7 @@ function _ToolbarCollectionContentAutoSizer(props) {
   const {
     scrollableContentRef
   } = (0, _providers.useScrollableContentContext)();
-  const internalScrollableContentRef = (0, _react.useRef)();
+  const internalScrollableContentRef = (0, _react.useRef)(null);
   const [scrollableContentContextValue] = (0, _react.useState)(() => ({
     scrollableContentRef: internalScrollableContentRef
   }));

package/dist/cjs/components/ToolbarCollectionContentAutoSizer/ToolbarCollectionContentAutoSizer.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_ToolbarCollectionContext","_mobxReactLite","_providers","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_ToolbarCollectionContentAutoSizer","props","children","scrollableContentRef","useScrollableContentContext","internalScrollableContentRef","useRef","scrollableContentContextValue","useState","toolbar","useToolbarCollectionContext","internalScroll","collection","useEffect","itemsContentRect","init","scrollElement","current","child","createElement","style","height","width","overflowY","undefined","overflowAnchor","ref","el","element","scrollableContent","__self","__source","fileName","lineNumber","columnNumber","ScrollableContentContext","Provider","value","ToolbarCollectionContentAutoSizer","exports","observer"],"sources":["../../../../src/components/ToolbarCollectionContentAutoSizer/ToolbarCollectionContentAutoSizer.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useRef, useState } from 'react';\nimport { useToolbarCollectionContext } from '../ToolbarCollectionContext';\nimport { observer } from 'mobx-react-lite';\nimport {\n  ScrollableContentContext,\n  useScrollableContentContext,\n} from '../../providers';\n\nexport interface ToolbarCollectionContentAutoSizerProps {\n  children: ReactNode;\n}\n\nfunction _ToolbarCollectionContentAutoSizer(\n  props: ToolbarCollectionContentAutoSizerProps,\n) {\n  const { children } = props;\n  const { scrollableContentRef } = useScrollableContentContext();\n  const internalScrollableContentRef = useRef<HTMLElement | null | undefined>();\n\n  const [scrollableContentContextValue] = useState(() => ({\n    scrollableContentRef: internalScrollableContentRef,\n  }));\n\n  const toolbar = useToolbarCollectionContext();\n  const { internalScroll, collection } = toolbar;\n\n  useEffect(() => {\n    return toolbar.itemsContentRect.init({\n      scrollElement: scrollableContentRef.current,\n    });\n  }, []);\n\n  let child = (\n    <div\n      data-hook=\"toolbar-collection-content-auto-sizer\"\n      style={{\n        height: '100%',\n        width: '100%',\n        overflowY: internalScroll ? 'auto' : undefined,\n        overflowAnchor: 'none',\n      }}\n      ref={(el) => {\n        toolbar.itemsContentRect.element = el;\n        if (internalScroll) {\n          internalScrollableContentRef.current = el;\n          collection.scrollableContent = el;\n        }\n      }}\n    >\n      {children}\n    </div>\n  );\n\n  if (internalScroll) {\n    child = (\n      <ScrollableContentContext.Provider value={scrollableContentContextValue}>\n        {child}\n      </ScrollableContentContext.Provider>\n    );\n  }\n\n  return child;\n}\n\nexport const ToolbarCollectionContentAutoSizer = observer(\n  _ToolbarCollectionContentAutoSizer,\n);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_ToolbarCollectionContext","_mobxReactLite","_providers","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_ToolbarCollectionContentAutoSizer","props","children","scrollableContentRef","useScrollableContentContext","internalScrollableContentRef","useRef","scrollableContentContextValue","useState","toolbar","useToolbarCollectionContext","internalScroll","collection","useEffect","itemsContentRect","init","scrollElement","current","child","createElement","style","height","width","overflowY","undefined","overflowAnchor","ref","el","element","scrollableContent","__self","__source","fileName","lineNumber","columnNumber","ScrollableContentContext","Provider","value","ToolbarCollectionContentAutoSizer","exports","observer"],"sources":["../../../../src/components/ToolbarCollectionContentAutoSizer/ToolbarCollectionContentAutoSizer.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useRef, useState } from 'react';\nimport { useToolbarCollectionContext } from '../ToolbarCollectionContext';\nimport { observer } from 'mobx-react-lite';\nimport {\n  ScrollableContentContext,\n  useScrollableContentContext,\n} from '../../providers';\n\nexport interface ToolbarCollectionContentAutoSizerProps {\n  children: ReactNode;\n}\n\nfunction _ToolbarCollectionContentAutoSizer(\n  props: ToolbarCollectionContentAutoSizerProps,\n) {\n  const { children } = props;\n  const { scrollableContentRef } = useScrollableContentContext();\n  const internalScrollableContentRef = useRef<HTMLElement | null>(null);\n\n  const [scrollableContentContextValue] = useState(() => ({\n    scrollableContentRef: internalScrollableContentRef,\n  }));\n\n  const toolbar = useToolbarCollectionContext();\n  const { internalScroll, collection } = toolbar;\n\n  useEffect(() => {\n    return toolbar.itemsContentRect.init({\n      scrollElement: scrollableContentRef.current,\n    });\n  }, []);\n\n  let child = (\n    <div\n      data-hook=\"toolbar-collection-content-auto-sizer\"\n      style={{\n        height: '100%',\n        width: '100%',\n        overflowY: internalScroll ? 'auto' : undefined,\n        overflowAnchor: 'none',\n      }}\n      ref={(el) => {\n        toolbar.itemsContentRect.element = el;\n        if (internalScroll) {\n          internalScrollableContentRef.current = el;\n          collection.scrollableContent = el;\n        }\n      }}\n    >\n      {children}\n    </div>\n  );\n\n  if (internalScroll) {\n    child = (\n      <ScrollableContentContext.Provider value={scrollableContentContextValue}>\n        {child}\n      </ScrollableContentContext.Provider>\n    );\n  }\n\n  return child;\n}\n\nexport const ToolbarCollectionContentAutoSizer = observer(\n  _ToolbarCollectionContentAutoSizer,\n);\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/ToolbarItem/ToolbarItem.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_ = "ToolbarItem4069200404";
+var _namespace_ = "ToolbarItem1199624691";
 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": "ToolbarItem4069200404__root"
+  "root": "ToolbarItem1199624691__root"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/ToolbarItem/ToolbarItem.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/ToolbarItem/ToolbarItem.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"ToolbarItem4069200404\";\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\":\"ToolbarItem4069200404__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,uBAAuB;AACzC,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;AAA6B,CAAC;AACpD,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/ToolbarItem/ToolbarItem.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"ToolbarItem1199624691\";\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\":\"ToolbarItem1199624691__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,uBAAuB;AACzC,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;AAA6B,CAAC;AACpD,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":[]}

package/dist/cjs/components/ToolbarItemBox/ToolbarItemBox.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_ = "ToolbarItemBox2043857805";
+var _namespace_ = "ToolbarItemBox3124818986";
 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": "ToolbarItemBox2043857805__root"
+  "root": "ToolbarItemBox3124818986__root"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/ToolbarItemBox/ToolbarItemBox.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/ToolbarItemBox/ToolbarItemBox.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"ToolbarItemBox2043857805\";\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\":\"ToolbarItemBox2043857805__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,0BAA0B;AAC5C,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;AAAgC,CAAC;AACvD,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/ToolbarItemBox/ToolbarItemBox.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"ToolbarItemBox3124818986\";\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\":\"ToolbarItemBox3124818986__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,0BAA0B;AAC5C,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;AAAgC,CAAC;AACvD,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":[]}

package/dist/cjs/components/VirtualGridRepeater/TableForceRenderIndexes.js

@@ -28,6 +28,7 @@ const TableForceRenderIndexes = exports.TableForceRenderIndexes = /*#__PURE__*/(
       contents,
       listAttributes
     }) => /*#__PURE__*/_react.default.createElement("tbody", (0, _extends2.default)({
+      key: props.id,
       "data-hook": "virtual-inner-element",
       "data-count": state.gridState.itemsToRenderCount,
       ref: el => {

package/dist/cjs/components/VirtualGridRepeater/TableForceRenderIndexes.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_VirtualGridRepeaterContext","_VirtualTableRow","_ForceRenderIndexes","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","TableForceRenderIndexes","exports","forwardRef","props","ref","children","style","state","useVirtualGridRepeaterContext","useEffect","scrollHeight","height","createElement","ForceRenderIndexesObserver","ItemElementType","VirtualTableRow","contentsWrapper","contents","listAttributes","_extends2","gridState","itemsToRenderCount","el","current","innerElement","width","undefined","position","display","__self","__source","fileName","lineNumber","columnNumber"],"sources":["../../../../src/components/VirtualGridRepeater/TableForceRenderIndexes.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  HTMLAttributes,\n  ReactElement,\n  useEffect,\n} from 'react';\nimport { useVirtualGridRepeaterContext } from './VirtualGridRepeaterContext';\nimport { VirtualTableRow } from './VirtualTableRow';\nimport { ForceRenderIndexesObserver } from './ForceRenderIndexes';\n\nexport const TableForceRenderIndexes = forwardRef<\n  HTMLTableSectionElement,\n  { children: ReactElement[] } & HTMLAttributes<HTMLTableSectionElement>\n>((props, ref) => {\n  const { children, style } = props;\n  const { state } = useVirtualGridRepeaterContext();\n\n  useEffect(() => {\n    state.scrollHeight = style?.height;\n  }, [style?.height]);\n\n  return (\n    <ForceRenderIndexesObserver\n      ItemElementType={VirtualTableRow}\n      contentsWrapper={({ contents, listAttributes }) => (\n        <tbody\n          data-hook=\"virtual-inner-element\"\n          data-count={state.gridState.itemsToRenderCount}\n          ref={(el) => {\n            if (typeof ref === 'function') {\n              ref(el);\n            } else if (ref) {\n              ref.current = el;\n            }\n            state.innerElement = el;\n          }}\n          {...listAttributes}\n          {...props}\n          style={{\n            ...style,\n            width: undefined, // we get the width from react-window but we want it to be auto, so we pass undefined\n            position: 'relative',\n            display: 'flex',\n          }}\n        >\n          {contents}\n        </tbody>\n      )}\n    >\n      {children}\n    </ForceRenderIndexesObserver>\n  );\n});\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_VirtualGridRepeaterContext","_VirtualTableRow","_ForceRenderIndexes","_jsxFileName","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","TableForceRenderIndexes","exports","forwardRef","props","ref","children","style","state","useVirtualGridRepeaterContext","useEffect","scrollHeight","height","createElement","ForceRenderIndexesObserver","ItemElementType","VirtualTableRow","contentsWrapper","contents","listAttributes","_extends2","key","id","gridState","itemsToRenderCount","el","current","innerElement","width","undefined","position","display","__self","__source","fileName","lineNumber","columnNumber"],"sources":["../../../../src/components/VirtualGridRepeater/TableForceRenderIndexes.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  HTMLAttributes,\n  ReactElement,\n  useEffect,\n} from 'react';\nimport { useVirtualGridRepeaterContext } from './VirtualGridRepeaterContext';\nimport { VirtualTableRow } from './VirtualTableRow';\nimport { ForceRenderIndexesObserver } from './ForceRenderIndexes';\n\nexport const TableForceRenderIndexes = forwardRef<\n  HTMLTableSectionElement,\n  { children: ReactElement[] } & HTMLAttributes<HTMLTableSectionElement>\n>((props, ref) => {\n  const { children, style } = props;\n  const { state } = useVirtualGridRepeaterContext();\n\n  useEffect(() => {\n    state.scrollHeight = style?.height;\n  }, [style?.height]);\n\n  return (\n    <ForceRenderIndexesObserver\n      ItemElementType={VirtualTableRow}\n      contentsWrapper={({ contents, listAttributes }) => (\n        <tbody\n          key={props.id}\n          data-hook=\"virtual-inner-element\"\n          data-count={state.gridState.itemsToRenderCount}\n          ref={(el) => {\n            if (typeof ref === 'function') {\n              ref(el);\n            } else if (ref) {\n              ref.current = el;\n            }\n            state.innerElement = el;\n          }}\n          {...listAttributes}\n          {...props}\n          style={{\n            ...style,\n            width: undefined, // we get the width from react-window but we want it to be auto, so we pass undefined\n            position: 'relative',\n            display: 'flex',\n          }}\n        >\n          {contents}\n        </tbody>\n      )}\n    >\n      {children}\n    </ForceRenderIndexesObserver>\n  );\n});\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/VirtualGridRepeater/VirtualGridRepeaterState.js

@@ -79,6 +79,7 @@ class VirtualGridRepeaterState {
   init({
     container: scrollableContainer
   }) {
+    let animationFrameId;
     if (!scrollableContainer) {
       return;
     }
@@ -102,7 +103,7 @@ class VirtualGridRepeaterState {
         });
         return;
       }
-      requestAnimationFrame((0, _mobx.action)(() => {
+      animationFrameId = window.requestAnimationFrame((0, _mobx.action)(() => {
         if (this.gridRef == null || this.innerElement == null) {
           return;
         }
@@ -128,6 +129,7 @@ class VirtualGridRepeaterState {
     scrollableContainer.addEventListener('scroll', onScroll);
     return () => {
       scrollableContainer.removeEventListener('scroll', onScroll);
+      window.cancelAnimationFrame(animationFrameId);
     };
   }
 }