@wix/patterns 1.337.0 → 1.339.0

package/dist/cjs/components/PickerContent/PickerContent.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/PickerContent/PickerContent.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"PickerContent123699860\";\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\":\"PickerContent123699860__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,wBAAwB;AAC1C,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;AAA8B,CAAC;AACrD,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/PickerContent/PickerContent.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"PickerContent1626301124\";\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\":\"PickerContent1626301124__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,yBAAyB;AAC3C,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;AAA+B,CAAC;AACtD,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/PickerContent/PickerContentAdditionalStep.st.css.js

@@ -5,16 +5,16 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
 // @ts-nocheck
 
-var _namespace_ = "PickerContentAdditionalStep23964712";
+var _namespace_ = "PickerContentAdditionalStep1762375108";
 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": "PickerContentAdditionalStep23964712__root",
-  "titles": "PickerContentAdditionalStep23964712__titles",
-  "suffix": "PickerContentAdditionalStep23964712__suffix"
+  "root": "PickerContentAdditionalStep1762375108__root",
+  "titles": "PickerContentAdditionalStep1762375108__titles",
+  "suffix": "PickerContentAdditionalStep1762375108__suffix"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/PickerContent/PickerContentAdditionalStep.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/PickerContent/PickerContentAdditionalStep.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"PickerContentAdditionalStep23964712\";\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\":\"PickerContentAdditionalStep23964712__root\",\"titles\":\"PickerContentAdditionalStep23964712__titles\",\"suffix\":\"PickerContentAdditionalStep23964712__suffix\"};\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,qCAAqC;AACvD,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,2CAA2C;EAAC,QAAQ,EAAC,6CAA6C;EAAC,QAAQ,EAAC;AAA6C,CAAC;AAChL,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/PickerContent/PickerContentAdditionalStep.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"PickerContentAdditionalStep1762375108\";\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\":\"PickerContentAdditionalStep1762375108__root\",\"titles\":\"PickerContentAdditionalStep1762375108__titles\",\"suffix\":\"PickerContentAdditionalStep1762375108__suffix\"};\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,uCAAuC;AACzD,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,6CAA6C;EAAC,QAAQ,EAAC,+CAA+C;EAAC,QAAQ,EAAC;AAA+C,CAAC;AACtL,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/PickerTableListItem/PickerTableListItem.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_ = "PickerTableListItem3689164289";
+var _namespace_ = "PickerTableListItem2364026151";
 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": "PickerTableListItem3689164289__root"
+  "root": "PickerTableListItem2364026151__root"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/PickerTableListItem/PickerTableListItem.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/PickerTableListItem/PickerTableListItem.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"PickerTableListItem3689164289\";\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\":\"PickerTableListItem3689164289__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,+BAA+B;AACjD,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;AAAqC,CAAC;AAC5D,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/PickerTableListItem/PickerTableListItem.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"PickerTableListItem2364026151\";\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\":\"PickerTableListItem2364026151__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,+BAA+B;AACjD,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;AAAqC,CAAC;AAC5D,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/ResponsiveButton/ResponsiveButton.js

@@ -5,12 +5,13 @@ exports.__esModule = true;
 exports.ResponsiveButton = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _designSystem = require("@wix/design-system");
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _mobxReactLite = require("mobx-react-lite");
 var _ToolbarCollectionContext = require("../ToolbarCollectionContext");
 var _PatternsThemeProvider = require("../../themes/PatternsThemeProvider");
 var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/ResponsiveButton/ResponsiveButton.tsx";
-function _ResponsiveButton(props) {
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const _ResponsiveButton = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
   const {
     dataHook,
     as,
@@ -32,39 +33,51 @@ function _ResponsiveButton(props) {
     }
   } = (0, _ToolbarCollectionContext.useToolbarCollectionContext)();
   const {
-    _nextToShrink,
     responsiveDisabled
   } = responsive;
-  const shouldShrink = responsiveDisabled ? shouldShrinkProp : _nextToShrink._count >= state._count && state._shouldShrink;
+  const shouldShrink = responsiveDisabled ? shouldShrinkProp : state._shouldShrink;
   return shouldShrink ? /*#__PURE__*/_react.default.createElement(_designSystem.Tooltip, {
     content: children,
     dataHook: dataHook ? `${dataHook}-tooltip` : undefined,
-    __self: this,
+    __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 49,
-      columnNumber: 5
+      lineNumber: 50,
+      columnNumber: 7
     }
   }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
     direction: "vertical",
     minWidth: "30px",
-    __self: this,
+    __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 53,
-      columnNumber: 7
+      lineNumber: 54,
+      columnNumber: 9
     }
-  }, /*#__PURE__*/_react.default.createElement(_designSystem.IconButton, (0, _extends2.default)({}, rest, {
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.IconButton, (0, _extends2.default)({
+    ref: ref
+  }, rest, {
     dataHook: dataHook,
     size: sizes.small,
     priority: "secondary",
-    __self: this,
+    __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 54,
-      columnNumber: 9
+      lineNumber: 55,
+      columnNumber: 11
+    }
+  }), icon))) : /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      display: 'contents'
+    },
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 67,
+      columnNumber: 7
     }
