@wix/patterns 1.337.0 → 1.339.0

package/src/state/Toolbar/ToolbarLeftGroupState.ts

@@ -0,0 +1,86 @@
+import { addResizeObserver } from '@wix/bex-core';
+import type { ToolbarResponsiveState } from './ToolbarResponsiveState';
+import type { TabsFilterState } from '../../components/TabsFilter/TabsFilterState';
+import type { FiltersMap } from '@wix/bex-core';
+import { ToolbarMode } from '../../components/CollectionToolbar/toolbarModeUtils';
+
+export interface ToolbarLeftGroupStateParams<T, F extends FiltersMap> {
+  readonly responsive: ToolbarResponsiveState;
+  readonly mode: ToolbarMode;
+  readonly minWidth: number;
+  readonly getTabsState?: () => TabsFilterState<T, F> | null | undefined;
+}
+
+export class ToolbarLeftGroupState<T, F extends FiltersMap> {
+  private readonly _responsive: ToolbarResponsiveState;
+  private readonly _getTabsState?: () =>
+    | TabsFilterState<T, F>
+    | null
+    | undefined;
+
+  private _element: HTMLElement | null = null;
+  private _prevWidth = 0;
+
+  readonly mode: ToolbarMode;
+  readonly minWidth: number;
+
+  private readonly EXPANSION_THRESHOLD = 20;
+
+  constructor(params: ToolbarLeftGroupStateParams<T, F>) {
+    this._responsive = params.responsive;
+    this.mode = params.mode;
+    this.minWidth = params.minWidth;
+    this._getTabsState = params.getTabsState;
+  }
+
+  init(element: HTMLElement | null | undefined): () => void {
+    this._element = null;
+    this._prevWidth = 0;
+
+    if (!element) {
+      return () => {};
+    }
+
+    this._element = element;
+    const disposer = addResizeObserver(element, this._handleResize);
+    this._handleResize();
+
+    return () => {
+      disposer?.();
+      this._element = null;
+      this._prevWidth = 0;
+    };
+  }
+
+  private _handleResize = () => {
+    const element = this._element;
+    if (!element) {
+      return;
+    }
+
+    const width = element.clientWidth;
+    const prevWidth = this._prevWidth;
+    const isAtMinWidth = width <= this.minWidth + 2; // 2px tolerance
+    const isGrowing = width > prevWidth;
+    const hasSpaceToExpand = width > this.minWidth + this.EXPANSION_THRESHOLD;
+
+    if (isAtMinWidth) {
+      this._responsive.overflow._scrollWidth =
+        this._responsive.overflow._clientWidth + 1;
+      this._responsive._nextToShrink._shrinkIfNeeded();
+    } else if (isGrowing && hasSpaceToExpand) {
+      const availableSpace = width - this.minWidth;
+
+      this._responsive._nextToExpand._expandIfNeeded({
+        preCalculatedAvailableSpace: availableSpace,
+      });
+    }
+
+    if (this.mode === 'tabs') {
+      const tabsState = this._getTabsState?.();
+      tabsState?.responsive.setAvailableWidth(width);
+    }
+
+    this._prevWidth = width;
+  };
+}

package/src/state/Toolbar/ToolbarResponsivePriorityState.ts

