@wix/patterns 1.375.0 → 1.377.0

package/src/components/EditableTable/cellTypes/url/View.uni.driver.ts

@@ -1,9 +1,9 @@
 import { UniDriver } from '@wix/wix-ui-test-utils/unidriver';
-import { TextButtonUniDriver } from '@wix/design-system/dist/testkit/unidriver';
+import { IconButtonUniDriver } from '@wix/design-system/dist/testkit/unidriver';
 import { baseUniDriverFactory } from '../../../../unidriver';
 
 export function UrlViewUniDriver(base: UniDriver, body: UniDriver) {
-  const linkButton = TextButtonUniDriver(
+  const linkButton = IconButtonUniDriver(
     base.$('[data-hook="open-link-button"]'),
     body,
   );
@@ -12,7 +12,10 @@ export function UrlViewUniDriver(base: UniDriver, body: UniDriver) {
     ...baseUniDriverFactory(base),
     getValue: () => base.text(),
     hasOpenLinkButton: () => linkButton.exists(),
-    getLinkHref: () => linkButton.getHref(),
+    getLinkHref: () =>
+      base
+        .$('[data-hook="open-link-button"]')
+        .attr('href') as Promise<string>,
     clickOpenLink: () => linkButton.click(),
   };
 }

package/src/components/EditableTable/cellTypes/url/index.ts

@@ -4,8 +4,24 @@ import { UrlEdit } from './Edit';
 
 export { UrlView, UrlEdit };
 
+const URL_PROTOCOL_RE = /^https?:\/\//;
 const URL_PATTERN = /^(https?:\/\/)?([\w-]+\.)+[\w-]+(\/[\w-./?%&=]*)?$/;
 
+/** Auto-prepend https:// on commit.
+ *  - Has protocol → unchanged
+ *  - No dot → append .com then prepend https://  (e.g. "example" → "https://example.com")
+ *  - Has dot, no protocol → prepend https://  (e.g. "example.com" → "https://example.com")
+ */
+function normalizeUrlOnCommit(value: string): string {
+  if (!value) return value;
+  if (URL_PROTOCOL_RE.test(value)) return value;
+  let normalized = value;
+  if (!normalized.includes('.')) {
+    normalized = `${normalized}.com`;
+  }
+  return `https://${normalized}`;
+}
+
 export const urlCellType = defineCellType<string>({
   type: 'url',
   ViewComponent: UrlView,
@@ -20,5 +36,7 @@ export const urlCellType = defineCellType<string>({
   },
   editable: true,
   clearable: true,
+  // Replace the current value with the typed key (same behaviour as text/email).
   onTypeToEdit: ({ key }) => ({ value: key }),
+  normalizeOnCommit: normalizeUrlOnCommit,
 });

package/src/components/EditableTable/headerActionTypes.ts

@@ -0,0 +1,16 @@
+import type { ReactNode } from 'react';
+
+export interface HeaderAction {
+  /** The text label of the action item. */
+  label: string;
+  /** Handler called when the action is clicked. */
+  onClick: () => void;
+  /** An icon to display before the text. */
+  icon?: ReactNode;
+  /** Disables the action both visually and functionally. */
+  disabled?: boolean;
+  /** Tooltip text shown when the action is disabled. */
+  disabledTooltip?: string;
+  /** Visual style — 'dark' (default) or 'destructive' (red). */
+  skin?: 'dark' | 'destructive';
+}

package/src/components/EditableTable/index.ts

@@ -1,2 +1,3 @@
 export * from './EditableTable';
 export { defineCellType } from './types';
+export type { CellViewProps, CellEditProps } from './types';

package/src/components/EditableTable/types.ts

@@ -3,6 +3,7 @@ import type { CellType, ValidationRule } from '../../state/EditableTable/types';
 export interface CellViewProps<V> {
   value: V;
   typeConfig?: unknown;
+  validation?: ValidationRule[];
 }
 
 export interface Focusable {
@@ -18,7 +19,9 @@ export interface CellEditProps<V> {
   inputRef?: React.MutableRefObject<Focusable | undefined | null>;
   typeConfig?: unknown;
   /** How edit mode was triggered. Edit components can use this to customize behavior (e.g., date picker auto-opens on 'type'). */
-  editTrigger?: 'type' | 'enter' | 'doubleClick' | null;
+  editTrigger?: { kind: 'type'; key: string } | 'enter' | 'doubleClick' | null;
+  /** Column-level validation rules. Edit components can derive UI behavior (e.g., maxLength blocking/tooltip) from these. */
+  validation?: ValidationRule[];
 }
 
 /** Type-safe factory for defining cell types. V ensures all value-typed fields are consistent. */
@@ -32,7 +35,8 @@ export function defineCellType<V>(cellType: {
   editable?: boolean;
   clearable?: boolean;
   toggleValue?: (value: V) => V;
-  onTypeToEdit?: (params: { key: string }) => { value?: V } | undefined;
+  onTypeToEdit?: (params: { key: string; validation?: ValidationRule[] }) => { value?: V } | undefined;
+  normalizeOnCommit?: (value: V) => V;
 }): CellType {
   return cellType;
 }

package/src/components/EditableTable/useBuiltInHeaderActions.tsx

@@ -0,0 +1,96 @@
+import React, { useMemo, type ReactNode } from 'react';
+import {
+  SortAscendingSmall,
+  SortDescendingSmall,
+  ContentFilterSmall,
+  HiddenSmall,
+} from '@wix/wix-ui-icons-common';
+import type { FiltersMap } from '@wix/bex-core';
+import type { EditableTableState } from '../../state/EditableTable';
+import type { EditableColumn } from '../../state/EditableTable/types';
+import type { HeaderAction } from './headerActionTypes';
+import { HeaderActionsPopover } from './HeaderActionsPopover';
+
+export function useBuiltInHeaderActions<T, F extends FiltersMap>(
+  state: EditableTableState<T, F>,
+  columns: EditableColumn<T>[],
+  disabled?: boolean,
+): Record<string, ReactNode> {
+  const { toolbar } = state;
+  const { customColumnsState, panels, toolbarFiltersState } = toolbar;
+
+  return useMemo(() => {
+    if (disabled) {
+      return {};
+    }
+
+    const result: Record<string, ReactNode> = {};
+
+    for (const col of columns) {
+      const groups: HeaderAction[][] = [];
+
+      // Group 1: Sort actions
+      if (col.sortable) {
+        groups.push([
+          {
+            label: 'Sort Ascending',
+            icon: <SortAscendingSmall />,
+            onClick: () => state.sort(col.id, { forceDirection: 'asc' }),
+          },
+          {
+            label: 'Sort Descending',
+            icon: <SortDescendingSmall />,
+            onClick: () => state.sort(col.id, { forceDirection: 'desc' }),
+          },
+        ]);
+      }
+
+      // Group 2: Filter action (only when filter exists for this column)
+      const hasFilter =
+        toolbarFiltersState &&
+        state.collection.query.customFilters[col.id] != null;
+      if (hasFilter) {
+        groups.push([
+          {
+            label: 'Filter',
+            icon: <ContentFilterSmall />,
+            onClick: () => panels.openSidePanel('filters'),
+          },
+        ]);
+      }
+
+      // Group 3: Hide column action
+      if (col.hideable !== false && customColumnsState) {
+        const column = toolbar.columns.find((c) => c.id === col.id);
+        if (column) {
+          groups.push([
+            {
+              label: 'Hide Column',
+              icon: <HiddenSmall />,
+              onClick: () => customColumnsState.onColumnCheckboxToggle(column),
+            },
+          ]);
+        }
+      }
+
+      if (groups.length > 0) {
+        result[col.id] = (
+          <HeaderActionsPopover
+            actions={groups}
+            dataHook={`header-actions-${col.id}`}
+          />
+        );
+      }
+    }
+
+    return result;
+  }, [
+    state,
+    columns,
+    toolbar,
+    customColumnsState,
+    panels,
+    toolbarFiltersState,
+    disabled,
+  ]);
+}

package/src/components/EditableTable/useCellFocusAndEditing.ts

@@ -20,7 +20,7 @@ export function useCellFocusAndEditing<T, F extends FiltersMap>({
 }: UseCellFocusAndEditingParams<T, F>) {
   const { cellInteraction } = state;
   const column = state._columnMap.get(columnId);
-  const resolved = column ? state.resolveCellType(column.cellType) : null;
+  const resolved = column ? state.resolveCellTypeByColumnId(column.id) : null;
   const isFocused = cellInteraction.isCellFocused(rowKey, columnId);
   const isEditing = cellInteraction.isCellEditing(rowKey, columnId);
   const isEditable = state.isCellEditable(rowKey, columnId);
@@ -125,13 +125,16 @@ export function useCellFocusAndEditing<T, F extends FiltersMap>({
 
         // Key-level gate: onTypeToEdit returning undefined means "block this key"
         // (e.g. number blocks non-digit keys).
-        const typeResult = resolved.onTypeToEdit({ key: e.key });
+        const typeResult = resolved.onTypeToEdit({
+          key: e.key,
+          validation: column?.validation,
+        });
         if (typeResult === undefined) {
           return;
         }
 
         e.preventDefault();
-        cellInteraction.startEdit(undefined, undefined, 'type');
+        cellInteraction.startEdit(undefined, undefined, { kind: 'type', key: e.key });
 
         if ('value' in typeResult) {
           // Cell type provides an explicit pre-populated value (e.g. first typed

package/src/components/EditableTable/useKeyboardNavigation.ts

@@ -66,14 +66,16 @@ export function useKeyboardNavigation<T, F extends FiltersMap>(
           }
           navigated = true;
           break;
-        case 'Escape':
+        case 'Escape': {
+          const handledByEditor = e.defaultPrevented;
           e.preventDefault();
           if (clipboard.hasCopiedCells) {
             clipboard.clear();
-          } else {
+          } else if (!handledByEditor) {
             cellInteraction.clearFocus();
           }
           break;
+        }
         case 'Delete':
         case 'Backspace':
           e.preventDefault();

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "EntityPagePlain3492012727";
+var _namespace_ = "EntityPagePlain1477466796";
 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":"EntityPagePlain3492012727__root"};
+export var classes = {"root":"EntityPagePlain1477466796__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_ = "Fade2782678393";
+var _namespace_ = "Fade3161725745";
 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":"Fade2782678393__root"};
+export var classes = {"root":"Fade3161725745__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_ = "Heading810863429";
+var _namespace_ = "Heading4066011626";
 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":"Heading810863429__root"};
+export var classes = {"root":"Heading4066011626__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/ImportButton/ImportStepUpload.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ImportStepUpload2236557936";
+var _namespace_ = "ImportStepUpload3407014856";
 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":"ImportStepUpload2236557936__root","fileUpload":"ImportStepUpload2236557936__fileUpload"};
+export var classes = {"root":"ImportStepUpload3407014856__root","fileUpload":"ImportStepUpload3407014856__fileUpload"};
 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_ = "InputOverflow3231423377";
+var _namespace_ = "InputOverflow796619643";
 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":"InputOverflow3231423377__root"};
+export var classes = {"root":"InputOverflow796619643__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_ = "LoadingRow3990858";
+var _namespace_ = "LoadingRow3074046361";
 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":"LoadingRow3990858__root"};
-export var keyframes = {"gradientSwoosh":"LoadingRow3990858__gradientSwoosh"}; 
+export var classes = {"root":"LoadingRow3074046361__root"};
+export var keyframes = {"gradientSwoosh":"LoadingRow3074046361__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_ = "MaxHeightText2759772886";
+var _namespace_ = "MaxHeightText3524921945";
 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":"MaxHeightText2759772886__root"};
+export var classes = {"root":"MaxHeightText3524921945__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_ = "MaxLines2972849232";
+var _namespace_ = "MaxLines533725587";
 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":"MaxLines2972849232__root"};
+export var classes = {"root":"MaxLines533725587__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_ = "MultiBulkActionToolbar2420183688";
+var _namespace_ = "MultiBulkActionToolbar987391231";
 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":"MultiBulkActionToolbar2420183688__root","leftGroupWrapper":"MultiBulkActionToolbar2420183688__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar2420183688__selectedCountItem","selectedCountText":"MultiBulkActionToolbar2420183688__selectedCountText"};
+export var classes = {"root":"MultiBulkActionToolbar987391231__root","leftGroupWrapper":"MultiBulkActionToolbar987391231__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar987391231__selectedCountItem","selectedCountText":"MultiBulkActionToolbar987391231__selectedCountText"};
 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_ = "NestedTablePlaceholderStatesRow3319895139";
+var _namespace_ = "NestedTablePlaceholderStatesRow2052232166";
 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":"NestedTablePlaceholderStatesRow3319895139__root"};
+export var classes = {"root":"NestedTablePlaceholderStatesRow2052232166__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_ = "NestedTableRow3299939426";
+var _namespace_ = "NestedTableRow2825305898";
 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":"NestedTableRow3299939426__root","firstLevel":"NestedTableRow3299939426__firstLevel","placeholder":"NestedTableRow3299939426__placeholder","parentHovered":"NestedTableRow3299939426__parentHovered"};
+export var classes = {"root":"NestedTableRow2825305898__root","firstLevel":"NestedTableRow2825305898__firstLevel","placeholder":"NestedTableRow2825305898__placeholder","parentHovered":"NestedTableRow2825305898__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_ = "MultipleDragOverlayEffect312660433";
+var _namespace_ = "MultipleDragOverlayEffect1055905225";
 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":"MultipleDragOverlayEffect312660433__root"};
+export var classes = {"root":"MultipleDragOverlayEffect1055905225__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_ = "NestedTableDragAndDropRow2206630667";
+var _namespace_ = "NestedTableDragAndDropRow1377215563";
 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":"NestedTableDragAndDropRow2206630667__root"};
+export var classes = {"root":"NestedTableDragAndDropRow1377215563__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "PickerContent2384689736";
+var _namespace_ = "PickerContent3155415999";
 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":"PickerContent2384689736__root"};
+export var classes = {"root":"PickerContent3155415999__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_ = "PickerContentAdditionalStep2818293485";
+var _namespace_ = "PickerContentAdditionalStep3594605053";
 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":"PickerContentAdditionalStep2818293485__root","titles":"PickerContentAdditionalStep2818293485__titles","suffix":"PickerContentAdditionalStep2818293485__suffix"};
+export var classes = {"root":"PickerContentAdditionalStep3594605053__root","titles":"PickerContentAdditionalStep3594605053__titles","suffix":"PickerContentAdditionalStep3594605053__suffix"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "PickerTableListItem2916633825";
+var _namespace_ = "PickerTableListItem2502883508";
 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":"PickerTableListItem2916633825__root"};
+export var classes = {"root":"PickerTableListItem2502883508__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_ = "ScrollableContent3827443796";
+var _namespace_ = "ScrollableContent554818587";
 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":"ScrollableContent3827443796__root"};
+export var classes = {"root":"ScrollableContent554818587__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_ = "SkeletonCard1215955230";
+var _namespace_ = "SkeletonCard3797804032";
 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":"SkeletonCard1215955230__root","headerLoading":"SkeletonCard1215955230__headerLoading"};
+export var classes = {"root":"SkeletonCard3797804032__root","headerLoading":"SkeletonCard3797804032__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_ = "SlidingModal2881455252";
+var _namespace_ = "SlidingModal2756128921";
 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":"SlidingModal2881455252__root"};
+export var classes = {"root":"SlidingModal2756128921__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_ = "TabsFilter3422538499";
+var _namespace_ = "TabsFilter2255324386";
 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":"TabsFilter3422538499__root","title":"TabsFilter3422538499__title"};
+export var classes = {"root":"TabsFilter2255324386__root","title":"TabsFilter2255324386__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_ = "ManageTagsModal292114332";
+var _namespace_ = "ManageTagsModal191798250";
 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":"ManageTagsModal292114332__root"};
+export var classes = {"root":"ManageTagsModal191798250__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};