@wix/patterns 1.396.0 → 1.398.0

package/src/components/StatusToastFromConfig/StatusToastFromConfig.tsx

@@ -0,0 +1,63 @@
+import React, { useMemo } from 'react';
+import { ToastConfig, ToastType } from '@wix/bex-core';
+import { StatusToast } from '@wix/design-system';
+
+const TOAST_TYPE_TO_STATUS: {
+  [key in ToastType]?: 'success' | 'error' | 'warning' | 'info';
+} = {
+  STANDARD: 'info',
+  PREMIUM: 'info',
+  SUCCESS: 'success',
+  WARNING: 'warning',
+  ERROR: 'error',
+};
+
+interface StatusToastFromConfigProps {
+  config: ToastConfig;
+  onClose: () => void;
+  dataHook?: string;
+  messageDataHook?: string;
+  actionDataHook?: string;
+}
+
+export const StatusToastFromConfig = ({
+  config,
+  onClose,
+  dataHook,
+  messageDataHook,
+  actionDataHook,
+}: StatusToastFromConfigProps) => {
+  const action = useMemo(() => {
+    if (!config.action?.text) {
+      return undefined;
+    }
+    const handleClick = () => {
+      config.action?.onClick?.();
+      if (config.action?.removeToastOnClick) {
+        onClose();
+      }
+    };
+    return (
+      <StatusToast.Action dataHook={actionDataHook} onClick={handleClick}>
+        {config.action.text}
+      </StatusToast.Action>
+    );
+  }, [config, onClose, actionDataHook]);
+
+  return (
+    <StatusToast
+      key={config.biName ?? config.message}
+      dataHook={dataHook}
+      status={TOAST_TYPE_TO_STATUS[config.type ?? 'STANDARD']}
+      dismissible
+      onDismiss={onClose}
+      action={action}
+    >
+      {messageDataHook ? (
+        <span data-hook={messageDataHook}>{config.message}</span>
+      ) : (
+        config.message
+      )}
+    </StatusToast>
+  );
+};

package/src/components/StatusToastFromConfig/index.ts

@@ -0,0 +1 @@
+export { StatusToastFromConfig } from './StatusToastFromConfig';

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "TabsFilter3114357314";
+var _namespace_ = "TabsFilter2923604144";
 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":"TabsFilter3114357314__root","title":"TabsFilter3114357314__title"};
+export var classes = {"root":"TabsFilter2923604144__root","title":"TabsFilter2923604144__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_ = "ManageTagsModal3565466423";
+var _namespace_ = "ManageTagsModal4026655041";
 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":"ManageTagsModal3565466423__root"};
+export var classes = {"root":"ManageTagsModal4026655041__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/Tags/ManageTags/ManageTagsModal/ManageTagsNotification.tsx

@@ -1,6 +1,6 @@
-import React, { useMemo } from 'react';
-import { ToastConfig, ToastType } from '@wix/bex-core';
-import { StatusToast } from '@wix/design-system';
+import React from 'react';
+import { ToastConfig } from '@wix/bex-core';
+import { StatusToastFromConfig } from '../../../StatusToastFromConfig';
 
 interface ManageTagsNotificationProps {
   toastConfig: ToastConfig;
@@ -8,56 +8,16 @@ interface ManageTagsNotificationProps {
   dataHook?: string;
 }
 
-const toastTypeToStatus: {
-  [key in ToastType]?: 'success' | 'error' | 'warning' | 'info';
-} = {
-  STANDARD: 'info',
-  PREMIUM: 'info',
-  SUCCESS: 'success',
-  WARNING: 'warning',
-  ERROR: 'error',
-};
-
 export const ManageTagsNotification = ({
   toastConfig,
   onClose,
   dataHook,
-}: ManageTagsNotificationProps) => {
-  const actionElement = useMemo(() => {
-    if (!toastConfig.action?.text) {
-      return undefined;
-    }
-
-    const handleClick = () => {
-      toastConfig.action?.onClick?.();
-
-      if (toastConfig.action?.removeToastOnClick) {
-        onClose(toastConfig);
-      }
-    };
-
-    return (
-      <StatusToast.Action
-        dataHook="manage-tags-modal-notification-action"
-        onClick={handleClick}
-      >
-        {toastConfig.action.text}
-      </StatusToast.Action>
-    );
-  }, [toastConfig, onClose]);
-
-  return (
-    <StatusToast
-      key={toastConfig.biName ?? toastConfig.message}
-      dataHook={dataHook}
-      status={toastTypeToStatus[toastConfig.type ?? 'STANDARD']}
-      dismissible
-      onDismiss={() => onClose(toastConfig)}
-      action={actionElement}
-    >
-      <span data-hook="manage-tags-modal-notification-message">
-        {toastConfig.message}
-      </span>
-    </StatusToast>
-  );
-};
+}: ManageTagsNotificationProps) => (
+  <StatusToastFromConfig
+    config={toastConfig}
+    onClose={() => onClose(toastConfig)}
+    dataHook={dataHook}
+    messageDataHook="manage-tags-modal-notification-message"
+    actionDataHook="manage-tags-modal-notification-action"
+  />
+);

package/src/components/TagsFilter/TagsFilter.tsx

@@ -54,7 +54,11 @@ export const _TagsFilter = ({ filter }: TagsFilterProps) => {
               }),
             },
           );
