@wix/patterns 1.283.0 → 1.285.0

package/src/components/CollectionToolbar/SearchOrCustomFilter.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SearchOrCustomFilter3069269174";
+var _namespace_ = "SearchOrCustomFilter3524095349";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"SearchOrCustomFilter3069269174__root","search":"SearchOrCustomFilter3069269174__search","searchMobile":"SearchOrCustomFilter3069269174__searchMobile"};
+export var classes = {"root":"SearchOrCustomFilter3524095349__root","search":"SearchOrCustomFilter3524095349__search","searchMobile":"SearchOrCustomFilter3524095349__searchMobile"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionViewsDropdown/AutoCompleteReadonly.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "AutoCompleteReadonly1428118244";
+var _namespace_ = "AutoCompleteReadonly715883956";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"AutoCompleteReadonly1428118244__root"};
+export var classes = {"root":"AutoCompleteReadonly715883956__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/CollectionViewsDropdown/ViewsDropdown.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ViewsDropdown3795013070";
+var _namespace_ = "ViewsDropdown1188062330";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"ViewsDropdown3795013070__root"};
+export var classes = {"root":"ViewsDropdown1188062330__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/DragHandle/DragHandle.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "DragHandle4240049879";
+var _namespace_ = "DragHandle3657496453";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"DragHandle4240049879__root"};
+export var classes = {"root":"DragHandle3657496453__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EntityPage/EntityPagePlain.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "EntityPagePlain3821154142";
+var _namespace_ = "EntityPagePlain42607356";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"EntityPagePlain3821154142__root"};
+export var classes = {"root":"EntityPagePlain42607356__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/Fade/Fade.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "Fade1928358073";
+var _namespace_ = "Fade717608746";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"Fade1928358073__root"};
+export var classes = {"root":"Fade717608746__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/Heading/Heading.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "Heading3436527611";
+var _namespace_ = "Heading879931624";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"Heading3436527611__root"};
+export var classes = {"root":"Heading879931624__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/InputOverflow/InputOverflow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "InputOverflow1874700306";
+var _namespace_ = "InputOverflow3108125531";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"InputOverflow1874700306__root"};
+export var classes = {"root":"InputOverflow3108125531__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/LoadingRow/LoadingRow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "LoadingRow791957015";
+var _namespace_ = "LoadingRow3028187127";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,8 +13,8 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"LoadingRow791957015__root"};
-export var keyframes = {"gradientSwoosh":"LoadingRow791957015__gradientSwoosh"}; 
+export var classes = {"root":"LoadingRow3028187127__root"};
+export var keyframes = {"gradientSwoosh":"LoadingRow3028187127__gradientSwoosh"}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 