-  }), icon))) : /*#__PURE__*/_react.default.createElement(_designSystem.Button, (0, _extends2.default)({
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Button, (0, _extends2.default)({
+    ref: ref,
     as: as
   }, rest, {
     dataHook: dataHook,
@@ -72,13 +85,13 @@ function _ResponsiveButton(props) {
     priority: "secondary",
     prefixIcon: icon,
     suffixIcon: button.suffix,
-    __self: this,
+    __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 65,
-      columnNumber: 5
+      lineNumber: 68,
+      columnNumber: 9
     }
-  }), children);
-}
+  }), children));
+});
 const ResponsiveButton = exports.ResponsiveButton = (0, _mobxReactLite.observer)(_ResponsiveButton);
 //# sourceMappingURL=ResponsiveButton.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["_designSystem","require","_react","_interopRequireDefault","_mobxReactLite","_ToolbarCollectionContext","_PatternsThemeProvider","_jsxFileName","_ResponsiveButton","props","dataHook","as","icon","children","state","shouldShrink","shouldShrinkProp","rest","sizes","toolbar","button","usePatternsTheme","responsive","useToolbarCollectionContext","_nextToShrink","responsiveDisabled","_count","_shouldShrink","default","createElement","Tooltip","content","undefined","__self","__source","fileName","lineNumber","columnNumber","Box","direction","minWidth","IconButton","_extends2","size","small","priority","Button","prefixIcon","suffixIcon","suffix","ResponsiveButton","exports","observer"],"sources":["../../../../src/components/ResponsiveButton/ResponsiveButton.tsx"],"sourcesContent":["import {\n  Box,\n  Button,\n  ButtonAsButtonProps,\n  IconButton,\n  IconElement,\n  Tooltip,\n} from '@wix/design-system';\nimport React from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { useToolbarCollectionContext } from '../ToolbarCollectionContext';\nimport { ToolbarResponsivePriorityState } from '../../state/Toolbar/ToolbarResponsivePriorityState';\nimport { usePatternsTheme } from '../../themes/PatternsThemeProvider';\n\nexport type ResponsiveButtonProps = ButtonAsButtonProps<{\n  dataHook?: string;\n  icon?: IconElement;\n  state: ToolbarResponsivePriorityState;\n  shouldShrink?: boolean;\n}>;\n\nfunction _ResponsiveButton(props: ResponsiveButtonProps) {\n  const {\n    dataHook,\n    as,\n    icon,\n    children,\n    state,\n    shouldShrink: shouldShrinkProp = true,\n    ...rest\n  } = props;\n\n  const {\n    sizes,\n    toolbar: { button },\n  } = usePatternsTheme();\n\n  const {\n    toolbar: { responsive },\n  } = useToolbarCollectionContext();\n\n  const { _nextToShrink, responsiveDisabled } = responsive;\n\n  const shouldShrink = responsiveDisabled\n    ? shouldShrinkProp\n    : _nextToShrink._count >= state._count && state._shouldShrink;\n\n  return shouldShrink ? (\n    <Tooltip\n      content={children}\n      dataHook={dataHook ? `${dataHook}-tooltip` : undefined}\n    >\n      <Box direction=\"vertical\" minWidth=\"30px\">\n        <IconButton\n          {...rest}\n          dataHook={dataHook}\n          size={sizes.small}\n          priority=\"secondary\"\n        >\n          {icon}\n        </IconButton>\n      </Box>\n    </Tooltip>\n  ) : (\n    <Button\n      as={as}\n      {...rest}\n      dataHook={dataHook}\n      size={sizes.small}\n      priority=\"secondary\"\n      prefixIcon={icon}\n      suffixIcon={button.suffix}\n    >\n      {children}\n    </Button>\n  );\n}\n\nexport const ResponsiveButton = observer(_ResponsiveButton);\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AAQA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,cAAA,GAAAH,OAAA;AACA,IAAAI,yBAAA,GAAAJ,OAAA;AAEA,IAAAK,sBAAA,GAAAL,OAAA;AAAsE,IAAAM,YAAA;AAStE,SAASC,iBAAiBA,CAACC,KAA4B,EAAE;EACvD,MAAM;IACJC,QAAQ;IACRC,EAAE;IACFC,IAAI;IACJC,QAAQ;IACRC,KAAK;IACLC,YAAY,EAAEC,gBAAgB,GAAG,IAAI;IACrC,GAAGC;EACL,CAAC,GAAGR,KAAK;EAET,MAAM;IACJS,KAAK;IACLC,OAAO,EAAE;MAAEC;IAAO;EACpB,CAAC,GAAG,IAAAC,uCAAgB,EAAC,CAAC;EAEtB,MAAM;IACJF,OAAO,EAAE;MAAEG;IAAW;EACxB,CAAC,GAAG,IAAAC,qDAA2B,EAAC,CAAC;EAEjC,MAAM;IAAEC,aAAa;IAAEC;EAAmB,CAAC,GAAGH,UAAU;EAExD,MAAMP,YAAY,GAAGU,kBAAkB,GACnCT,gBAAgB,GAChBQ,aAAa,CAACE,MAAM,IAAIZ,KAAK,CAACY,MAAM,IAAIZ,KAAK,CAACa,aAAa;EAE/D,OAAOZ,YAAY,gBACjBb,MAAA,CAAA0B,OAAA,CAAAC,aAAA,CAAC7B,aAAA,CAAA8B,OAAO;IACNC,OAAO,EAAElB,QAAS;IAClBH,QAAQ,EAAEA,QAAQ,GAAG,GAAGA,QAAQ,UAAU,GAAGsB,SAAU;IAAAC,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA5B,YAAA;MAAA6B,UAAA;MAAAC,YAAA;IAAA;EAAA,gBAEvDnC,MAAA,CAAA0B,OAAA,CAAAC,aAAA,CAAC7B,aAAA,CAAAsC,GAAG;IAACC,SAAS,EAAC,UAAU;IAACC,QAAQ,EAAC,MAAM;IAAAP,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA5B,YAAA;MAAA6B,UAAA;MAAAC,YAAA;IAAA;EAAA,gBACvCnC,MAAA,CAAA0B,OAAA,CAAAC,aAAA,CAAC7B,aAAA,CAAAyC,UAAU,MAAAC,SAAA,CAAAd,OAAA,MACLX,IAAI;IACRP,QAAQ,EAAEA,QAAS;IACnBiC,IAAI,EAAEzB,KAAK,CAAC0B,KAAM;IAClBC,QAAQ,EAAC,WAAW;IAAAZ,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA5B,YAAA;MAAA6B,UAAA;MAAAC,YAAA;IAAA;EAAA,IAEnBzB,IACS,CACT,CACE,CAAC,gBAEVV,MAAA,CAAA0B,OAAA,CAAAC,aAAA,CAAC7B,aAAA,CAAA8C,MAAM,MAAAJ,SAAA,CAAAd,OAAA;IACLjB,EAAE,EAAEA;EAAG,GACHM,IAAI;IACRP,QAAQ,EAAEA,QAAS;IACnBiC,IAAI,EAAEzB,KAAK,CAAC0B,KAAM;IAClBC,QAAQ,EAAC,WAAW;IACpBE,UAAU,EAAEnC,IAAK;IACjBoC,UAAU,EAAE5B,MAAM,CAAC6B,MAAO;IAAAhB,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAA5B,YAAA;MAAA6B,UAAA;MAAAC,YAAA;IAAA;EAAA,IAEzBxB,QACK,CACT;AACH;AAEO,MAAMqC,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAG,IAAAE,uBAAQ,EAAC5C,iBAAiB,CAAC","ignoreList":[]}