@@ -10,17 +10,17 @@ export interface ToolbarResponsivePriorityStateParams {
 }
 
 export class ToolbarResponsivePriorityState {
-  readonly responsive;
-  readonly getNextToShrink;
-  readonly getNextToExpand;
-  readonly _count;
+  readonly responsive: ToolbarResponsiveState;
+  getNextToShrink: () => ToolbarResponsivePriorityState;
+  getNextToExpand: () => ToolbarResponsivePriorityState;
+  readonly _count: number;
 
-  _minWidth;
-  _collapsedWidth;
+  _minWidth: number;
+  _collapsedWidth: number;
 
   _shouldShrink = false;
 
-  _groupElement?: HTMLElement | null | undefined;
+  _groupElement: HTMLElement | null = null;
 
   constructor(params: ToolbarResponsivePriorityStateParams) {
     this._count = params.count;
@@ -68,6 +68,10 @@ export class ToolbarResponsivePriorityState {
       actionsAvailableSpace: { available },
     } = responsive;
 
+    if (responsive._expandCooldown) {
+      return;
+    }
+
     if (
       _nextToExpand !== this ||
       (preCalculatedAvailableSpace ?? available) + _collapsedWidth <=
@@ -82,11 +86,14 @@ export class ToolbarResponsivePriorityState {
     responsive._nextToShrink = this;
     responsive.actionsAvailableSpace._syncThrottled();
 
-    // experimental - expanding the next item without waiting for the layout tick
-    // const availableAfterExpand = available + _collapsedWidth - this._minWidth;
-    // responsive._nextToExpand._expandIfNeeded({
-    //   preCalculatedAvailableSpace: availableAfterExpand,
-    // });
+    const spaceUsed = this._minWidth - _collapsedWidth;
+    const availableAfterExpand =
+      (preCalculatedAvailableSpace ?? available) - spaceUsed;
+    if (availableAfterExpand > 0) {
+      responsive._nextToExpand._expandIfNeeded({
+        preCalculatedAvailableSpace: availableAfterExpand,
+      });
+    }
   }
 
   _shrinkIfNeeded() {
@@ -105,6 +112,16 @@ export class ToolbarResponsivePriorityState {
     this._shouldShrink = true;
     responsive._nextToShrink = _nextToShrink.getNextToShrink();
     responsive._nextToExpand = this;
+
+    // Double rAF ensures the shrink is fully painted before allowing expansion.
+    // Single rAF can cause flickering because layout may not be settled yet.
+    responsive._expandCooldown = true;
+    window.requestAnimationFrame(() => {
+      window.requestAnimationFrame(() => {
+        responsive._expandCooldown = false;
+      });
+    });
+
     responsive.overflow._syncThrottled();
   }
 }

package/src/state/Toolbar/ToolbarResponsiveState.ts

@@ -4,6 +4,7 @@ import { HorizontalSpaceAvailableState } from '../Responsive/HorizontalSpaceAvai
 import { ToolbarResponsivePriorityState } from './ToolbarResponsivePriorityState';
 import { HorizontalOverflowState } from '../Responsive/HorizontalOverflowState';
 import { ToolbarState } from '../../components/CollectionToolbars/ToolbarState';
+import { ToolbarLeftGroupState } from './ToolbarLeftGroupState';
 
 export interface ToolbarResponsiveStateParams {
   readonly toolbar: ToolbarState<any, any>;
@@ -14,13 +15,17 @@ export class ToolbarResponsiveState {
   readonly search: ToolbarResponsivePriorityState;
   readonly filters: ToolbarResponsivePriorityState;
 
-  _nextToShrink;
-  _nextToExpand;
+  _nextToShrink: ToolbarResponsivePriorityState;
+  _nextToExpand: ToolbarResponsivePriorityState;
 
-  readonly actionsAvailableSpace;
-  readonly overflow;
+  _expandCooldown = false;
 
-  readonly toolbar;
+  readonly actionsAvailableSpace: HorizontalSpaceAvailableState;
+  readonly overflow: HorizontalOverflowState;
+
+  readonly toolbar: ToolbarState<any, any>;
+
+  leftGroupState: ToolbarLeftGroupState<any, any> | null = null;
 
   get container() {
     return this.toolbar.toolbar.container;
@@ -33,30 +38,30 @@ export class ToolbarResponsiveState {
       state: this,
     });
 
-    this.search = new ToolbarResponsivePriorityState({
+    this.actions = new ToolbarResponsivePriorityState({
       responsive: this,
-      getNextToShrink: () => this.actions,
-      getNextToExpand: () => this.search,
+      getNextToShrink: () => this.filters,
+      getNextToExpand: () => this.actions,
       count: 1,
-      minWidth: 140,
     });
 
-    this.actions = new ToolbarResponsivePriorityState({
+    this.filters = new ToolbarResponsivePriorityState({
       responsive: this,
-      getNextToShrink: () => this.filters,
-      getNextToExpand: () => this.search,
+      getNextToShrink: () => this.search,
+      getNextToExpand: () => this.actions,
       count: 2,
     });
 
-    this.filters = new ToolbarResponsivePriorityState({
+    this.search = new ToolbarResponsivePriorityState({
       responsive: this,
-      getNextToShrink: () => this.filters,
-      getNextToExpand: () => this.actions,
+      getNextToShrink: () => this.search,
+      getNextToExpand: () => this.filters,
       count: 3,
+      minWidth: 140,
     });
 
-    this._nextToShrink = this.search;
-    this._nextToExpand = this.search;
+    this._nextToShrink = this.actions;
+    this._nextToExpand = this.actions;
 
     this.actionsAvailableSpace = new HorizontalSpaceAvailableState({
       state: this,

package/src/styles.global.css

@@ -1 +1 @@
-.CardContainer1127640947__root.CardContainer1127640947--mobile{border-radius:0}.Collapse4173233543__root{transition-property:height;transition-timing-function:cubic-bezier(.4,0,.2,1)}.Collapse4173233543__exit{height:0}.CollectionPage1884614354__root [data-hook=page-header-wrapper]{--wds-space-300:18px}.CollectionPage1884614354__root.CollectionPage1884614354--mobile{--wds-page-header-padding-horizontal:0;--wds-color-fill-surface-sunken:#ffffff}.CollectionPage1884614354__root.CollectionPage1884614354--panel{overflow:hidden;position:relative}.CollectionTable830039945__root td{vertical-align:middle}.CollectionTable830039945__root.CollectionTable830039945--mobile td:first-child{padding-left:18px}.CollectionTable830039945__root.CollectionTable830039945--mobile td:last-child{padding-right:18px}.CollectionToolbar2067268736__left{min-width:0}.CollectionToolbar2067268736__root.CollectionToolbar2067268736--views .CollectionToolbar2067268736__left{flex-shrink:1;flex-grow:0}.CollectionToolbar2067268736__left.CollectionToolbar2067268736--expandable{flex:auto}.CollectionToolbar2067268736__root .CollectionToolbar2067268736__right{justify-content:flex-end!important;flex-grow:1;flex-shrink:1;flex-basis:auto}.CollectionToolbar2067268736__root.CollectionToolbar2067268736--views .CollectionToolbar2067268736__right{min-width:0;flex-grow:1;flex-shrink:0;flex-basis:0}.CollectionToolbar2067268736__root .CollectionToolbar2067268736__right.CollectionToolbar2067268736__fullWidth{margin-inline-start:0!important}.CollectionToolbar2067268736__root.CollectionToolbar2067268736--mobile{padding-right:18px;padding-left:18px}.SearchOrCustomFilter3266924804__search{min-width:140px;max-width:240px;flex:1 0}.SearchOrCustomFilter3266924804__searchMobile{justify-content:flex-end;position:absolute;right:18px}.SearchOrCustomFilter3266924804__searchMobile:not(.SearchOrCustomFilter3266924804--expandable){left:18px}.SearchOrCustomFilter3266924804__searchMobile.SearchOrCustomFilter3266924804--expandable.SearchOrCustomFilter3266924804--expanded{left:18px}.AutoCompleteReadonly1578371289__root.AutoCompleteReadonly1578371289--disableEditing{cursor:pointer}.AutoCompleteReadonly1578371289__root.AutoCompleteReadonly1578371289--disableEditing input{cursor:pointer}.ViewsDropdown445946096__root{width:200px}.DragHandle3732314417__root{display:flex;align-items:center}.DragHandle3732314417__root:not(.DragHandle3732314417--disabled){cursor:grab;color:#a8caff}.DragHandle3732314417__root.DragHandle3732314417--disabled{color:#acafc4}.DragHandle3732314417__root:focus-visible:not(.DragHandle3732314417--disabled){outline:0;box-shadow:0 0 0 3px #a6d0ff}.DragHandle3732314417__root.DragHandle3732314417--disabled{pointer-events:none}.DragHandle3732314417__root.DragHandle3732314417--dragging:not(.DragHandle3732314417--disabled){cursor:grabbing}.EntityPagePlain1938592713__root.EntityPagePlain1938592713--mobile{--wds-page-header-padding-horizontal:0}.Fade1959325389__root{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);opacity:1}.Fade1959325389__root.Fade1959325389--exit{opacity:0}.Heading1774965373__root{visibility:visible}.Heading1774965373__root.Heading1774965373--appearanceH2{font-size:28px!important;line-height:36px!important}.InputOverflow869134323__root.InputOverflow869134323--selected:not(.InputOverflow869134323--focused) input::placeholder{color:#000624}@keyframes LoadingRow51442686__gradientSwoosh{0%{background-position:50% 50%;background-size:150% 125%}15%{background-position:75% 40%;background-size:130% 115%}30%{background-position:50% 50%;background-size:120% 135%}60%{background-position:30% 50%;background-size:120% 135%}80%{background-position:10% 30%;background-size:130% 155%}to{background-position:40% 45%;background-size:125% 135%}}.LoadingRow51442686__root{background-image:linear-gradient(60deg,rgba(255,255,255,.15)0,rgba(255,255,255,.15) 50%,rgba(95,242,174,.15) 100%),linear-gradient(284.81deg,#fff 67.18%,#91bbff 158.87%),linear-gradient(29deg,rgba(145,187,255,.6)0,#fff 40%,rgba(95,242,174,.6) 100%);height:100%;background-size:150% 125%;background-repeat:no-repeat;animation:LoadingRow51442686__gradientSwoosh 2s ease-out infinite alternate}.MaxHeightText2323143137__root{opacity:1}.MaxHeightText2323143137__root.MaxHeightText2323143137--height24{line-height:24px}.MaxLines3438071243__root{overflow:hidden}.MaxLines3438071243__root.MaxLines3438071243--clamp{-webkit-box-orient:vertical;display:-webkit-box}.MultiBulkActionToolbar3538856250__root{min-width:0}.MultiBulkActionToolbar3538856250__leftGroupWrapper{overflow:hidden;padding-right:12px;min-width:0;flex-wrap:nowrap;align-items:center}.MultiBulkActionToolbar3538856250__selectedCountItem{min-width:0;flex-shrink:1;white-space:nowrap;overflow:hidden}.MultiBulkActionToolbar3538856250__selectedCountText{display:block;width:100%}.NestedTablePlaceholderStatesRow2901976876__root td{padding:0!important;width:100%}.NestedTableRow4216831903__firstLevel td{padding-top:18px!important;padding-bottom:18px!important}.NestedTableRow4216831903__root:hover{background-color:#e7f0ff!important}.NestedTableRow4216831903__root.NestedTableRow4216831903--expandable{cursor:pointer}.NestedTableRow4216831903__placeholder td{padding:0!important;width:100%}.NestedTableRow4216831903__root:hover td:first-of-type::before,.NestedTableRow4216831903__parentHovered td:first-of-type::before{content:"";position:absolute;top:0;bottom:0;left:0;width:2px;background-color:#5999ff}.MultipleDragOverlayEffect2720149821__root{position:absolute;transform:translate(6px,6px);background-color:#fff;box-shadow:0 2px 4px 0 rgba(0,6,36,.12),0 0 6px 0 rgba(0,6,36,.12)}.NestedTableDragAndDropRow2752194378__root.NestedTableDragAndDropRow2752194378--draggingInto td{background-color:#e7f0ff!important}.PickerContent123699860__root{display:flex}.PickerContentAdditionalStep23964712__titles{display:flex;justify-content:center;flex:1 1 auto;overflow:hidden;flex-direction:column}.PickerContentAdditionalStep23964712__suffix{display:flex;align-items:center;flex:0 0 auto;overflow:hidden}.PickerTableListItem3689164289__root{box-sizing:border-box}.ScrollableContent1514627155__root.ScrollableContent1514627155--overflowY{overflow-y:auto}.ScrollableContent1514627155__root.ScrollableContent1514627155--overflowX{overflow-x:auto}.ScrollableContent1514627155__root.ScrollableContent1514627155--smooth{scroll-behavior:smooth}.SkeletonCard4200077779__headerLoading{display:block!important}.SlidingModal1143591618__root{transition:transform .4s ease 0s;position:fixed;z-index:1}.SlidingModal1143591618__root.SlidingModal1143591618--overlay{transition:transform 0s ease 0s}.SlidingModal1143591618__root.SlidingModal1143591618---appendTo-6-parent{position:absolute}.SlidingModal1143591618__root:not(.SlidingModal1143591618--exited){box-shadow:0 3px 24px 0 rgba(22,45,61,.18),0 8px 8px 0 rgba(22,45,61,.12)}.TabsFilter232326813__root .TabsFilter232326813__title{color:inherit!important}.ManageTagsModal3811406198__root{display:flex}.ToolbarItem4209088188__root{min-width:0}.ToolbarItemBox3824877352__root{min-width:0}.ToolbarItemBox3824877352__root.ToolbarItemBox3824877352--removeStartPadding{margin-left:-24px}.ToolbarItemBox3824877352__root.ToolbarItemBox3824877352--expandable{flex:1 0}.common2150455002__column{display:flex;flex-direction:column}.common2150455002__fullHeight{height:100%;min-height:0}.CollectionPageHeader3964412975__root.CollectionPageHeader3964412975--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.CollectionPageHeader3964412975__root.CollectionPageHeader3964412975--mobile>*{margin-left:0;margin-top:6px!important;height:auto}.FormPageHeader3327977933__root.FormPageHeader3327977933--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.FormPageHeader3327977933__root.FormPageHeader3327977933--mobile>*{margin-left:0;margin-top:6px!important;height:auto}
+.CardContainer3079601548__root.CardContainer3079601548--mobile{border-radius:0}.Collapse224372759__root{transition-property:height;transition-timing-function:cubic-bezier(.4,0,.2,1)}.Collapse224372759__exit{height:0}.CollectionPage1814068000__root [data-hook=page-header-wrapper]{--wds-space-300:18px}.CollectionPage1814068000__root.CollectionPage1814068000--mobile{--wds-page-header-padding-horizontal:0;--wds-color-fill-surface-sunken:#ffffff}.CollectionPage1814068000__root.CollectionPage1814068000--panel{overflow:hidden;position:relative}.CollectionTable2415796293__root td{vertical-align:middle}.CollectionTable2415796293__root.CollectionTable2415796293--mobile td:first-child{padding-left:18px}.CollectionTable2415796293__root.CollectionTable2415796293--mobile td:last-child{padding-right:18px}.CollectionToolbar1811998541__left{min-width:0}.CollectionToolbar1811998541__left.CollectionToolbar1811998541--expandable{flex:auto}.CollectionToolbar1811998541__left.CollectionToolbar1811998541--title>*{width:100%}.CollectionToolbar1811998541__root.CollectionToolbar1811998541---responsiveMode-5-title .CollectionToolbar1811998541__left{flex:1 100;min-width:50px}.CollectionToolbar1811998541__root.CollectionToolbar1811998541---responsiveMode-4-tabs .CollectionToolbar1811998541__left,.CollectionToolbar1811998541__root.CollectionToolbar1811998541---responsiveMode-4-tabs .CollectionToolbar1811998541__left.CollectionToolbar1811998541--expandable{flex:1 100 auto;min-width:140px}.CollectionToolbar1811998541__root.CollectionToolbar1811998541---responsiveMode-4-tabs .CollectionToolbar1811998541__left>*{flex-shrink:1;min-width:0}.CollectionToolbar1811998541__root .CollectionToolbar1811998541__right{justify-content:flex-end!important;flex-grow:1;flex-shrink:1;flex-basis:auto}.CollectionToolbar1811998541__root.CollectionToolbar1811998541--views .CollectionToolbar1811998541__right{min-width:0;flex-grow:1;flex-shrink:0;flex-basis:0}.CollectionToolbar1811998541__root.CollectionToolbar1811998541---responsiveMode-4-tabs .CollectionToolbar1811998541__right,.CollectionToolbar1811998541__root.CollectionToolbar1811998541---responsiveMode-5-title .CollectionToolbar1811998541__right{flex:0 1 auto;min-width:0}.CollectionToolbar1811998541__root .CollectionToolbar1811998541__right.CollectionToolbar1811998541__fullWidth{margin-inline-start:0!important}.CollectionToolbar1811998541__root.CollectionToolbar1811998541--mobile{padding-right:18px;padding-left:18px}.SearchOrCustomFilter2883258947__search{min-width:140px;max-width:240px;flex:1 0}.SearchOrCustomFilter2883258947__searchMobile{justify-content:flex-end;position:absolute;right:18px}.SearchOrCustomFilter2883258947__searchMobile:not(.SearchOrCustomFilter2883258947--expandable){left:18px}.SearchOrCustomFilter2883258947__searchMobile.SearchOrCustomFilter2883258947--expandable.SearchOrCustomFilter2883258947--expanded{left:18px}.AutoCompleteReadonly1467974692__root.AutoCompleteReadonly1467974692--disableEditing{cursor:pointer}.AutoCompleteReadonly1467974692__root.AutoCompleteReadonly1467974692--disableEditing input{cursor:pointer}.ViewsDropdown988678590__root{width:200px}.DragHandle3343873060__root{display:flex;align-items:center}.DragHandle3343873060__root:not(.DragHandle3343873060--disabled){cursor:grab;color:#a8caff}.DragHandle3343873060__root.DragHandle3343873060--disabled{color:#acafc4}.DragHandle3343873060__root:focus-visible:not(.DragHandle3343873060--disabled){outline:0;box-shadow:0 0 0 3px #a6d0ff}.DragHandle3343873060__root.DragHandle3343873060--disabled{pointer-events:none}.DragHandle3343873060__root.DragHandle3343873060--dragging:not(.DragHandle3343873060--disabled){cursor:grabbing}.EntityPagePlain2149433821__root.EntityPagePlain2149433821--mobile{--wds-page-header-padding-horizontal:0}.Fade818575166__root{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);opacity:1}.Fade818575166__root.Fade818575166--exit{opacity:0}.Heading1796052903__root{visibility:visible}.Heading1796052903__root.Heading1796052903--appearanceH2{font-size:28px!important;line-height:36px!important}.InputOverflow3502787266__root.InputOverflow3502787266--selected:not(.InputOverflow3502787266--focused) input::placeholder{color:#000624}@keyframes LoadingRow352518099__gradientSwoosh{0%{background-position:50% 50%;background-size:150% 125%}15%{background-position:75% 40%;background-size:130% 115%}30%{background-position:50% 50%;background-size:120% 135%}60%{background-position:30% 50%;background-size:120% 135%}80%{background-position:10% 30%;background-size:130% 155%}to{background-position:40% 45%;background-size:125% 135%}}.LoadingRow352518099__root{background-image:linear-gradient(60deg,rgba(255,255,255,.15)0,rgba(255,255,255,.15) 50%,rgba(95,242,174,.15) 100%),linear-gradient(284.81deg,#fff 67.18%,#91bbff 158.87%),linear-gradient(29deg,rgba(145,187,255,.6)0,#fff 40%,rgba(95,242,174,.6) 100%);height:100%;background-size:150% 125%;background-repeat:no-repeat;animation:LoadingRow352518099__gradientSwoosh 2s ease-out infinite alternate}.MaxHeightText1726886362__root{opacity:1}.MaxHeightText1726886362__root.MaxHeightText1726886362--height24{line-height:24px}.MaxLines3450690009__root{overflow:hidden}.MaxLines3450690009__root.MaxLines3450690009--clamp{-webkit-box-orient:vertical;display:-webkit-box}.MultiBulkActionToolbar4262379086__root{min-width:0}.MultiBulkActionToolbar4262379086__leftGroupWrapper{overflow:hidden;padding-right:12px;min-width:0;flex-wrap:nowrap;align-items:center}.MultiBulkActionToolbar4262379086__selectedCountItem{min-width:0;flex-shrink:1;white-space:nowrap;overflow:hidden}.MultiBulkActionToolbar4262379086__selectedCountText{display:block;width:100%}.NestedTablePlaceholderStatesRow3373505387__root td{padding:0!important;width:100%}.NestedTableRow4266583698__firstLevel td{padding-top:18px!important;padding-bottom:18px!important}.NestedTableRow4266583698__root:hover{background-color:#e7f0ff!important}.NestedTableRow4266583698__root.NestedTableRow4266583698--expandable{cursor:pointer}.NestedTableRow4266583698__placeholder td{padding:0!important;width:100%}.NestedTableRow4266583698__root:hover td:first-of-type::before,.NestedTableRow4266583698__parentHovered td:first-of-type::before{content:"";position:absolute;top:0;bottom:0;left:0;width:2px;background-color:#5999ff}.MultipleDragOverlayEffect695384191__root{position:absolute;transform:translate(6px,6px);background-color:#fff;box-shadow:0 2px 4px 0 rgba(0,6,36,.12),0 0 6px 0 rgba(0,6,36,.12)}.NestedTableDragAndDropRow2227072666__root.NestedTableDragAndDropRow2227072666--draggingInto td{background-color:#e7f0ff!important}.PickerContent1626301124__root{display:flex}.PickerContentAdditionalStep1762375108__titles{display:flex;justify-content:center;flex:1 1 auto;overflow:hidden;flex-direction:column}.PickerContentAdditionalStep1762375108__suffix{display:flex;align-items:center;flex:0 0 auto;overflow:hidden}.PickerTableListItem2364026151__root{box-sizing:border-box}.ScrollableContent287701298__root.ScrollableContent287701298--overflowY{overflow-y:auto}.ScrollableContent287701298__root.ScrollableContent287701298--overflowX{overflow-x:auto}.ScrollableContent287701298__root.ScrollableContent287701298--smooth{scroll-behavior:smooth}.SkeletonCard1509158132__headerLoading{display:block!important}.SlidingModal2058154665__root{transition:transform .4s ease 0s;position:fixed;z-index:1}.SlidingModal2058154665__root.SlidingModal2058154665--overlay{transition:transform 0s ease 0s}.SlidingModal2058154665__root.SlidingModal2058154665---appendTo-6-parent{position:absolute}.SlidingModal2058154665__root:not(.SlidingModal2058154665--exited){box-shadow:0 3px 24px 0 rgba(22,45,61,.18),0 8px 8px 0 rgba(22,45,61,.12)}.TabsFilter1340887134__root .TabsFilter1340887134__title{color:inherit!important}.ManageTagsModal2191591010__root{display:flex}.ToolbarItem679348093__root{min-width:0}.ToolbarItemBox4136043548__root{min-width:0}.ToolbarItemBox4136043548__root.ToolbarItemBox4136043548--removeStartPadding{margin-left:-24px}.ToolbarItemBox4136043548__root.ToolbarItemBox4136043548--expandable{flex:1 0}.common547183010__column{display:flex;flex-direction:column}.common547183010__fullHeight{height:100%;min-height:0}.CollectionPageHeader731162558__root.CollectionPageHeader731162558--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.CollectionPageHeader731162558__root.CollectionPageHeader731162558--mobile>*{margin-left:0;margin-top:6px!important;height:auto}.FormPageHeader99460919__root.FormPageHeader99460919--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.FormPageHeader99460919__root.FormPageHeader99460919--mobile>*{margin-left:0;margin-top:6px!important;height:auto}

package/src/version.ts

@@ -1 +1 @@
-export const version = 'patterns@1.337.0';
+export const version = 'patterns@1.339.0';