package/src/components/MaxHeightText/MaxHeightText.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "MaxHeightText2763736264";
+var _namespace_ = "MaxHeightText1180777210";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"MaxHeightText2763736264__root"};
+export var classes = {"root":"MaxHeightText1180777210__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/MaxLines/MaxLines.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "MaxLines1524217325";
+var _namespace_ = "MaxLines4210541799";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"MaxLines1524217325__root"};
+export var classes = {"root":"MaxLines4210541799__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/MultiBulkActionToolbar/MultiBulkActionToolbar.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "MultiBulkActionToolbar2561752517";
+var _namespace_ = "MultiBulkActionToolbar3468034499";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"MultiBulkActionToolbar2561752517__root"};
+export var classes = {"root":"MultiBulkActionToolbar3468034499__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTable/NestedTablePlaceholderStatesRow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "NestedTablePlaceholderStatesRow2120274618";
+var _namespace_ = "NestedTablePlaceholderStatesRow1797465809";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"NestedTablePlaceholderStatesRow2120274618__root"};
+export var classes = {"root":"NestedTablePlaceholderStatesRow1797465809__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTable/NestedTableRow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "NestedTableRow2117229753";
+var _namespace_ = "NestedTableRow1992619258";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"NestedTableRow2117229753__root","firstLevel":"NestedTableRow2117229753__firstLevel","placeholder":"NestedTableRow2117229753__placeholder","parentHovered":"NestedTableRow2117229753__parentHovered"};
+export var classes = {"root":"NestedTableRow1992619258__root","firstLevel":"NestedTableRow1992619258__firstLevel","placeholder":"NestedTableRow1992619258__placeholder","parentHovered":"NestedTableRow1992619258__parentHovered"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTableDragAndDrop/MultipleDragOverlayEffect.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "MultipleDragOverlayEffect4013091273";
+var _namespace_ = "MultipleDragOverlayEffect1886685203";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"MultipleDragOverlayEffect4013091273__root"};
+export var classes = {"root":"MultipleDragOverlayEffect1886685203__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/NestedTableDragAndDrop/NestedTableDragAndDropRow.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "NestedTableDragAndDropRow1518336375";
+var _namespace_ = "NestedTableDragAndDropRow4217194469";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"NestedTableDragAndDropRow1518336375__root"};
+export var classes = {"root":"NestedTableDragAndDropRow4217194469__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/PageWrapper/PageWrapperBase.tsx

@@ -1,4 +1,4 @@
-import React, { ReactNode, useEffect, useMemo, useState } from 'react';
+import React, { ReactNode, useMemo, useState } from 'react';
 import { useReactive } from '@wix/bex-utils/react';
 import {
   PageContextProvider,
@@ -20,9 +20,10 @@ export function PageWrapperBase(props: PageWrapperBaseProps) {
   const sidePanelOpen = useReactive(_sidePanelOpen);
   const { environment } = useWixPatternsContainer();
 
-  useEffect(() => {
-    return state.init();
-  }, [state]);
+  // CAIRO-3582: modify mobile detection to use user agent
+  // useEffect(() => {
+  //   return state.init();
+  // }, [state]);
 
   const pageAndModalsRootStyle = useMemo(
     () => ({

package/src/components/Picker/Picker.uni.driver.ts

@@ -75,6 +75,7 @@ export function PickerUniDriver(base: UniDriver, body: UniDriver) {
       return checked.filter(Boolean).length;
     },
     isSelectorCheckedAt: selectorList.isSelectorCheckedAt,
+    isListItemDisabledAt: (i: number) => selectorDriverAt(i).isDisabled(),
     waitListItemAt: async (i: number, timeout?: number) =>
       waitFor(() => selectorDriverAt(i).exists(), timeout),
     getTableListItemAt: (i: number) => tableListItemDriverAt(i),
@@ -97,6 +98,7 @@ export function PickerUniDriver(base: UniDriver, body: UniDriver) {
       getSelectors().get(i).$('[data-hook="selector-subtitle"]').text(),
     getExtraNodeElementAt: (i: number) => selectorDriverAt(i).getExtraNode(),
     getImageElementAt: (i: number) => selectorDriverAt(i).getImage(),
+    getToggleTooltipTextAt: (i: number) => selectorDriverAt(i).getTooltipText(),
     floatingNotificationExists: () => getFloatingNotification().exists(),
     getFloatingNotificationText: () => getFloatingNotification().getText(),
     getEmptyState,

package/src/components/PickerContent/PickerContent.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "PickerContent2698585527";
+var _namespace_ = "PickerContent976986081";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"PickerContent2698585527__root"};
+export var classes = {"root":"PickerContent976986081__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/PickerContent/PickerContentAdditionalStep.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "PickerContentAdditionalStep2531053893";
+var _namespace_ = "PickerContentAdditionalStep986953761";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"PickerContentAdditionalStep2531053893__root","titles":"PickerContentAdditionalStep2531053893__titles","suffix":"PickerContentAdditionalStep2531053893__suffix"};
+export var classes = {"root":"PickerContentAdditionalStep986953761__root","titles":"PickerContentAdditionalStep986953761__titles","suffix":"PickerContentAdditionalStep986953761__suffix"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/PickerModal/PickerModal.uni.driver.ts

@@ -110,6 +110,13 @@ export function PickerModalUniDriver(
      * @returns {Promise<boolean>}
      */
     isSelectorCheckedAt: (index: number) => picker().isSelectorCheckedAt(index),
+    /**
+     * Checks whether the item at the passed index is disabled.
+     * @param {number} index Item index
+     * @returns {Promise<boolean>}
+     */
+    isListItemDisabledAt: (index: number) =>
+      picker().isListItemDisabledAt(index),
     /**
      * Wait for a item to be added to the list
      * @param index
@@ -140,6 +147,12 @@ export function PickerModalUniDriver(
      */
     getExtraNodeElementAt: (index: number) =>
       picker().getExtraNodeElementAt(index),
+    /**
+     * Get the tooltip toggle text of a list item
+     * @param index
+     */
+    getToggleTooltipTextAt: (index: number) =>
+      picker().getToggleTooltipTextAt(index),
     /**
      * Indicates whether the initial loader of the modal is shown
      */

package/src/components/PickerTableListItem/PickerTableListItem.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "PickerTableListItem268520782";
+var _namespace_ = "PickerTableListItem1409063400";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"PickerTableListItem268520782__root"};
+export var classes = {"root":"PickerTableListItem1409063400__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/ScrollableContent/ScrollableContent.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ScrollableContent4239736696";
+var _namespace_ = "ScrollableContent4119222350";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"ScrollableContent4239736696__root"};
+export var classes = {"root":"ScrollableContent4119222350__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/SkeletonCard/SkeletonCard.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SkeletonCard1064921542";
+var _namespace_ = "SkeletonCard3922275419";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"SkeletonCard1064921542__root","headerLoading":"SkeletonCard1064921542__headerLoading"};
+export var classes = {"root":"SkeletonCard3922275419__root","headerLoading":"SkeletonCard3922275419__headerLoading"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/SlidingModal/SlidingModal.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SlidingModal3769074898";
+var _namespace_ = "SlidingModal534325249";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"SlidingModal3769074898__root"};
+export var classes = {"root":"SlidingModal534325249__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/TabsFilter/TabsFilter.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "TabsFilter3727603916";
+var _namespace_ = "TabsFilter955256226";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"TabsFilter3727603916__root","title":"TabsFilter3727603916__title"};
+export var classes = {"root":"TabsFilter955256226__root","title":"TabsFilter955256226__title"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/Tags/ManageTags/ManageTagsModal/ManageTagsModal.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "ManageTagsModal1000165874";
+var _namespace_ = "ManageTagsModal970140747";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"ManageTagsModal1000165874__root"};
+export var classes = {"root":"ManageTagsModal970140747__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/ToolbarItem/ToolbarItem.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ToolbarItem985694274";
+var _namespace_ = "ToolbarItem161707831";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"ToolbarItem985694274__root"};
+export var classes = {"root":"ToolbarItem161707831__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/ToolbarItemBox/ToolbarItemBox.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ToolbarItemBox433050142";
+var _namespace_ = "ToolbarItemBox3607083112";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"ToolbarItemBox433050142__root"};
+export var classes = {"root":"ToolbarItemBox3607083112__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/common.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "common2339355952";
+var _namespace_ = "common1915025097";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"common2339355952__root","column":"common2339355952__column","fullHeight":"common2339355952__fullHeight"};
+export var classes = {"root":"common1915025097__root","column":"common1915025097__column","fullHeight":"common1915025097__fullHeight"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/hooks/useIsMobile.ts

@@ -1,6 +1,9 @@
 import { usePageContext } from '@wix/bex-core/react';
 import { useSelector } from '../useSelector';
 
+// CAIRO-3582: modify mobile detection to use user agent
+// export { MOBILE_BREAKPOINT } from '@wix/bex-core';
+
 export const useIsMobile = () => {
   const pageState = usePageContext();
   return useSelector(() => pageState.isMobile);

package/src/index.ts

@@ -39,6 +39,7 @@ export * from './components/PickerContent';
 export * from './components/PickerModalOpenButton';
 export * from './components/PickerStandalone';
 export * from './components/PickerEmptyState/PickerEmptyState';
+export * from './components/PickerListItemProps';
 export {
   SingleSelectFilter,
   SingleSelectFilterProps,

package/src/model/tableColumn.ts

@@ -20,6 +20,7 @@ type TableColumnBase<T = any> = Omit<
   infoTooltipProps?: TableColumnWSR['infoTooltipProps'] & {
     panelContent?: ReactNode;
   };
+  mobile?: ColumnMobileConfig;
 };
 
 // disallow specifying `hideable` / `defaultHidden` or setting `hiddenFromCustomColumnsSelection` as false when `id` is missing
@@ -82,6 +83,23 @@ export type SortableConfig<T> =
 
 export type TableColumn<T> = CustomColumnConfig<T> & SortableConfig<T>;
 
+export type ColumnMobileConfig = {
+  /**
+   * Which mobile column to display in.
+   * - 'first': Stacks vertically with other 'first' columns
+   * - 'second': Displays as standalone second column
+   * - undefined: Hidden on mobile
+   */
+  column?: 'first' | 'second';
+
+  /**
+   * Sort order within 'first' column (lower appears higher).
+   * Only relevant when column is 'first'.
+   * @default Infinity
+   */
+  order?: number;
+};
+
 export interface Column {
   /**
    * A unique identifier for the column. This value is required to enable [custom columns](./?path=/story/features-display-custom-columns--overview) or [sortable columns](./?path=/story/features-sort-sortable-columns-sortable-columns--sortable-columns).
@@ -145,6 +163,14 @@ export interface Column {
   render: TableColumnWSR['render'];
   width?: TableColumnWSR['width'];
   style?: TableColumnWSR['style'];
+  /**
+   * Mobile column configuration. Determines how this column is displayed on mobile devices.
+   * - column: 'first' - Stacks vertically with other 'first' columns
+   * - column: 'second' - Displays as standalone second column
+   * - undefined - Hidden on mobile
+   * @external
+   */
+  mobile?: ColumnMobileConfig;
 }
 
 // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error