+{"version":3,"names":["_designSystem","require","_react","_interopRequireWildcard","_mobxReactLite","_ToolbarCollectionContext","_PatternsThemeProvider","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_ResponsiveButton","forwardRef","props","ref","dataHook","as","icon","children","state","shouldShrink","shouldShrinkProp","rest","sizes","toolbar","button","usePatternsTheme","responsive","useToolbarCollectionContext","responsiveDisabled","_shouldShrink","createElement","Tooltip","content","undefined","__self","__source","fileName","lineNumber","columnNumber","Box","direction","minWidth","IconButton","_extends2","size","small","priority","style","display","Button","prefixIcon","suffixIcon","suffix","ResponsiveButton","exports","observer"],"sources":["../../../../src/components/ResponsiveButton/ResponsiveButton.tsx"],"sourcesContent":["import {\n  Box,\n  Button,\n  ButtonAsButtonProps,\n  IconButton,\n  IconElement,\n  Tooltip,\n} from '@wix/design-system';\nimport React, { forwardRef } from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { useToolbarCollectionContext } from '../ToolbarCollectionContext';\nimport { ToolbarResponsivePriorityState } from '../../state/Toolbar/ToolbarResponsivePriorityState';\nimport { usePatternsTheme } from '../../themes/PatternsThemeProvider';\n\nexport type ResponsiveButtonProps = ButtonAsButtonProps<{\n  dataHook?: string;\n  icon?: IconElement;\n  state: ToolbarResponsivePriorityState;\n  shouldShrink?: boolean;\n}>;\n\nconst _ResponsiveButton = forwardRef<Button, ResponsiveButtonProps>(\n  (props, ref) => {\n    const {\n      dataHook,\n      as,\n      icon,\n      children,\n      state,\n      shouldShrink: shouldShrinkProp = true,\n      ...rest\n    } = props;\n\n    const {\n      sizes,\n      toolbar: { button },\n    } = usePatternsTheme();\n\n    const {\n      toolbar: { responsive },\n    } = useToolbarCollectionContext();\n\n    const { responsiveDisabled } = responsive;\n\n    const shouldShrink = responsiveDisabled\n      ? shouldShrinkProp\n      : state._shouldShrink;\n\n    return shouldShrink ? (\n      <Tooltip\n        content={children}\n        dataHook={dataHook ? `${dataHook}-tooltip` : undefined}\n      >\n        <Box direction=\"vertical\" minWidth=\"30px\">\n          <IconButton\n            ref={ref}\n            {...rest}\n            dataHook={dataHook}\n            size={sizes.small}\n            priority=\"secondary\"\n          >\n            {icon}\n          </IconButton>\n        </Box>\n      </Tooltip>\n    ) : (\n      <div style={{ display: 'contents' }}>\n        <Button\n          ref={ref}\n          as={as}\n          {...rest}\n          dataHook={dataHook}\n          size={sizes.small}\n          priority=\"secondary\"\n          prefixIcon={icon}\n          suffixIcon={button.suffix}\n        >\n          {children}\n        </Button>\n      </div>\n    );\n  },\n);\n\nexport const ResponsiveButton = observer(_ResponsiveButton);\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/ScrollableContent/ScrollableContent.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_ = "ScrollableContent1514627155";
+var _namespace_ = "ScrollableContent287701298";
 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": "ScrollableContent1514627155__root"
+  "root": "ScrollableContent287701298__root"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/ScrollableContent/ScrollableContent.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/ScrollableContent/ScrollableContent.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"ScrollableContent1514627155\";\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\":\"ScrollableContent1514627155__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,6BAA6B;AAC/C,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;AAAmC,CAAC;AAC1D,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/ScrollableContent/ScrollableContent.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"ScrollableContent287701298\";\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\":\"ScrollableContent287701298__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,4BAA4B;AAC9C,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;AAAkC,CAAC;AACzD,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/SkeletonCard/SkeletonCard.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_ = "SkeletonCard4200077779";
+var _namespace_ = "SkeletonCard1509158132";
 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": "SkeletonCard4200077779__root",
-  "headerLoading": "SkeletonCard4200077779__headerLoading"
+  "root": "SkeletonCard1509158132__root",
+  "headerLoading": "SkeletonCard1509158132__headerLoading"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/SkeletonCard/SkeletonCard.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/SkeletonCard/SkeletonCard.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"SkeletonCard4200077779\";\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\":\"SkeletonCard4200077779__root\",\"headerLoading\":\"SkeletonCard4200077779__headerLoading\"};\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,wBAAwB;AAC1C,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,8BAA8B;EAAC,eAAe,EAAC;AAAuC,CAAC;AAC7G,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/SkeletonCard/SkeletonCard.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"SkeletonCard1509158132\";\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\":\"SkeletonCard1509158132__root\",\"headerLoading\":\"SkeletonCard1509158132__headerLoading\"};\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,wBAAwB;AAC1C,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,8BAA8B;EAAC,eAAe,EAAC;AAAuC,CAAC;AAC7G,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/SlidingModal/SlidingModal.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_ = "SlidingModal1143591618";
+var _namespace_ = "SlidingModal2058154665";
 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": "SlidingModal1143591618__root"
+  "root": "SlidingModal2058154665__root"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/SlidingModal/SlidingModal.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/SlidingModal/SlidingModal.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"SlidingModal1143591618\";\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\":\"SlidingModal1143591618__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,wBAAwB;AAC1C,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;AAA8B,CAAC;AACrD,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/SlidingModal/SlidingModal.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"SlidingModal2058154665\";\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\":\"SlidingModal2058154665__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,wBAAwB;AAC1C,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;AAA8B,CAAC;AACrD,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/TabsFilter.js

@@ -126,7 +126,7 @@ function _TabsFilter(props) {
   (0, _react.useEffect)(() => state.init({
     container: container.current,
     itemsCount: items.length
-  }), []);
+  }), [container, state]);
   const selectedId = filter.isEmpty ? _types.ALL_TAB_ITEM_ID : itemKey(filter.value[0]);
   return /*#__PURE__*/_react.default.createElement(_FilterContext.FilterContextProvider, {
     value: filter,
@@ -137,6 +137,11 @@ function _TabsFilter(props) {
       columnNumber: 5
     }
   }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    ref: node => {
+      if (node) {
+        container.current = node;
+      }
+    },
     dataHook: "collection-tabs-filter",
     className: (0, _TabsFilterStCss.st)(_TabsFilterStCss.classes.root),
     width: "100%",
@@ -150,18 +155,6 @@ function _TabsFilter(props) {
       lineNumber: 201,
       columnNumber: 7
     }
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    ref: node => {
-      if (node) {
-        container.current = node;
-      }
-    },
-    __self: this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 210,
-      columnNumber: 9
-    }
   }, responsive.mode === 'tabs' ? /*#__PURE__*/_react.default.createElement(_TabsDefault.TabsDefault, {
     items: items,
     data: dataProp,
@@ -174,8 +167,8 @@ function _TabsFilter(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 218,
-      columnNumber: 13
+      lineNumber: 216,
+      columnNumber: 11
     }
   }) : /*#__PURE__*/_react.default.createElement(_TabsDropdown.TabsDropdown, {
     filter: filter,
@@ -186,10 +179,10 @@ function _TabsFilter(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 229,
-      columnNumber: 13
+      lineNumber: 227,
+      columnNumber: 11
     }
-  }))));
+  })));
 }
 const TabsFilter = exports.TabsFilter = (0, _mobxReactLite.observer)(_TabsFilter);
 TabsFilter.displayName = 'TabsFilter';

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

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_designSystem","_mobx","_FilterContext","_mobxReactLite","_TabTitle","_ToolbarCollectionContext","_TabsFilterState","_TabsFilterStCss","_TabsDropdown","_types","_TabsDefault","_useFilterValueTotalState","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_TabsFilter","props","type","filter","data","dataProp","all","counterBadge","placeAllTabLast","onChange","mobilePopoverProps","itemKey","itemName","table","useToolbarCollectionContext","filterAllValueTotal","useFilterValueTotalState","value","undefined","container","React","useRef","state","useState","tabs","TabsFilterState","useLayoutEffect","runInAction","persistent","responsive","isAllCounterBadgeLoading","useMemo","allStatus","totalsCollection","initTask","status","isLoading","isIdle","isTableLoading","hideCounterBadge","items","_mergedItems","map","index","id","name","title","createElement","TabTitle","tabIndex","text","__self","__source","fileName","lineNumber","columnNumber","item","minWidth","itemsMinWidths","maxWidth","itemMaxWidth","allTabItem","ALL_TAB_ITEM_ID","panelMinWidth","useEffect","init","current","itemsCount","length","selectedId","isEmpty","FilterContextProvider","Box","dataHook","className","st","classes","root","width","height","direction","verticalAlign","flexGrow","ref","node","mode","TabsDefault","TabsDropdown","popoverProps","TabsFilter","exports","observer","displayName"],"sources":["../../../../src/components/TabsFilter/TabsFilter.tsx"],"sourcesContent":["import React, {\n  ReactElement,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { Box, DropdownProps, TabsProps } from '@wix/design-system';\nimport { Filter } from '@wix/bex-core';\nimport { runInAction } from 'mobx';\nimport { FilterContextProvider } from '../FilterContext';\nimport { observer } from 'mobx-react-lite';\nimport { TabTitle } from './TabTitle';\nimport { useToolbarCollectionContext } from '../ToolbarCollectionContext';\nimport { TabsFilterState } from './TabsFilterState';\nimport { classes, st } from './TabsFilter.st.css.js';\nimport { TabsDropdown } from './TabsDropdown';\nimport { ALL_TAB_ITEM_ID, TabsFilterItemBase } from './types';\nimport { TabsDefault } from './TabsDefault';\nimport { useFilterValueTotalState } from '../TabTotal/useFilterValueTotalState';\nimport type { TabCounterBadgeProps } from '../TabTotal/TabTotalCounterBadge';\nimport type { TabTotalParensProps } from '../TabTotal/TabTotalParens';\n\n/** Type alias for TabTotalCounterBadge component element */\ntype TabTotalCounterBadge<V> = ReactElement<\n  TabCounterBadgeProps<V, unknown, any>\n>;\n/** Type alias for TabTotalParens component element */\ntype TabTotalParens<V> = ReactElement<TabTotalParensProps<V, unknown, any>>;\n\nexport interface TabsFilterProps<V> {\n  /**\n   * List of tabs.\n   * @external\n   */\n  data: V[];\n  /**\n   * Defines the selected filter.\n   * <br><br>\n   * Must be an [arrayFilter](./?path=/story/features-filter-factories--arrayfilter) object.\n   * @external\n   */\n  filter: Filter<V[]>;\n  /**\n   * Display name of the tab that indicates that all items are included.\n   * <br>\n   * Changes the value of `filter` to an empty array.\n   * @external\n   */\n  all?: string | null | false;\n\n  /**\n   * Renders a counter badge next to the tabs' texts.\n   * <br><br>\n   * See different examples of this implementation in the [Overview](./?path=/story/features-filter-components--tabsfilter) tab.\n   * @external\n   */\n  counterBadge?: (\n    value: V | null | undefined,\n  ) => TabTotalCounterBadge<V> | TabTotalParens<V> | null | undefined;\n  onChange?: (value: V | null | undefined) => unknown;\n\n  /**\n   * Tabs layout type.\n   * <br><br>\n   * If this prop is omitted, the width depends on the label width. The total width of all the tabs cannot exceed 80% of the toolbar.\n   * <br><br>\n   * Supported values:<br>\n   * - `uniformFull`: Tabs are spread out uniformly.\n   * @external\n   */\n  type?: Extract<TabsProps['type'], 'uniformFull'>;\n\n  placeAllTabLast?: boolean;\n\n  /**\n   * Custom popover props for the mobile dropdown menu. On mobile devices, tabs are displayed as a dropdown menu.\n   * @external\n   */\n  mobilePopoverProps?: DropdownProps['popoverProps'];\n}\n\nfunction _TabsFilter<V>(props: TabsFilterProps<V>) {\n  const {\n    type,\n    filter,\n    data: dataProp,\n    all,\n    counterBadge,\n    placeAllTabLast,\n    onChange,\n    mobilePopoverProps,\n  } = props;\n  const { itemKey, itemName } = filter;\n\n  const table = useToolbarCollectionContext();\n  const filterAllValueTotal = useFilterValueTotalState({\n    ...props,\n    value: undefined,\n  });\n\n  const container = React.useRef<HTMLDivElement>();\n\n  const [state] = useState(\n    () =>\n      (table.tabs ??= new TabsFilterState({\n        table,\n      })),\n  );\n\n  useLayoutEffect(() => {\n    runInAction(() => {\n      if (filter.persistent == null) {\n        filter.persistent = true;\n      }\n    });\n  }, []);\n\n  const { responsive } = state;\n\n  const isAllCounterBadgeLoading = useMemo(() => {\n    const allStatus = filterAllValueTotal.totalsCollection.initTask.status;\n    const { isLoading, isIdle } = allStatus;\n    return isLoading || isIdle;\n  }, [filterAllValueTotal.totalsCollection.initTask.status]);\n\n  const isTableLoading = useMemo(() => {\n    const { isLoading, isIdle } = table.initTask.status;\n    return isLoading || isIdle;\n  }, [table.initTask.status]);\n\n  const hideCounterBadge = isTableLoading || isAllCounterBadgeLoading;\n\n  const items = useMemo<TabsFilterItemBase[]>(() => {\n    const _mergedItems = dataProp.map((value, index) => {\n      return {\n        id: itemKey(value),\n        name: itemName(value),\n        title: (\n          <TabTitle\n            tabIndex={all && !placeAllTabLast ? index + 1 : index}\n            state={responsive}\n            text={itemName(value)}\n            value={value}\n            counterBadge={hideCounterBadge ? undefined : counterBadge}\n          />\n        ),\n        value,\n      };\n    });\n\n    if (!all) {\n      return _mergedItems.map((item, index) => ({\n        ...item,\n        index,\n        minWidth: responsive.itemsMinWidths[index],\n        maxWidth: responsive.itemMaxWidth,\n      }));\n    }\n\n    const allTabItem = {\n      id: ALL_TAB_ITEM_ID,\n      name: all,\n      title: (\n        <TabTitle\n          tabIndex={0}\n          state={responsive}\n          text={all}\n          value={undefined}\n          counterBadge={hideCounterBadge ? undefined : counterBadge}\n        />\n      ),\n    };\n\n    return (\n      placeAllTabLast\n        ? [..._mergedItems, allTabItem]\n        : [allTabItem, ..._mergedItems]\n    ).map((item, index) => ({\n      ...item,\n      minWidth: responsive.itemsMinWidths[index],\n      index,\n    }));\n  }, [dataProp, all, counterBadge, responsive.panelMinWidth, hideCounterBadge]);\n\n  useEffect(\n    () =>\n      state.init({\n        container: container.current,\n        itemsCount: items.length,\n      }),\n    [],\n  );\n\n  const selectedId = filter.isEmpty\n    ? ALL_TAB_ITEM_ID\n    : itemKey(filter.value[0]);\n\n  return (\n    <FilterContextProvider value={filter}>\n      <Box\n        dataHook=\"collection-tabs-filter\"\n        className={st(classes.root)}\n        width=\"100%\"\n        height={60}\n        direction=\"vertical\"\n        verticalAlign=\"middle\"\n        flexGrow={1}\n      >\n        <div\n          ref={(node) => {\n            if (node) {\n              container.current = node;\n            }\n          }}\n        >\n          {responsive.mode === 'tabs' ? (\n            <TabsDefault\n              items={items}\n              data={dataProp}\n              filter={filter}\n              selectedId={selectedId}\n              state={state}\n              onChange={onChange}\n              type={type}\n              all={all}\n            />\n          ) : (\n            <TabsDropdown\n              filter={filter}\n              data={dataProp}\n              items={items}\n              selectedId={selectedId}\n              popoverProps={mobilePopoverProps}\n            />\n          )}\n        </div>\n      </Box>\n    </FilterContextProvider>\n  );\n}\n\nexport const TabsFilter = observer(_TabsFilter);\nTabsFilter.displayName = 'TabsFilter';\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_designSystem","_mobx","_FilterContext","_mobxReactLite","_TabTitle","_ToolbarCollectionContext","_TabsFilterState","_TabsFilterStCss","_TabsDropdown","_types","_TabsDefault","_useFilterValueTotalState","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_TabsFilter","props","type","filter","data","dataProp","all","counterBadge","placeAllTabLast","onChange","mobilePopoverProps","itemKey","itemName","table","useToolbarCollectionContext","filterAllValueTotal","useFilterValueTotalState","value","undefined","container","React","useRef","state","useState","tabs","TabsFilterState","useLayoutEffect","runInAction","persistent","responsive","isAllCounterBadgeLoading","useMemo","allStatus","totalsCollection","initTask","status","isLoading","isIdle","isTableLoading","hideCounterBadge","items","_mergedItems","map","index","id","name","title","createElement","TabTitle","tabIndex","text","__self","__source","fileName","lineNumber","columnNumber","item","minWidth","itemsMinWidths","maxWidth","itemMaxWidth","allTabItem","ALL_TAB_ITEM_ID","panelMinWidth","useEffect","init","current","itemsCount","length","selectedId","isEmpty","FilterContextProvider","Box","ref","node","dataHook","className","st","classes","root","width","height","direction","verticalAlign","flexGrow","mode","TabsDefault","TabsDropdown","popoverProps","TabsFilter","exports","observer","displayName"],"sources":["../../../../src/components/TabsFilter/TabsFilter.tsx"],"sourcesContent":["import React, {\n  ReactElement,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { Box, DropdownProps, TabsProps } from '@wix/design-system';\nimport { Filter } from '@wix/bex-core';\nimport { runInAction } from 'mobx';\nimport { FilterContextProvider } from '../FilterContext';\nimport { observer } from 'mobx-react-lite';\nimport { TabTitle } from './TabTitle';\nimport { useToolbarCollectionContext } from '../ToolbarCollectionContext';\nimport { TabsFilterState } from './TabsFilterState';\nimport { classes, st } from './TabsFilter.st.css.js';\nimport { TabsDropdown } from './TabsDropdown';\nimport { ALL_TAB_ITEM_ID, TabsFilterItemBase } from './types';\nimport { TabsDefault } from './TabsDefault';\nimport { useFilterValueTotalState } from '../TabTotal/useFilterValueTotalState';\nimport type { TabCounterBadgeProps } from '../TabTotal/TabTotalCounterBadge';\nimport type { TabTotalParensProps } from '../TabTotal/TabTotalParens';\n\n/** Type alias for TabTotalCounterBadge component element */\ntype TabTotalCounterBadge<V> = ReactElement<\n  TabCounterBadgeProps<V, unknown, any>\n>;\n/** Type alias for TabTotalParens component element */\ntype TabTotalParens<V> = ReactElement<TabTotalParensProps<V, unknown, any>>;\n\nexport interface TabsFilterProps<V> {\n  /**\n   * List of tabs.\n   * @external\n   */\n  data: V[];\n  /**\n   * Defines the selected filter.\n   * <br><br>\n   * Must be an [arrayFilter](./?path=/story/features-filter-factories--arrayfilter) object.\n   * @external\n   */\n  filter: Filter<V[]>;\n  /**\n   * Display name of the tab that indicates that all items are included.\n   * <br>\n   * Changes the value of `filter` to an empty array.\n   * @external\n   */\n  all?: string | null | false;\n\n  /**\n   * Renders a counter badge next to the tabs' texts.\n   * <br><br>\n   * See different examples of this implementation in the [Overview](./?path=/story/features-filter-components--tabsfilter) tab.\n   * @external\n   */\n  counterBadge?: (\n    value: V | null | undefined,\n  ) => TabTotalCounterBadge<V> | TabTotalParens<V> | null | undefined;\n  onChange?: (value: V | null | undefined) => unknown;\n\n  /**\n   * Tabs layout type.\n   * <br><br>\n   * If this prop is omitted, the width depends on the label width. The total width of all the tabs cannot exceed 80% of the toolbar.\n   * <br><br>\n   * Supported values:<br>\n   * - `uniformFull`: Tabs are spread out uniformly.\n   * @external\n   */\n  type?: Extract<TabsProps['type'], 'uniformFull'>;\n\n  placeAllTabLast?: boolean;\n\n  /**\n   * Custom popover props for the mobile dropdown menu. On mobile devices, tabs are displayed as a dropdown menu.\n   * @external\n   */\n  mobilePopoverProps?: DropdownProps['popoverProps'];\n}\n\nfunction _TabsFilter<V>(props: TabsFilterProps<V>) {\n  const {\n    type,\n    filter,\n    data: dataProp,\n    all,\n    counterBadge,\n    placeAllTabLast,\n    onChange,\n    mobilePopoverProps,\n  } = props;\n  const { itemKey, itemName } = filter;\n\n  const table = useToolbarCollectionContext();\n  const filterAllValueTotal = useFilterValueTotalState({\n    ...props,\n    value: undefined,\n  });\n\n  const container = React.useRef<HTMLDivElement>();\n\n  const [state] = useState(\n    () =>\n      (table.tabs ??= new TabsFilterState({\n        table,\n      })),\n  );\n\n  useLayoutEffect(() => {\n    runInAction(() => {\n      if (filter.persistent == null) {\n        filter.persistent = true;\n      }\n    });\n  }, []);\n\n  const { responsive } = state;\n\n  const isAllCounterBadgeLoading = useMemo(() => {\n    const allStatus = filterAllValueTotal.totalsCollection.initTask.status;\n    const { isLoading, isIdle } = allStatus;\n    return isLoading || isIdle;\n  }, [filterAllValueTotal.totalsCollection.initTask.status]);\n\n  const isTableLoading = useMemo(() => {\n    const { isLoading, isIdle } = table.initTask.status;\n    return isLoading || isIdle;\n  }, [table.initTask.status]);\n\n  const hideCounterBadge = isTableLoading || isAllCounterBadgeLoading;\n\n  const items = useMemo<TabsFilterItemBase[]>(() => {\n    const _mergedItems = dataProp.map((value, index) => {\n      return {\n        id: itemKey(value),\n        name: itemName(value),\n        title: (\n          <TabTitle\n            tabIndex={all && !placeAllTabLast ? index + 1 : index}\n            state={responsive}\n            text={itemName(value)}\n            value={value}\n            counterBadge={hideCounterBadge ? undefined : counterBadge}\n          />\n        ),\n        value,\n      };\n    });\n\n    if (!all) {\n      return _mergedItems.map((item, index) => ({\n        ...item,\n        index,\n        minWidth: responsive.itemsMinWidths[index],\n        maxWidth: responsive.itemMaxWidth,\n      }));\n    }\n\n    const allTabItem = {\n      id: ALL_TAB_ITEM_ID,\n      name: all,\n      title: (\n        <TabTitle\n          tabIndex={0}\n          state={responsive}\n          text={all}\n          value={undefined}\n          counterBadge={hideCounterBadge ? undefined : counterBadge}\n        />\n      ),\n    };\n\n    return (\n      placeAllTabLast\n        ? [..._mergedItems, allTabItem]\n        : [allTabItem, ..._mergedItems]\n    ).map((item, index) => ({\n      ...item,\n      minWidth: responsive.itemsMinWidths[index],\n      index,\n    }));\n  }, [dataProp, all, counterBadge, responsive.panelMinWidth, hideCounterBadge]);\n\n  useEffect(\n    () =>\n      state.init({\n        container: container.current,\n        itemsCount: items.length,\n      }),\n    [container, state],\n  );\n\n  const selectedId = filter.isEmpty\n    ? ALL_TAB_ITEM_ID\n    : itemKey(filter.value[0]);\n\n  return (\n    <FilterContextProvider value={filter}>\n      <Box\n        ref={(node) => {\n          if (node) {\n            container.current = node;\n          }\n        }}\n        dataHook=\"collection-tabs-filter\"\n        className={st(classes.root)}\n        width=\"100%\"\n        height={60}\n        direction=\"vertical\"\n        verticalAlign=\"middle\"\n        flexGrow={1}\n      >\n        {responsive.mode === 'tabs' ? (\n          <TabsDefault\n            items={items}\n            data={dataProp}\n            filter={filter}\n            selectedId={selectedId}\n            state={state}\n            onChange={onChange}\n            type={type}\n            all={all}\n          />\n        ) : (\n          <TabsDropdown\n            filter={filter}\n            data={dataProp}\n            items={items}\n            selectedId={selectedId}\n            popoverProps={mobilePopoverProps}\n          />\n        )}\n      </Box>\n    </FilterContextProvider>\n  );\n}\n\nexport const TabsFilter = observer(_TabsFilter);\nTabsFilter.displayName = 'TabsFilter';\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_ = "TabsFilter232326813";
+var _namespace_ = "TabsFilter1340887134";
 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": "TabsFilter232326813__root",
-  "title": "TabsFilter232326813__title"
+  "root": "TabsFilter1340887134__root",
+  "title": "TabsFilter1340887134__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_ = \"TabsFilter232326813\";\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\":\"TabsFilter232326813__root\",\"title\":\"TabsFilter232326813__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,qBAAqB;AACvC,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,2BAA2B;EAAC,OAAO,EAAC;AAA4B,CAAC;AACvF,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_ = \"TabsFilter1340887134\";\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\":\"TabsFilter1340887134__root\",\"title\":\"TabsFilter1340887134__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

@@ -22,43 +22,28 @@ class TabsResponsiveState {
     (0, _defineProperty2.default)(this, "itemBadgeMargin", 6);
     (0, _defineProperty2.default)(this, "itemsMinWidths", []);
     (0, _defineProperty2.default)(this, "onResizeThrottled", void 0);
+    (0, _defineProperty2.default)(this, "_externalAvailableWidth", null);
     (0, _defineProperty2.default)(this, "_onResize", (0, _mobx.action)(() => {
       const {
         container
       } = this;
+      const availableWidth = this._externalAvailableWidth ?? (container == null ? void 0 : container.clientWidth) ?? 0;
       if (process.env.NODE_ENV === 'test') {
         return;
       }
       if (!container) {
         return;
       }
-
-      // Force dropdown mode on mobile
       if (this.isMobile) {
         this.mode = 'dropdown';
         return;
       }
       const nextPanelWidth = this.getPanelMinWidth();
-
-      // If the measurements show 0, this means that not all elements have loaded yet,
-      // so we skip such events.
       if (nextPanelWidth !== 0 && nextPanelWidth > this.panelMinWidth) {
         this.itemsMinWidths = this.getItemsMinWidth();
         this.panelMinWidth = nextPanelWidth;
       }
-
-      // The "container" is a node that wraps both Tabs and Dropdown components (but only
-      // one of them is rendered). It expands for as much space as all its elements
-      // inside need and shrinks down to the smallest possible state of the elements inside.
-      // Basically max-width and min-width with complications.
-      //
-      // Complications here are badges — they don't shrink, only tabs titles shrink.
-      //
-      // The state is switched when the certain container width (aka panelMinWidth) is reached.
-      // It is defined as: itemsCount * (itemMinWidth + itemPadding) + all badges widths.
-      // Tabs is shown when the container width is more or equal than panelMinWidth.
-      // Dropdown is shown when the container width is less than panelMinWidth.
-      if (this.panelMinWidth !== 0 && container.clientWidth < this.panelMinWidth) {
+      if (this.panelMinWidth !== 0 && availableWidth < this.panelMinWidth) {
         this.mode = 'dropdown';
       } else {
         this.mode = 'tabs';
@@ -99,6 +84,10 @@ class TabsResponsiveState {
     const badgesWidth = this.getBadgesWidth();
     return itemsCount * itemMinWidth + badgesWidth;
   }
+  setAvailableWidth(width) {
+    this._externalAvailableWidth = width;
+    this._onResize();
+  }
   init({
     container,
     itemsCount

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","isMobile","mode","nextPanelWidth","getPanelMinWidth","panelMinWidth","itemsMinWidths","getItemsMinWidth","clientWidth","isMobileDevice","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 {\n  addResizeObserver,\n  WixPatternsContainer,\n  isMobileDevice,\n} from '@wix/bex-core';\n\nexport interface TabsResponsiveStateParams {\n  container: WixPatternsContainer;\n}\n\nexport class TabsResponsiveState {\n  readonly isMobile: boolean;\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.isMobile = isMobileDevice();\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    if (process.env.NODE_ENV === 'test') {\n      return;\n    }\n\n    if (!container) {\n      return;\n    }\n\n    // Force dropdown mode on mobile\n    if (this.isMobile) {\n      this.mode = 'dropdown';\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","availableWidth","_externalAvailableWidth","clientWidth","process","env","NODE_ENV","isMobile","mode","nextPanelWidth","getPanelMinWidth","panelMinWidth","itemsMinWidths","getItemsMinWidth","isMobileDevice","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","setAvailableWidth","width","init","disposer","addResizeObserver","exports"],"sources":["../../../../src/components/TabsFilter/TabsResponsiveState.ts"],"sourcesContent":["import { action, makeObservable, observable } from 'mobx';\nimport {\n  addResizeObserver,\n  WixPatternsContainer,\n  isMobileDevice,\n} from '@wix/bex-core';\n\nexport interface TabsResponsiveStateParams {\n  container: WixPatternsContainer;\n}\n\nexport class TabsResponsiveState {\n  readonly isMobile: boolean;\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.isMobile = isMobileDevice();\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  _externalAvailableWidth: number | null = null;\n\n  setAvailableWidth(width: number) {\n    this._externalAvailableWidth = width;\n    this._onResize();\n  }\n\n  _onResize = action(() => {\n    const { container } = this;\n    const availableWidth =\n      this._externalAvailableWidth ?? container?.clientWidth ?? 0;\n\n    if (process.env.NODE_ENV === 'test') {\n      return;\n    }\n    if (!container) {\n      return;\n    }\n\n    if (this.isMobile) {\n      this.mode = 'dropdown';\n      return;\n    }\n\n    const nextPanelWidth = this.getPanelMinWidth();\n\n    if (nextPanelWidth !== 0 && nextPanelWidth > this.panelMinWidth) {\n      this.itemsMinWidths = this.getItemsMinWidth();\n      this.panelMinWidth = nextPanelWidth;\n    }\n\n    if (this.panelMinWidth !== 0 && availableWidth < this.panelMinWidth) {\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/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_ = "ManageTagsModal3811406198";
+var _namespace_ = "ManageTagsModal2191591010";
 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": "ManageTagsModal3811406198__root"
+  "root": "ManageTagsModal2191591010__root"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};