-          return { items: result.items, cursor: result.cursor, hasNext: result.hasNext };
+          return {
+            items: result.items,
+            cursor: result.cursor,
+            hasNext: result.hasNext,
+          };
         },
       }
     : {

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ToolbarItem3872899738";
+var _namespace_ = "ToolbarItem227452217";
 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":"ToolbarItem3872899738__root"};
+export var classes = {"root":"ToolbarItem227452217__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_ = "ToolbarItemBox2199501219";
+var _namespace_ = "ToolbarItemBox305015988";
 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":"ToolbarItemBox2199501219__root"};
+export var classes = {"root":"ToolbarItemBox305015988__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_ = "common3686982393";
+var _namespace_ = "common3191932831";
 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":"common3686982393__root","column":"common3686982393__column","fullHeight":"common3686982393__fullHeight"};
+export var classes = {"root":"common3191932831__root","column":"common3191932831__column","fullHeight":"common3191932831__fullHeight"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/hooks/useEditableTableCollection.ts

@@ -25,6 +25,7 @@ export type EditableTableCollectionConfig<
   permissions?: EditableTablePermissions;
   mutations: EditableTableMutationHandlers<T>;
   fieldActions?: FieldActions;
+  refresh?: () => Promise<void>;
   optimisticActionParams?: Partial<CollectionOptimisticActionsBaseParams<T, F>>;
   /**
    * Additional cell types to register alongside the built-in ones.
@@ -54,6 +55,7 @@ export const useEditableTableCollection: EditableTableCollection = <
       permissions: config.permissions,
       mutations: config.mutations,
       fieldActions: config.fieldActions,
+      refresh: config.refresh,
       extraCellTypes: config.extraCellTypes,
       createOptimisticActions: (collection) =>
         createOptimisticActions(collection, config.optimisticActionParams),

package/src/hooks/useFilterCollectionStates.tsx

@@ -48,7 +48,11 @@ export function useFilterCollectionStates<T, F extends FiltersMap>(
     </Box>
   );
 
-  if (collection.showInitialLoader || collection.result.status.isLoading) {
+  if (
+    collection.showInitialLoader ||
+    collection.result.status.isLoading ||
+    collection.showRefreshLoader
+  ) {
     return {
       showInitialLoader: true,
       fixedFooter: getFixedFooter('initial-loader', <Loader size="small" />),

package/src/state/CollectionPage/CollectionPageHeader.st.css.ts

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

package/src/state/EditableTable/EditableTableState.ts

@@ -16,7 +16,7 @@ import { CellInteractionState } from './CellInteractionState';
 import { CellValueState } from './CellValueState';
 import { ClipboardState } from './ClipboardState';
 import { MutationState } from './MutationState';
-import { FieldActionsState } from './FieldActionsState';
+import { FieldActionsState } from '../FieldActionsState';
 import type { EditableTableMutationHandlers } from './MutationState';
 import type { Cell, CellType, EditableColumn, ValidationResult } from './types';
 import type { FieldActions } from '../../types/SchemaConfig';
@@ -38,6 +38,7 @@ export interface EditableTableStateParams<T, F extends FiltersMap> {
   readonly permissions?: EditableTablePermissions;
   readonly mutations: EditableTableMutationHandlers<T>;
   readonly fieldActions?: FieldActions;
+  readonly refresh?: () => Promise<void>;
   readonly createOptimisticActions: (
     collection: CollectionState<T, F>,
   ) => CollectionOptimisticActions<T, F>;
@@ -120,6 +121,7 @@ export class EditableTableState<T, F extends FiltersMap>
       params.fieldActions,
       params.permissions?.fieldActions,
       params.collection.showToast,
+      params.refresh,
     );
 
     makeObservable(this, {

package/src/state/{EditableTable/FieldActionsState.ts → FieldActionsState.ts}

@@ -1,4 +1,4 @@
-import { action, makeObservable } from 'mobx';
+import { action, computed, makeObservable, observable } from 'mobx';
 import { ConditionalModalState, TaskState } from '@wix/bex-core';
 import type {
   RemoveToast,
@@ -7,14 +7,15 @@ import type {
   Translate,
 } from '@wix/bex-core';
 import type { MessageModalLayoutProps } from '@wix/design-system';
-import type { FieldActions } from '../../types/SchemaConfig';
-import type { EditableTableFieldActionsPermissions } from './EditableTableState';
+import type { FieldActions } from '../types/SchemaConfig';
+import type { FieldActionPermissions } from '../components/FieldActions';
 
 export class FieldActionsState {
-  readonly handlers: FieldActions | undefined;
-  readonly permissions: EditableTableFieldActionsPermissions | undefined;
+  handlers: FieldActions | undefined;
+  permissions: FieldActionPermissions | undefined;
   readonly translate: Translate;
   readonly showToast: ShowToast | undefined;
+  private _refresh: (() => Promise<void>) | undefined;
 
   private _currentToastRemove: RemoveToast | undefined;
 
@@ -29,21 +30,55 @@ export class FieldActionsState {
   constructor(
     translate: Translate,
     handlers?: FieldActions,
-    permissions?: EditableTableFieldActionsPermissions,
+    permissions?: FieldActionPermissions,
     showToast?: ShowToast,
+    refresh?: () => Promise<void>,
   ) {
     this.translate = translate;
     this.handlers = handlers;
     this.permissions = permissions;
     this.showToast = showToast;
+    this._refresh = refresh;
     makeObservable(this, {
+      handlers: observable.ref,
+      permissions: observable.ref,
+      setHandlers: action,
+      setPermissions: action,
+      setRefresh: action,
       confirmDelete: action,
       makePrimary: action,
       duplicate: action,
       duplicateWithContent: action,
+      isMakingPrimary: computed,
+      isDuplicating: computed,
+      isDuplicatingWithContent: computed,
     });
   }
 
+  setHandlers(handlers: FieldActions | undefined) {
+    this.handlers = handlers;
+  }
+
+  setPermissions(permissions: FieldActionPermissions | undefined) {
+    this.permissions = permissions;
+  }
+
+  setRefresh(refresh: (() => Promise<void>) | undefined) {
+    this._refresh = refresh;
+  }
+
+  get isMakingPrimary() {
+    return this.makePrimaryTask.status.isLoading;
+  }
+
+  get isDuplicating() {
+    return this.duplicateTask.status.isLoading;
+  }
+
+  get isDuplicatingWithContent() {
+    return this.duplicateWithContentTask.status.isLoading;
+  }
+
   private _showToast = (config: ToastConfig) => {
     if (!this.showToast) {
       return;
@@ -52,6 +87,11 @@ export class FieldActionsState {
     this._currentToastRemove = this.showToast(config).remove;
   };
 
+  private _withRefresh = async (operation: () => Promise<unknown>) => {
+    await operation();
+    await this._refresh?.();
+  };
+
   confirmDelete(fieldId: string) {
     const deleteField = this.handlers?.deleteField;
     if (!deleteField) {
@@ -75,9 +115,8 @@ export class FieldActionsState {
     if (!makePrimary || this.makePrimaryTask.status.isLoading) {
       return;
     }
-    await this.makePrimaryTask.run(
-      () => makePrimary(fieldId),
-      (err) => console.error('[EditableTable] makePrimary failed', err),
+    await this.makePrimaryTask.run(() =>
+      this._withRefresh(() => makePrimary(fieldId)),
     );
     if (this.makePrimaryTask.status.isSuccess) {
       this._showToast({
@@ -101,16 +140,11 @@ export class FieldActionsState {
 
   async duplicate(fieldId: string) {
     const duplicateField = this.handlers?.duplicateField;
-    if (
-      !duplicateField ||
-      this.duplicateTask.status.isLoading ||
-      this.duplicateWithContentTask.status.isLoading
-    ) {
+    if (!duplicateField || this.duplicateTask.status.isLoading) {
       return;
     }
-    await this.duplicateTask.run(
-      () => duplicateField(fieldId),
-      (err) => console.error('[EditableTable] duplicateField failed', err),
+    await this.duplicateTask.run(() =>
+      this._withRefresh(() => duplicateField(fieldId)),
     );
     if (this.duplicateTask.status.isSuccess) {
       this._showToast({
@@ -136,15 +170,12 @@ export class FieldActionsState {
     const duplicateFieldWithContent = this.handlers?.duplicateFieldWithContent;
     if (
       !duplicateFieldWithContent ||
-      this.duplicateWithContentTask.status.isLoading ||
-      this.duplicateTask.status.isLoading
+      this.duplicateWithContentTask.status.isLoading
     ) {
       return;
     }
-    await this.duplicateWithContentTask.run(
-      () => duplicateFieldWithContent(fieldId),
-      (err) =>
-        console.error('[EditableTable] duplicateFieldWithContent failed', err),
+    await this.duplicateWithContentTask.run(() =>
+      this._withRefresh(() => duplicateFieldWithContent(fieldId)),
     );
     if (this.duplicateWithContentTask.status.isSuccess) {
       this._showToast({
@@ -170,9 +201,8 @@ export class FieldActionsState {
     fieldId: string,
     deleteField: (id: string) => Promise<unknown>,
   ) => {
-    await this.deleteTask.run(
-      () => deleteField(fieldId),
-      (err) => console.error('[EditableTable] deleteField failed', err),
+    await this.deleteTask.run(() =>
+      this._withRefresh(() => deleteField(fieldId)),
     );
     if (this.deleteTask.status.isSuccess) {
       this.confirmModal.close();

package/src/state/FormPage/FormPageHeader.st.css.ts

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

package/src/state/LayoutSwitchState.ts

@@ -28,6 +28,7 @@ export interface SpreadsheetLayoutConfig<T, F extends FiltersMap> {
   mutations: EditableTableMutationHandlers<T>;
   permissions?: EditableTablePermissions;
   fieldActions?: FieldActions;
+  refresh?: () => Promise<void>;
   createOptimisticActions: (
     collection: CollectionState<T, F>,
   ) => CollectionOptimisticActions<T, F>;

package/src/styles.global.css

@@ -1 +1 @@
-.CardContainer1901160990__root.CardContainer1901160990--mobile{border-radius:0}.Collapse1377347991__root{transition-property:height;transition-timing-function:cubic-bezier(.4,0,.2,1)}.Collapse1377347991__exit{height:0}.CollectionPage2374563774__root [data-hook=page-header-wrapper]{--wds-space-300:18px}.CollectionPage2374563774__root.CollectionPage2374563774--mobile{--wds-page-header-padding-horizontal:0;--wds-page-header-padding-horizontal-small:0;--wds-color-fill-surface-sunken:#ffffff}.CollectionPage2374563774__root.CollectionPage2374563774--panel{overflow:hidden;position:relative}.CollectionSectionHeader421145617__summaryIcon{display:flex;color:var(--wds-color-text-standard-secondary)}.CollectionTable1303402281__root td{vertical-align:middle}.CollectionTable1303402281__root.CollectionTable1303402281--mobile td:first-child{padding-left:18px}.CollectionTable1303402281__root.CollectionTable1303402281--mobile td:last-child{padding-right:18px}.CollectionTableWSRTable92730398__root.CollectionTableWSRTable92730398--resizable table{min-width:100%}.CollectionTableWSRTable92730398__root.CollectionTableWSRTable92730398--resizable [data-hook=table-resize-handle]{right:-4px!important;z-index:1}.CollectionToolbar2549315072__left{min-width:0}.CollectionToolbar2549315072__left.CollectionToolbar2549315072--expandable{flex:auto}.CollectionToolbar2549315072__left.CollectionToolbar2549315072--title>*{width:100%}.CollectionToolbar2549315072__root.CollectionToolbar2549315072---responsiveMode-5-title .CollectionToolbar2549315072__left{flex:1 100;min-width:50px}.CollectionToolbar2549315072__root.CollectionToolbar2549315072---responsiveMode-4-tabs .CollectionToolbar2549315072__left,.CollectionToolbar2549315072__root.CollectionToolbar2549315072---responsiveMode-4-tabs .CollectionToolbar2549315072__left.CollectionToolbar2549315072--expandable{flex:1 100 auto;min-width:140px}.CollectionToolbar2549315072__root.CollectionToolbar2549315072---responsiveMode-4-tabs .CollectionToolbar2549315072__left>*{flex-shrink:1;min-width:0}.CollectionToolbar2549315072__root .CollectionToolbar2549315072__right{justify-content:flex-end!important;flex-grow:1;flex-shrink:1;flex-basis:auto}.CollectionToolbar2549315072__root.CollectionToolbar2549315072--views .CollectionToolbar2549315072__right{min-width:0;flex-grow:1;flex-shrink:0;flex-basis:0}.CollectionToolbar2549315072__root.CollectionToolbar2549315072---responsiveMode-4-tabs .CollectionToolbar2549315072__right,.CollectionToolbar2549315072__root.CollectionToolbar2549315072---responsiveMode-5-title .CollectionToolbar2549315072__right{flex:0 1 auto;min-width:0}.CollectionToolbar2549315072__root .CollectionToolbar2549315072__right.CollectionToolbar2549315072__fullWidth{margin-inline-start:0!important}.CollectionToolbar2549315072__root.CollectionToolbar2549315072--mobile{padding-right:18px;padding-left:18px}.SearchOrCustomFilter2327827903__search{min-width:140px;max-width:240px;flex:1 0}.SearchOrCustomFilter2327827903__searchMobile{justify-content:flex-end;position:absolute;right:18px}.SearchOrCustomFilter2327827903__searchMobile:not(.SearchOrCustomFilter2327827903--expandable){left:18px}.SearchOrCustomFilter2327827903__searchMobile.SearchOrCustomFilter2327827903--expandable.SearchOrCustomFilter2327827903--expanded{left:18px}.AutoCompleteReadonly872902561__root.AutoCompleteReadonly872902561--disableEditing{cursor:pointer}.AutoCompleteReadonly872902561__root.AutoCompleteReadonly872902561--disableEditing input{cursor:pointer}.ViewsDropdown1955052207__root{width:200px}.DragHandle3116975606__root{display:flex;align-items:center}.DragHandle3116975606__root:not(.DragHandle3116975606--disabled){cursor:grab;color:#a8caff}.DragHandle3116975606__root.DragHandle3116975606--disabled{color:#acafc4}.DragHandle3116975606__root:focus-visible:not(.DragHandle3116975606--disabled){outline:0;box-shadow:0 0 0 3px #a6d0ff}.DragHandle3116975606__root.DragHandle3116975606--disabled{pointer-events:none}.DragHandle3116975606__root.DragHandle3116975606--dragging:not(.DragHandle3116975606--disabled){cursor:grabbing}td:has(>.EditableCell466228143__root){position:relative;overflow:visible;min-height:24px}.EditableCell466228143__root{display:flex;align-items:center;padding:0;position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;box-sizing:border-box;outline:0;cursor:default;user-select:none;background:var(--wsr-color-D80);border:1px solid var(--wsr-color-B40)}.EditableCell466228143__root.EditableCell466228143--selected{background:rgba(56,153,236,.08)}.EditableCell466228143__root.EditableCell466228143--focused:not(.EditableCell466228143--selected){box-shadow:inset 0 0 0 2px var(--wsr-color-B10);z-index:2}.EditableCell466228143__root.EditableCell466228143--editing{background:var(--wsr-color-D80);box-shadow:inset 0 0 0 2px var(--wsr-color-B10);z-index:3;user-select:auto;overflow:visible}.EditableCell466228143__root.EditableCell466228143--editing:not(.EditableCell466228143--showEditWhenFocused){bottom:auto;min-height:100%}.EditableCell466228143__root:has([data-inner-focused]){overflow:visible;z-index:3;box-shadow:inset 0 0 0 2px var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--selectionTop:not(.EditableCell466228143--editing){border-top:2px solid var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--selectionBottom:not(.EditableCell466228143--editing){border-bottom:2px solid var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--selectionLeft:not(.EditableCell466228143--editing){border-left:2px solid var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--selectionRight:not(.EditableCell466228143--editing){border-right:2px solid var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--selectionTop.EditableCell466228143--editing.EditableCell466228143--typeToEdit{border-top:2px solid var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--selectionBottom.EditableCell466228143--editing.EditableCell466228143--typeToEdit{border-bottom:2px solid var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--selectionLeft.EditableCell466228143--editing.EditableCell466228143--typeToEdit{border-left:2px solid var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--selectionRight.EditableCell466228143--editing.EditableCell466228143--typeToEdit{border-right:2px solid var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--invalid:not(.EditableCell466228143--editing){background:rgba(229,0,77,.06)}.EditableCell466228143__root.EditableCell466228143--copiedTop:not(.EditableCell466228143--selectionTop){border-top:2px dashed var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--copiedBottom:not(.EditableCell466228143--selectionBottom){border-bottom:2px dashed var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--copiedLeft:not(.EditableCell466228143--selectionLeft){border-left:2px dashed var(--wsr-color-B10)}.EditableCell466228143__root.EditableCell466228143--copiedRight:not(.EditableCell466228143--selectionRight){border-right:2px dashed var(--wsr-color-B10)}.EditableCell466228143__validationIndicator{flex-shrink:0;margin-left:12px;margin-right:6px;color:var(--wsr-color-Y10)}.HeaderActionsPopover3636173188__root{opacity:0;transition:opacity .15s}th:hover .HeaderActionsPopover3636173188__root,.HeaderActionsPopover3636173188__root[data-menu-open=true],.HeaderActionsPopover3636173188__root:focus-within{opacity:1}.CellViewLayout2426180919__root{width:100%;height:100%;padding:9px 12px;box-sizing:border-box;display:flex;align-items:center;overflow:clip}.CellViewLayout2426180919__root>*{flex:1;min-width:0}.Edit1809996821__booleanEdit{display:flex;align-items:center;margin-left:12px}.View2022728397__booleanView{display:flex;align-items:center;margin-left:9px;pointer-events:none}.Edit3311818881__dateInput{width:100%;margin-left:-1px}.Edit2255670974__emailInput{width:100%;margin-left:-1px}.Edit737468891__numberInput{width:100%;margin-right:2px}.Edit737468891__numberInput input{text-align:right;direction:ltr}.View903115463__textView{width:100%;text-align:right}.Edit1296664024__jsonInput{width:100%;margin-left:-1px}.Edit1642995125__selectInput{width:100%}.Edit3900930784__editWrapper{width:100%}.Edit3900930784__inputArea{background-color:transparent;width:100%}.Edit3900930784__inputArea input{padding:9px 12px 8px!important;outline:0!important;border:0!important;box-sizing:border-box!important}.Edit3900930784__inputArea>div{border:0!important;border-radius:0!important;box-shadow:none!important;background-color:transparent!important;outline:0!important}.Edit3900930784__inputArea textarea{padding:9px 12px 8px!important;outline:0!important;border:0!important;box-sizing:border-box!important}.Edit3900930784__inputArea:not(.Edit3900930784--isFocused) textarea{resize:none;overflow:hidden}.Edit3900930784__inputArea:not(.Edit3900930784--isFocused) textarea::-webkit-scrollbar{display:none}.Edit2616508223__urlInput{width:100%;margin-left:-1px}.View1876394791__textView{width:100%;padding:9px 12px;display:flex;align-items:center;justify-content:space-between}.View1876394791__urlText{flex:1;min-width:0}.View1876394791__suffix{flex-shrink:0;margin-left:10px}.View1876394791__textView.View1876394791--suffixOnHover:not(:hover) .View1876394791__suffix{display:none}.EntityPagePlain2511895562__root.EntityPagePlain2511895562--mobile{--wds-page-header-padding-horizontal:0}.Fade466847378__root{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);opacity:1}.Fade466847378__root.Fade466847378--exit{opacity:0}.Heading960239612__root{visibility:visible}.Heading960239612__root.Heading960239612--appearanceH2{font-size:28px!important;line-height:36px!important}.ImportStepUpload112089049__fileUpload{width:100%}.InputOverflow1496299731__root.InputOverflow1496299731--selected:not(.InputOverflow1496299731--focused) input::placeholder{color:#000624}@keyframes LoadingRow3229587494__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%}}.LoadingRow3229587494__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:LoadingRow3229587494__gradientSwoosh 2s ease-out infinite alternate}.MaxHeightText3447576967__root{opacity:1}.MaxHeightText3447576967__root.MaxHeightText3447576967--height24{line-height:24px}.MaxLines220381832__root{overflow:hidden}.MaxLines220381832__root.MaxLines220381832--clamp{-webkit-box-orient:vertical;display:-webkit-box}.MultiBulkActionToolbar672486749__root{min-width:0}.MultiBulkActionToolbar672486749__leftGroupWrapper{padding-right:12px;min-width:0;flex-wrap:nowrap;align-items:center}.MultiBulkActionToolbar672486749__selectedCountItem{min-width:0;flex-shrink:1;white-space:nowrap;overflow:hidden}.MultiBulkActionToolbar672486749__selectedCountText{display:block;width:100%}.NestedTablePlaceholderStatesRow2905697762__root td{padding:0!important;width:100%}.NestedTableRow2698853610__firstLevel td{padding-top:18px!important;padding-bottom:18px!important}.NestedTableRow2698853610__root:hover{background-color:#e7f0ff!important}.NestedTableRow2698853610__root.NestedTableRow2698853610--expandable{cursor:pointer}.NestedTableRow2698853610__placeholder td{padding:0!important;width:100%}.NestedTableRow2698853610__root:hover td:first-of-type::before,.NestedTableRow2698853610__parentHovered td:first-of-type::before{content:"";position:absolute;top:0;bottom:0;left:0;width:2px;background-color:#5999ff}.MultipleDragOverlayEffect1837173882__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)}.NestedTableDragAndDropRow3157484301__root.NestedTableDragAndDropRow3157484301--draggingInto td{background-color:#e7f0ff!important}.PickerContent2366937732__root{display:flex}.PickerContentAdditionalStep1233328752__titles{display:flex;justify-content:center;flex:1 1 auto;overflow:hidden;flex-direction:column}.PickerContentAdditionalStep1233328752__suffix{display:flex;align-items:center;flex:0 0 auto;overflow:hidden}.PickerTableListItem1297653655__root{box-sizing:border-box}.ScrollableContent747803473__root.ScrollableContent747803473--overflowY{overflow-y:auto}.ScrollableContent747803473__root.ScrollableContent747803473--overflowX{overflow-x:auto}.ScrollableContent747803473__root.ScrollableContent747803473--smooth{scroll-behavior:smooth}.SkeletonCard3482661655__headerLoading{display:block!important}.SlidingModal3460885352__root{transition:transform .4s ease 0s;position:fixed;z-index:1}.SlidingModal3460885352__root.SlidingModal3460885352--overlay{transition:transform 0s ease 0s}.SlidingModal3460885352__root.SlidingModal3460885352---appendTo-6-parent{position:absolute}.SlidingModal3460885352__root:not(.SlidingModal3460885352--exited){box-shadow:0 3px 24px 0 rgba(22,45,61,.18),0 8px 8px 0 rgba(22,45,61,.12)}.TabsFilter3114357314__root .TabsFilter3114357314__title{color:var(--wds-tabs-label-fill, var(--wds-color-text-standard-primary, var(--wsr-color-D10, #000624)))}.TabsFilter3114357314__root.TabsFilter3114357314--selected .TabsFilter3114357314__title,.TabsFilter3114357314__root:hover .TabsFilter3114357314__title{color:var(--wds-tabs-label-fill-active, var(--wsr-color-B10, #116DFF))}.ManageTagsModal3565466423__root{display:flex}.ToolbarItem3872899738__root{min-width:0}.ToolbarItemBox2199501219__root{min-width:0}.ToolbarItemBox2199501219__root.ToolbarItemBox2199501219--removeStartPadding{margin-left:-24px}.ToolbarItemBox2199501219__root.ToolbarItemBox2199501219--expandable{flex:1 0}.common3686982393__column{display:flex;flex-direction:column}.common3686982393__fullHeight{height:100%;min-height:0}.CollectionPageHeader2286109095__root:not(.CollectionPageHeader2286109095--mobile){gap:12px}.CollectionPageHeader2286109095__root.CollectionPageHeader2286109095--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.CollectionPageHeader2286109095__root.CollectionPageHeader2286109095--mobile>*{margin-left:0;margin-top:6px!important;height:auto}.FormPageHeader635418457__root.FormPageHeader635418457--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.FormPageHeader635418457__root.FormPageHeader635418457--mobile>*{margin-left:0;margin-top:6px!important;height:auto}
+.CardContainer3675777102__root.CardContainer3675777102--mobile{border-radius:0}.CmsFieldForm620051302__fullBleedDivider{margin-top:var(--wds-space-300, 18px);margin-inline:calc(-1*var(--wds-custom-modal-content-padding-horizontal, 24px))}.CmsFieldModal856061327__modal{--wds-custom-modal-content-padding-vertical:0}.ValidationAndDefaultsSection2469205065__accordionWrapper{margin-inline:calc(-1*var(--wds-custom-modal-content-padding-horizontal, 24px))}.CharactersLimitInput3249916756__field{flex:1;min-width:0}.Collapse3305460696__root{transition-property:height;transition-timing-function:cubic-bezier(.4,0,.2,1)}.Collapse3305460696__exit{height:0}.CollectionPage2642185604__root [data-hook=page-header-wrapper]{--wds-space-300:18px}.CollectionPage2642185604__root.CollectionPage2642185604--mobile{--wds-page-header-padding-horizontal:0;--wds-page-header-padding-horizontal-small:0;--wds-color-fill-surface-sunken:#ffffff}.CollectionPage2642185604__root.CollectionPage2642185604--panel{overflow:hidden;position:relative}.CollectionSectionHeader699658794__summaryIcon{display:flex;color:var(--wds-color-text-standard-secondary)}.CollectionTable1442834370__root td{vertical-align:middle}.CollectionTable1442834370__root.CollectionTable1442834370--mobile td:first-child{padding-left:18px}.CollectionTable1442834370__root.CollectionTable1442834370--mobile td:last-child{padding-right:18px}.CollectionTableWSRTable1389700346__root.CollectionTableWSRTable1389700346--resizable table{min-width:100%}.CollectionTableWSRTable1389700346__root.CollectionTableWSRTable1389700346--resizable [data-hook=table-resize-handle]{right:-4px!important;z-index:1}.CollectionToolbar1939696381__left{min-width:0}.CollectionToolbar1939696381__left.CollectionToolbar1939696381--expandable{flex:auto}.CollectionToolbar1939696381__left.CollectionToolbar1939696381--title>*{width:100%}.CollectionToolbar1939696381__root.CollectionToolbar1939696381---responsiveMode-5-title .CollectionToolbar1939696381__left{flex:1 100;min-width:50px}.CollectionToolbar1939696381__root.CollectionToolbar1939696381---responsiveMode-4-tabs .CollectionToolbar1939696381__left,.CollectionToolbar1939696381__root.CollectionToolbar1939696381---responsiveMode-4-tabs .CollectionToolbar1939696381__left.CollectionToolbar1939696381--expandable{flex:1 100 auto;min-width:140px}.CollectionToolbar1939696381__root.CollectionToolbar1939696381---responsiveMode-4-tabs .CollectionToolbar1939696381__left>*{flex-shrink:1;min-width:0}.CollectionToolbar1939696381__root .CollectionToolbar1939696381__right{justify-content:flex-end!important;flex-grow:1;flex-shrink:1;flex-basis:auto}.CollectionToolbar1939696381__root.CollectionToolbar1939696381--views .CollectionToolbar1939696381__right{min-width:0;flex-grow:1;flex-shrink:0;flex-basis:0}.CollectionToolbar1939696381__root.CollectionToolbar1939696381---responsiveMode-4-tabs .CollectionToolbar1939696381__right,.CollectionToolbar1939696381__root.CollectionToolbar1939696381---responsiveMode-5-title .CollectionToolbar1939696381__right{flex:0 1 auto;min-width:0}.CollectionToolbar1939696381__root .CollectionToolbar1939696381__right.CollectionToolbar1939696381__fullWidth{margin-inline-start:0!important}.CollectionToolbar1939696381__root.CollectionToolbar1939696381--mobile{padding-right:18px;padding-left:18px}.SearchOrCustomFilter1858433612__search{min-width:140px;max-width:240px;flex:1 0}.SearchOrCustomFilter1858433612__searchMobile{justify-content:flex-end;position:absolute;right:18px}.SearchOrCustomFilter1858433612__searchMobile:not(.SearchOrCustomFilter1858433612--expandable){left:18px}.SearchOrCustomFilter1858433612__searchMobile.SearchOrCustomFilter1858433612--expandable.SearchOrCustomFilter1858433612--expanded{left:18px}.AutoCompleteReadonly2062627611__root.AutoCompleteReadonly2062627611--disableEditing{cursor:pointer}.AutoCompleteReadonly2062627611__root.AutoCompleteReadonly2062627611--disableEditing input{cursor:pointer}.ViewsDropdown1133598523__root{width:200px}.DragHandle2954543528__root{display:flex;align-items:center}.DragHandle2954543528__root:not(.DragHandle2954543528--disabled){cursor:grab;color:#a8caff}.DragHandle2954543528__root.DragHandle2954543528--disabled{color:#acafc4}.DragHandle2954543528__root:focus-visible:not(.DragHandle2954543528--disabled){outline:0;box-shadow:0 0 0 3px #a6d0ff}.DragHandle2954543528__root.DragHandle2954543528--disabled{pointer-events:none}.DragHandle2954543528__root.DragHandle2954543528--dragging:not(.DragHandle2954543528--disabled){cursor:grabbing}td:has(>.EditableCell2410741874__root){position:relative;overflow:visible;min-height:24px}.EditableCell2410741874__root{display:flex;align-items:center;padding:0;position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;box-sizing:border-box;outline:0;cursor:default;user-select:none;background:var(--wsr-color-D80);border:1px solid var(--wsr-color-B40)}.EditableCell2410741874__root.EditableCell2410741874--selected{background:rgba(56,153,236,.08)}.EditableCell2410741874__root.EditableCell2410741874--focused:not(.EditableCell2410741874--selected){box-shadow:inset 0 0 0 2px var(--wsr-color-B10);z-index:2}.EditableCell2410741874__root.EditableCell2410741874--editing{background:var(--wsr-color-D80);box-shadow:inset 0 0 0 2px var(--wsr-color-B10);z-index:3;user-select:auto;overflow:visible}.EditableCell2410741874__root.EditableCell2410741874--editing:not(.EditableCell2410741874--showEditWhenFocused){bottom:auto;min-height:100%}.EditableCell2410741874__root:has([data-inner-focused]){overflow:visible;z-index:3;box-shadow:inset 0 0 0 2px var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--selectionTop:not(.EditableCell2410741874--editing){border-top:2px solid var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--selectionBottom:not(.EditableCell2410741874--editing){border-bottom:2px solid var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--selectionLeft:not(.EditableCell2410741874--editing){border-left:2px solid var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--selectionRight:not(.EditableCell2410741874--editing){border-right:2px solid var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--selectionTop.EditableCell2410741874--editing.EditableCell2410741874--typeToEdit{border-top:2px solid var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--selectionBottom.EditableCell2410741874--editing.EditableCell2410741874--typeToEdit{border-bottom:2px solid var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--selectionLeft.EditableCell2410741874--editing.EditableCell2410741874--typeToEdit{border-left:2px solid var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--selectionRight.EditableCell2410741874--editing.EditableCell2410741874--typeToEdit{border-right:2px solid var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--invalid:not(.EditableCell2410741874--editing){background:rgba(229,0,77,.06)}.EditableCell2410741874__root.EditableCell2410741874--copiedTop:not(.EditableCell2410741874--selectionTop){border-top:2px dashed var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--copiedBottom:not(.EditableCell2410741874--selectionBottom){border-bottom:2px dashed var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--copiedLeft:not(.EditableCell2410741874--selectionLeft){border-left:2px dashed var(--wsr-color-B10)}.EditableCell2410741874__root.EditableCell2410741874--copiedRight:not(.EditableCell2410741874--selectionRight){border-right:2px dashed var(--wsr-color-B10)}.EditableCell2410741874__validationIndicator{flex-shrink:0;margin-left:12px;margin-right:6px;color:var(--wsr-color-Y10)}.HeaderActionsPopover2426526163__root{opacity:0;transition:opacity .15s}th:hover .HeaderActionsPopover2426526163__root,.HeaderActionsPopover2426526163__root[data-menu-open=true],.HeaderActionsPopover2426526163__root:focus-within{opacity:1}.CellViewLayout1703368409__root{width:100%;height:100%;padding:9px 12px;box-sizing:border-box;display:flex;align-items:center;overflow:clip}.CellViewLayout1703368409__root>*{flex:1;min-width:0}.Edit2926467071__booleanEdit{display:flex;align-items:center;margin-left:12px}.View630518677__booleanView{display:flex;align-items:center;margin-left:9px;pointer-events:none}.Edit1344500611__dateInput{width:100%;margin-left:-1px}.Edit3075222500__emailInput{width:100%;margin-left:-1px}.Edit3536348979__numberInput{width:100%;margin-right:2px}.Edit3536348979__numberInput input{text-align:right;direction:ltr}.View2457313708__textView{width:100%;text-align:right}.Edit2465111391__jsonInput{width:100%;margin-left:-1px}.Edit4254165993__selectInput{width:100%}.Edit3758881888__editWrapper{width:100%}.Edit3758881888__inputArea{background-color:transparent;width:100%}.Edit3758881888__inputArea input{padding:9px 12px 8px!important;outline:0!important;border:0!important;box-sizing:border-box!important}.Edit3758881888__inputArea>div{border:0!important;border-radius:0!important;box-shadow:none!important;background-color:transparent!important;outline:0!important}.Edit3758881888__inputArea textarea{padding:9px 12px 8px!important;outline:0!important;border:0!important;box-sizing:border-box!important}.Edit3758881888__inputArea:not(.Edit3758881888--isFocused) textarea{resize:none;overflow:hidden}.Edit3758881888__inputArea:not(.Edit3758881888--isFocused) textarea::-webkit-scrollbar{display:none}.Edit361578883__urlInput{width:100%;margin-left:-1px}.View754937869__textView{width:100%;padding:9px 12px;display:flex;align-items:center;justify-content:space-between}.View754937869__urlText{flex:1;min-width:0}.View754937869__suffix{flex-shrink:0;margin-left:10px}.View754937869__textView.View754937869--suffixOnHover:not(:hover) .View754937869__suffix{display:none}.EntityPagePlain3536782552__root.EntityPagePlain3536782552--mobile{--wds-page-header-padding-horizontal:0}.Fade2342122444__root{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);opacity:1}.Fade2342122444__root.Fade2342122444--exit{opacity:0}.Heading2784564374__root{visibility:visible}.Heading2784564374__root.Heading2784564374--appearanceH2{font-size:28px!important;line-height:36px!important}.ImportStepUpload3169120808__fileUpload{width:100%}.InputOverflow3964013168__root.InputOverflow3964013168--selected:not(.InputOverflow3964013168--focused) input::placeholder{color:#000624}@keyframes LoadingRow3352924696__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%}}.LoadingRow3352924696__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:LoadingRow3352924696__gradientSwoosh 2s ease-out infinite alternate}.MaxHeightText1383193270__root{opacity:1}.MaxHeightText1383193270__root.MaxHeightText1383193270--height24{line-height:24px}.MaxLines2260226371__root{overflow:hidden}.MaxLines2260226371__root.MaxLines2260226371--clamp{-webkit-box-orient:vertical;display:-webkit-box}.MultiBulkActionToolbar2995266827__root{min-width:0}.MultiBulkActionToolbar2995266827__leftGroupWrapper{padding-right:12px;min-width:0;flex-wrap:nowrap;align-items:center}.MultiBulkActionToolbar2995266827__selectedCountItem{min-width:0;flex-shrink:1;white-space:nowrap;overflow:hidden}.MultiBulkActionToolbar2995266827__selectedCountText{display:block;width:100%}.NestedTablePlaceholderStatesRow1561851671__root td{padding:0!important;width:100%}.NestedTableRow241993205__firstLevel td{padding-top:18px!important;padding-bottom:18px!important}.NestedTableRow241993205__root:hover{background-color:#e7f0ff!important}.NestedTableRow241993205__root.NestedTableRow241993205--expandable{cursor:pointer}.NestedTableRow241993205__placeholder td{padding:0!important;width:100%}.NestedTableRow241993205__root:hover td:first-of-type::before,.NestedTableRow241993205__parentHovered td:first-of-type::before{content:"";position:absolute;top:0;bottom:0;left:0;width:2px;background-color:#5999ff}.MultipleDragOverlayEffect405172101__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)}.NestedTableDragAndDropRow2285967488__root.NestedTableDragAndDropRow2285967488--draggingInto td{background-color:#e7f0ff!important}.PickerContent1043288773__root{display:flex}.PickerContentAdditionalStep4078831938__titles{display:flex;justify-content:center;flex:1 1 auto;overflow:hidden;flex-direction:column}.PickerContentAdditionalStep4078831938__suffix{display:flex;align-items:center;flex:0 0 auto;overflow:hidden}.PickerTableListItem4034245690__root{box-sizing:border-box}.ScrollableContent740081677__root.ScrollableContent740081677--overflowY{overflow-y:auto}.ScrollableContent740081677__root.ScrollableContent740081677--overflowX{overflow-x:auto}.ScrollableContent740081677__root.ScrollableContent740081677--smooth{scroll-behavior:smooth}.SkeletonCard1593387239__headerLoading{display:block!important}.SlidingModal1531261617__root{transition:transform .4s ease 0s;position:fixed;z-index:1}.SlidingModal1531261617__root.SlidingModal1531261617--overlay{transition:transform 0s ease 0s}.SlidingModal1531261617__root.SlidingModal1531261617---appendTo-6-parent{position:absolute}.SlidingModal1531261617__root:not(.SlidingModal1531261617--exited){box-shadow:0 3px 24px 0 rgba(22,45,61,.18),0 8px 8px 0 rgba(22,45,61,.12)}.TabsFilter2923604144__root .TabsFilter2923604144__title{color:var(--wds-tabs-label-fill, var(--wds-color-text-standard-primary, var(--wsr-color-D10, #000624)))}.TabsFilter2923604144__root.TabsFilter2923604144--selected .TabsFilter2923604144__title,.TabsFilter2923604144__root:hover .TabsFilter2923604144__title{color:var(--wds-tabs-label-fill-active, var(--wsr-color-B10, #116DFF))}.ManageTagsModal4026655041__root{display:flex}.ToolbarItem227452217__root{min-width:0}.ToolbarItemBox305015988__root{min-width:0}.ToolbarItemBox305015988__root.ToolbarItemBox305015988--removeStartPadding{margin-left:-24px}.ToolbarItemBox305015988__root.ToolbarItemBox305015988--expandable{flex:1 0}.common3191932831__column{display:flex;flex-direction:column}.common3191932831__fullHeight{height:100%;min-height:0}.CollectionPageHeader342102969__root:not(.CollectionPageHeader342102969--mobile){gap:12px}.CollectionPageHeader342102969__root.CollectionPageHeader342102969--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.CollectionPageHeader342102969__root.CollectionPageHeader342102969--mobile>*{margin-left:0;margin-top:6px!important;height:auto}.FormPageHeader813076429__root.FormPageHeader813076429--mobile{flex-direction:column;padding-right:18px;padding-left:18px}.FormPageHeader813076429__root.FormPageHeader813076429--mobile>*{margin-left:0;margin-top:6px!important;height:auto}

package/src/utils/fieldTypePrefixIcons.tsx

@@ -137,7 +137,6 @@ const FIELD_TYPE_ICON_MAP: Partial<Record<FieldType, FieldPrefixIconEntry>> = {
 const ICON_STYLE: React.CSSProperties = {
   display: 'flex',
   alignItems: 'center',
-  color: 'var(--wds-color-text-standard-primary, #000624)',
 };
 
 export function getFieldTypeIcon({
@@ -150,15 +149,27 @@ export function getFieldTypeIcon({
   const Fallback = size === 'medium' ? Database : DatabaseSmall;
 
   if (!fieldType) {
-    return <span style={ICON_STYLE}><Fallback /></span>;
+    return (
+      <span style={ICON_STYLE}>
+        <Fallback />
+      </span>
+    );
   }
 
   const entry = FIELD_TYPE_ICON_MAP[fieldType];
 
   if (!entry) {
-    return <span style={ICON_STYLE}><Fallback /></span>;
+    return (
+      <span style={ICON_STYLE}>
+        <Fallback />
+      </span>
+    );
   }
 
   const Icon = size === 'medium' ? entry.medium : entry.small;
-  return <span style={ICON_STYLE}><Icon /></span>;
+  return (
+    <span style={ICON_STYLE}>
+      <Icon />
+    </span>
+  );
 }

package/src/version.ts

@@ -1 +1 @@
-export const version = 'patterns@1.396.0';
+export const version = 'patterns@1.398.0';

package/dist/cjs/state/EditableTable/FieldActionsState.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_mobx","require","_bexCore","FieldActionsState","constructor","translate","handlers","permissions","showToast","_defineProperty2","default","ConditionalModalState","TaskState","config","_this$_currentToastRe","_currentToastRemove","call","remove","fieldId","deleteField","deleteTask","run","err","console","error","status","isSuccess","confirmModal","close","_showToast","type","message","biName","isError","action","text","onClick","_runDelete","removeToastOnClick","makeObservable","confirmDelete","makePrimary","duplicate","duplicateWithContent","_this$handlers","t","open","theme","title","content","primaryButtonText","secondaryButtonText","primaryButtonOnClick","_this$handlers2","makePrimaryTask","isLoading","_this$handlers3","duplicateField","duplicateTask","duplicateWithContentTask","_this$handlers4","duplicateFieldWithContent","exports"],"sources":["../../../../src/state/EditableTable/FieldActionsState.ts"],"sourcesContent":["import { action, makeObservable } from 'mobx';\nimport { ConditionalModalState, TaskState } from '@wix/bex-core';\nimport type {\n  RemoveToast,\n  ShowToast,\n  ToastConfig,\n  Translate,\n} from '@wix/bex-core';\nimport type { MessageModalLayoutProps } from '@wix/design-system';\nimport type { FieldActions } from '../../types/SchemaConfig';\nimport type { EditableTableFieldActionsPermissions } from './EditableTableState';\n\nexport class FieldActionsState {\n  readonly handlers: FieldActions | undefined;\n  readonly permissions: EditableTableFieldActionsPermissions | undefined;\n  readonly translate: Translate;\n  readonly showToast: ShowToast | undefined;\n\n  private _currentToastRemove: RemoveToast | undefined;\n\n  readonly confirmModal = new ConditionalModalState<\n    Partial<MessageModalLayoutProps>\n  >();\n  readonly deleteTask = new TaskState<unknown>();\n  readonly makePrimaryTask = new TaskState<unknown>();\n  readonly duplicateTask = new TaskState<unknown>();\n  readonly duplicateWithContentTask = new TaskState<unknown>();\n\n  constructor(\n    translate: Translate,\n    handlers?: FieldActions,\n    permissions?: EditableTableFieldActionsPermissions,\n    showToast?: ShowToast,\n  ) {\n    this.translate = translate;\n    this.handlers = handlers;\n    this.permissions = permissions;\n    this.showToast = showToast;\n    makeObservable(this, {\n      confirmDelete: action,\n      makePrimary: action,\n      duplicate: action,\n      duplicateWithContent: action,\n    });\n  }\n\n  private _showToast = (config: ToastConfig) => {\n    if (!this.showToast) {\n      return;\n    }\n    this._currentToastRemove?.();\n    this._currentToastRemove = this.showToast(config).remove;\n  };\n\n  confirmDelete(fieldId: string) {\n    const deleteField = this.handlers?.deleteField;\n    if (!deleteField) {\n      return;\n    }\n    const t = this.translate;\n    this.confirmModal.open({\n      theme: 'destructive',\n      title: t('cairo.deleteModal.title'),\n      content: t('cairo.deleteModal.body'),\n      primaryButtonText: t('cairo.delete.button'),\n      secondaryButtonText: t('cairo.cancel.button'),\n      primaryButtonOnClick: () => {\n        this._runDelete(fieldId, deleteField);\n      },\n    });\n  }\n\n  async makePrimary(fieldId: string) {\n    const makePrimary = this.handlers?.makePrimary;\n    if (!makePrimary || this.makePrimaryTask.status.isLoading) {\n      return;\n    }\n    await this.makePrimaryTask.run(\n      () => makePrimary(fieldId),\n      (err) => console.error('[EditableTable] makePrimary failed', err),\n    );\n    if (this.makePrimaryTask.status.isSuccess) {\n      this._showToast({\n        type: 'SUCCESS',\n        message: 'Primary field updated',\n        biName: 'cairo-field-action-make-primary-success',\n      });\n    } else if (this.makePrimaryTask.status.isError) {\n      this._showToast({\n        type: 'ERROR',\n        message: \"Couldn't update primary field\",\n        biName: 'cairo-field-action-make-primary-error',\n        action: {\n          text: 'Try again',\n          onClick: () => this.makePrimary(fieldId),\n          removeToastOnClick: true,\n        },\n      });\n    }\n  }\n\n  async duplicate(fieldId: string) {\n    const duplicateField = this.handlers?.duplicateField;\n    if (\n      !duplicateField ||\n      this.duplicateTask.status.isLoading ||\n      this.duplicateWithContentTask.status.isLoading\n    ) {\n      return;\n    }\n    await this.duplicateTask.run(\n      () => duplicateField(fieldId),\n      (err) => console.error('[EditableTable] duplicateField failed', err),\n    );\n    if (this.duplicateTask.status.isSuccess) {\n      this._showToast({\n        type: 'SUCCESS',\n        message: 'Field duplicated',\n        biName: 'cairo-field-action-duplicate-success',\n      });\n    } else if (this.duplicateTask.status.isError) {\n      this._showToast({\n        type: 'ERROR',\n        message: \"Couldn't duplicate field\",\n        biName: 'cairo-field-action-duplicate-error',\n        action: {\n          text: 'Try again',\n          onClick: () => this.duplicate(fieldId),\n          removeToastOnClick: true,\n        },\n      });\n    }\n  }\n\n  async duplicateWithContent(fieldId: string) {\n    const duplicateFieldWithContent = this.handlers?.duplicateFieldWithContent;\n    if (\n      !duplicateFieldWithContent ||\n      this.duplicateWithContentTask.status.isLoading ||\n      this.duplicateTask.status.isLoading\n    ) {\n      return;\n    }\n    await this.duplicateWithContentTask.run(\n      () => duplicateFieldWithContent(fieldId),\n      (err) =>\n        console.error('[EditableTable] duplicateFieldWithContent failed', err),\n    );\n    if (this.duplicateWithContentTask.status.isSuccess) {\n      this._showToast({\n        type: 'SUCCESS',\n        message: 'Field duplicated with content',\n        biName: 'cairo-field-action-duplicate-with-content-success',\n      });\n    } else if (this.duplicateWithContentTask.status.isError) {\n      this._showToast({\n        type: 'ERROR',\n        message: \"Couldn't duplicate field with content\",\n        biName: 'cairo-field-action-duplicate-with-content-error',\n        action: {\n          text: 'Try again',\n          onClick: () => this.duplicateWithContent(fieldId),\n          removeToastOnClick: true,\n        },\n      });\n    }\n  }\n\n  private _runDelete = async (\n    fieldId: string,\n    deleteField: (id: string) => Promise<unknown>,\n  ) => {\n    await this.deleteTask.run(\n      () => deleteField(fieldId),\n      (err) => console.error('[EditableTable] deleteField failed', err),\n    );\n    if (this.deleteTask.status.isSuccess) {\n      this.confirmModal.close();\n      this._showToast({\n        type: 'SUCCESS',\n        message: 'Field deleted',\n        biName: 'cairo-field-action-delete-success',\n      });\n    } else if (this.deleteTask.status.isError) {\n      this._showToast({\n        type: 'ERROR',\n        message: \"Couldn't delete field\",\n        biName: 'cairo-field-action-delete-error',\n        action: {\n          text: 'Try again',\n          onClick: () => this._runDelete(fieldId, deleteField),\n          removeToastOnClick: true,\n        },\n      });\n    }\n  };\n}\n"],"mappings":"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","ignoreList":[]}