@wix/patterns 1.481.0 → 1.482.0

package/src/components/EditableTable/cellTypes/text/Edit.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit3788367266";
+var _namespace_ = "Edit136882343";
 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":"Edit3788367266__root","editWrapper":"Edit3788367266__editWrapper","inputArea":"Edit3788367266__inputArea"};
+export var classes = {"root":"Edit136882343__root","editWrapper":"Edit136882343__editWrapper","inputArea":"Edit136882343__inputArea"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EditableTable/cellTypes/text/Edit.tsx

@@ -7,6 +7,7 @@ import {
 import type { CellEditProps } from '../../types';
 import type { ValidationRule } from '../../../../state/EditableTable/types';
 import { useCloseOnAncestorScroll } from '../../../../hooks/useCloseOnAncestorScroll';
+import { useCommitOnEnter } from '../useCommitOnEnter';
 import { st, classes } from './Edit.st.css.js';
 
 function getMaxLength(validation?: ValidationRule[]) {
@@ -132,11 +133,14 @@ const TextEditSpecificValues: React.FC<
     [onCancel],
   );
 
+  const handleKeyDown = useCommitOnEnter(onCommit);
+
   return (
     <div
       ref={wrapperRef}
       className={classes.editWrapper}
       onKeyDownCapture={handleKeyDownCapture}
+      onKeyDown={handleKeyDown}
     >
       <CellAutoCompleteInput
         ref={acHandle}

package/src/components/EditableTable/cellTypes/text/View.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "View716379435";
+var _namespace_ = "View1836553263";
 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":"View716379435__root"};
+export var classes = {"root":"View1836553263__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EditableTable/cellTypes/time/Edit.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit4054952893";
+var _namespace_ = "Edit1256572773";
 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":"Edit4054952893__root","wrapper":"Edit4054952893__wrapper","overlay":"Edit4054952893__overlay"};
+export var classes = {"root":"Edit1256572773__root","wrapper":"Edit1256572773__wrapper","overlay":"Edit1256572773__overlay"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EditableTable/cellTypes/time/Edit.tsx

@@ -7,6 +7,7 @@ import {
 import type { TimeInputImperativeActions } from '@wix/design-system';
 import type { CellEditProps } from '../../types';
 import { useCloseOnAncestorScroll } from '../../../../hooks/useCloseOnAncestorScroll';
+import { useCommitOnEnter } from '../useCommitOnEnter';
 import { CellViewLayout } from '../CellViewLayout';
 import { classes } from './Edit.st.css.js';
 
@@ -37,10 +38,13 @@ export const TimeEdit: React.FC<CellEditProps<Time | null>> = ({
     [onCancel],
   );
 
+  const handleKeyDown = useCommitOnEnter(onCommit);
+
   return (
     <div
       ref={wrapperRef}
       onKeyDownCapture={handleKeyDownCapture}
+      onKeyDown={handleKeyDown}
       className={classes.wrapper}
     >
       <CellTimeInput

package/src/components/EditableTable/cellTypes/url/Edit.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "Edit3991289292";
+var _namespace_ = "Edit2131823535";
 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":"Edit3991289292__root","urlInput":"Edit3991289292__urlInput"};
+export var classes = {"root":"Edit2131823535__root","urlInput":"Edit2131823535__urlInput"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EditableTable/cellTypes/url/View.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "View4154240120";
+var _namespace_ = "View3239557871";
 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":"View4154240120__root","textView":"View4154240120__textView","urlText":"View4154240120__urlText","suffix":"View4154240120__suffix"};
+export var classes = {"root":"View3239557871__root","textView":"View3239557871__textView","urlText":"View3239557871__urlText","suffix":"View3239557871__suffix"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/EditableTable/cellTypes/useCommitOnEnter.ts

@@ -0,0 +1,19 @@
+import type React from 'react';
+import { useCallback } from 'react';
+
+/**
+ * Bubble-phase keydown handler that commits on Enter. Put it on a wrapper
+ * around an input with a dropdown: by the time it runs, the input has already
+ * applied a highlighted option (which commits on its own), so this commits
+ * the unchanged value. The input's own `onKeyDown` prop runs too early.
+ */
+export function useCommitOnEnter(onCommit: () => void) {
+  return useCallback(
+    (e: React.KeyboardEvent) => {
+      if (e.key === 'Enter') {
+        onCommit();
+      }
+    },
+    [onCommit],
+  );
+}

package/src/components/EditableTable/cellTypes/useMultilineEditKeyboard.ts

@@ -0,0 +1,39 @@
+import type React from 'react';
+import { useCallback, useRef } from 'react';
+
+/**
+ * Keys for a multi-line cell editor: Enter commits, Shift+Enter adds a new
+ * line, Escape cancels. Blur commits unless one of those already ended the edit.
+ */
+export function useMultilineEditKeyboard({
+  onCommit,
+  onCancel,
+}: {
+  onCommit: () => void;
+  onCancel: () => void;
+}) {
+  const endedRef = useRef(false);
+
+  const handleKeyDown = useCallback(
+    (e: React.KeyboardEvent) => {
+      if (e.key === 'Escape') {
+        e.preventDefault();
+        endedRef.current = true;
+        onCancel();
+      } else if (e.key === 'Enter' && !e.shiftKey) {
+        e.preventDefault();
+        endedRef.current = true;
+        onCommit();
+      }
+    },
+    [onCancel, onCommit],
+  );
+
+  const handleBlur = useCallback(() => {
+    if (!endedRef.current) {
+      onCommit();
+    }
+  }, [onCommit]);
+
+  return { handleKeyDown, handleBlur };
+}

package/src/components/EditableTable/useCellFocusAndEditing.ts

@@ -25,6 +25,7 @@ export function useCellFocusAndEditing<T, F extends FiltersMap>({
   const isFocused = cellInteraction.isCellFocused(rowKey, columnId);
   const isEditing = cellInteraction.isCellEditing(rowKey, columnId);
   const isEditable = state.isCellEditable(rowKey, columnId);
+  const isToggle = !!resolved?.toggleValue;
 
   // Register the focused cell's DOM element on the state so
   // scrollFocusedCellIntoView can use it. useLayoutEffect ensures
@@ -68,7 +69,13 @@ export function useCellFocusAndEditing<T, F extends FiltersMap>({
           | HTMLInputElement
           | HTMLTextAreaElement
           | null;
-        if (!input || !('selectionStart' in input)) {
+        // selectionStart is null for inputs without a caret (e.g. checkbox),
+        // and setSelectionRange throws on them.
+        if (
+          !input ||
+          !('selectionStart' in input) ||
+          input.selectionStart == null
+        ) {
           return;
         }
         if (input.selectionStart !== input.selectionEnd) {
@@ -80,20 +87,14 @@ export function useCellFocusAndEditing<T, F extends FiltersMap>({
     } else {
       // Don't steal focus if a descendant already has it (e.g. image cell's
       // inner-focus buttons). The gridcell only needs focusing when it isn't
-      // already within the active focus subtree.
-      if (!cellRef.current?.contains(document.activeElement)) {
+      // already within the active focus subtree. Toggle cells are the
+      // exception: their control stays rendered after the edit ends, and
+      // leaving focus on it would keep its focus ring.
+      if (isToggle || !cellRef.current?.contains(document.activeElement)) {
         cellRef.current?.focus({ preventScroll: true });
       }
     }
-  }, [isFocused, isEditing, cellRef, editInputRef]);
-
-  const handleActivate = useCallback(() => {
-    if (resolved?.toggleValue) {
-      state.cellValue.toggleCell(rowKey, columnId);
-    } else {
-      cellInteraction.startEdit();
-    }
-  }, [resolved, state, rowKey, columnId, cellInteraction]);
+  }, [isFocused, isEditing, isToggle, cellRef, editInputRef]);
 
   // Handle Enter and type-to-edit at the cell level
   const onKeyDown = useCallback(
@@ -115,7 +116,9 @@ export function useCellFocusAndEditing<T, F extends FiltersMap>({
           // needs to be true for useClearFocusOnBlur protection.
           editInputRef.current?.focus();
         } else {
-          handleActivate();
+          // Toggle cells too: the first Enter focuses the control, the second
+          // toggles it.
+          cellInteraction.startEdit();
         }
         return;
       }
@@ -197,7 +200,6 @@ export function useCellFocusAndEditing<T, F extends FiltersMap>({
       state,
       cellInteraction,
       resolved,
-      handleActivate,
     ],
   );
 

package/src/components/EmptyState/EmptyStateBase.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "EmptyStateBase2686840201";
+var _namespace_ = "EmptyStateBase3316164224";
 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":"EmptyStateBase2686840201__root"};
+export var classes = {"root":"EmptyStateBase3316164224__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_ = "EntityPagePlain907640231";
+var _namespace_ = "EntityPagePlain1697787572";
 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":"EntityPagePlain907640231__root"};
+export var classes = {"root":"EntityPagePlain1697787572__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_ = "Fade54617898";
+var _namespace_ = "Fade1078031253";
 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":"Fade54617898__root"};
+export var classes = {"root":"Fade1078031253__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_ = "Heading2348009961";
+var _namespace_ = "Heading3651262422";
 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":"Heading2348009961__root"};
+export var classes = {"root":"Heading3651262422__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_ = "ImportStepUpload3960496831";
+var _namespace_ = "ImportStepUpload3876726005";
 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":"ImportStepUpload3960496831__root","fileUpload":"ImportStepUpload3960496831__fileUpload"};
+export var classes = {"root":"ImportStepUpload3876726005__root","fileUpload":"ImportStepUpload3876726005__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_ = "InputOverflow381691028";
+var _namespace_ = "InputOverflow1901873362";
 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":"InputOverflow381691028__root"};
+export var classes = {"root":"InputOverflow1901873362__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_ = "LoadingRow1119038160";
+var _namespace_ = "LoadingRow1630393075";
 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":"LoadingRow1119038160__root"};
-export var keyframes = {"gradientSwoosh":"LoadingRow1119038160__gradientSwoosh"}; 
+export var classes = {"root":"LoadingRow1630393075__root"};
+export var keyframes = {"gradientSwoosh":"LoadingRow1630393075__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_ = "MaxHeightText952229698";
+var _namespace_ = "MaxHeightText3317440117";
 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":"MaxHeightText952229698__root"};
+export var classes = {"root":"MaxHeightText3317440117__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_ = "MaxLines3960894775";
+var _namespace_ = "MaxLines683350652";
 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":"MaxLines3960894775__root"};
+export var classes = {"root":"MaxLines683350652__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_ = "MultiBulkActionToolbar629827729";
+var _namespace_ = "MultiBulkActionToolbar1374359917";
 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":"MultiBulkActionToolbar629827729__root","leftGroupWrapper":"MultiBulkActionToolbar629827729__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar629827729__selectedCountItem","selectedCountText":"MultiBulkActionToolbar629827729__selectedCountText"};
+export var classes = {"root":"MultiBulkActionToolbar1374359917__root","leftGroupWrapper":"MultiBulkActionToolbar1374359917__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar1374359917__selectedCountItem","selectedCountText":"MultiBulkActionToolbar1374359917__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_ = "NestedTablePlaceholderStatesRow3297893429";
+var _namespace_ = "NestedTablePlaceholderStatesRow1683735060";
 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":"NestedTablePlaceholderStatesRow3297893429__root"};
+export var classes = {"root":"NestedTablePlaceholderStatesRow1683735060__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_ = "NestedTableRow3852827795";
+var _namespace_ = "NestedTableRow3763711894";
 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":"NestedTableRow3852827795__root","firstLevel":"NestedTableRow3852827795__firstLevel","placeholder":"NestedTableRow3852827795__placeholder","parentHovered":"NestedTableRow3852827795__parentHovered"};
+export var classes = {"root":"NestedTableRow3763711894__root","firstLevel":"NestedTableRow3763711894__firstLevel","placeholder":"NestedTableRow3763711894__placeholder","parentHovered":"NestedTableRow3763711894__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_ = "MultipleDragOverlayEffect2720097722";
+var _namespace_ = "MultipleDragOverlayEffect2380643530";
 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":"MultipleDragOverlayEffect2720097722__root"};
+export var classes = {"root":"MultipleDragOverlayEffect2380643530__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_ = "NestedTableDragAndDropRow2357030032";
+var _namespace_ = "NestedTableDragAndDropRow1669533361";
 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":"NestedTableDragAndDropRow2357030032__root"};
+export var classes = {"root":"NestedTableDragAndDropRow1669533361__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_ = "PickerContent3835555913";
+var _namespace_ = "PickerContent276930412";
 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":"PickerContent3835555913__root"};
+export var classes = {"root":"PickerContent276930412__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_ = "PickerContentAdditionalStep1565660059";
+var _namespace_ = "PickerContentAdditionalStep4012172053";
 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":"PickerContentAdditionalStep1565660059__root","titles":"PickerContentAdditionalStep1565660059__titles","suffix":"PickerContentAdditionalStep1565660059__suffix"};
+export var classes = {"root":"PickerContentAdditionalStep4012172053__root","titles":"PickerContentAdditionalStep4012172053__titles","suffix":"PickerContentAdditionalStep4012172053__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_ = "PickerTableListItem3691791785";
+var _namespace_ = "PickerTableListItem2221242724";
 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":"PickerTableListItem3691791785__root"};
+export var classes = {"root":"PickerTableListItem2221242724__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/SchemaCard/SchemaCard.tsx

@@ -109,7 +109,7 @@ function _SchemaCard({
         <Box padding="SP4" boxSizing="border-box" width="100%">
           <TextButton
             dataHook="schema-card-add-field"
-            onClick={schemaContext.addField}
+            onClick={() => schemaContext.addField?.('Custom fields widget')}
             prefixIcon={<Add />}
           >
             {t('cairo.customFields.addCustomField.CTA')}

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ScrollableContent2896732993";
+var _namespace_ = "ScrollableContent2076862891";
 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":"ScrollableContent2896732993__root"};
+export var classes = {"root":"ScrollableContent2076862891__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "SetupWidget4239370517";
+var _namespace_ = "SetupWidget741893811";
 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":"SetupWidget4239370517__root","row":"SetupWidget4239370517__row","completedCta":"SetupWidget4239370517__completedCta","secondaryCta":"SetupWidget4239370517__secondaryCta","card":"SetupWidget4239370517__card","stepIcon":"SetupWidget4239370517__stepIcon","chevron":"SetupWidget4239370517__chevron","chevronDisabled":"SetupWidget4239370517__chevronDisabled","inProgressLabel":"SetupWidget4239370517__inProgressLabel"};
+export var classes = {"root":"SetupWidget741893811__root","row":"SetupWidget741893811__row","completedCta":"SetupWidget741893811__completedCta","secondaryCta":"SetupWidget741893811__secondaryCta","card":"SetupWidget741893811__card","stepIcon":"SetupWidget741893811__stepIcon","chevron":"SetupWidget741893811__chevron","chevronDisabled":"SetupWidget741893811__chevronDisabled","inProgressLabel":"SetupWidget741893811__inProgressLabel"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};