@wix/patterns 1.458.0 → 1.460.0

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "LoadingRow11625135";
+var _namespace_ = "LoadingRow96673417";
 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":"LoadingRow11625135__root"};
-export var keyframes = {"gradientSwoosh":"LoadingRow11625135__gradientSwoosh"}; 
+export var classes = {"root":"LoadingRow96673417__root"};
+export var keyframes = {"gradientSwoosh":"LoadingRow96673417__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_ = "MaxHeightText362573853";
+var _namespace_ = "MaxHeightText513550668";
 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":"MaxHeightText362573853__root"};
+export var classes = {"root":"MaxHeightText513550668__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_ = "MaxLines620534968";
+var _namespace_ = "MaxLines2461406812";
 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":"MaxLines620534968__root"};
+export var classes = {"root":"MaxLines2461406812__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_ = "MultiBulkActionToolbar3919893708";
+var _namespace_ = "MultiBulkActionToolbar3253052524";
 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":"MultiBulkActionToolbar3919893708__root","leftGroupWrapper":"MultiBulkActionToolbar3919893708__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar3919893708__selectedCountItem","selectedCountText":"MultiBulkActionToolbar3919893708__selectedCountText"};
+export var classes = {"root":"MultiBulkActionToolbar3253052524__root","leftGroupWrapper":"MultiBulkActionToolbar3253052524__leftGroupWrapper","selectedCountItem":"MultiBulkActionToolbar3253052524__selectedCountItem","selectedCountText":"MultiBulkActionToolbar3253052524__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_ = "NestedTablePlaceholderStatesRow1414948762";
+var _namespace_ = "NestedTablePlaceholderStatesRow1951330977";
 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":"NestedTablePlaceholderStatesRow1414948762__root"};
+export var classes = {"root":"NestedTablePlaceholderStatesRow1951330977__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_ = "NestedTableRow3688845642";
+var _namespace_ = "NestedTableRow1180789050";
 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":"NestedTableRow3688845642__root","firstLevel":"NestedTableRow3688845642__firstLevel","placeholder":"NestedTableRow3688845642__placeholder","parentHovered":"NestedTableRow3688845642__parentHovered"};
+export var classes = {"root":"NestedTableRow1180789050__root","firstLevel":"NestedTableRow1180789050__firstLevel","placeholder":"NestedTableRow1180789050__placeholder","parentHovered":"NestedTableRow1180789050__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_ = "MultipleDragOverlayEffect518776599";
+var _namespace_ = "MultipleDragOverlayEffect3656926460";
 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":"MultipleDragOverlayEffect518776599__root"};
+export var classes = {"root":"MultipleDragOverlayEffect3656926460__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_ = "NestedTableDragAndDropRow4163285825";
+var _namespace_ = "NestedTableDragAndDropRow3015241783";
 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":"NestedTableDragAndDropRow4163285825__root"};
+export var classes = {"root":"NestedTableDragAndDropRow3015241783__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_ = "PickerContent3573124578";
+var _namespace_ = "PickerContent2485467371";
 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":"PickerContent3573124578__root"};
+export var classes = {"root":"PickerContent2485467371__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_ = "PickerContentAdditionalStep4193606340";
+var _namespace_ = "PickerContentAdditionalStep2592055544";
 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":"PickerContentAdditionalStep4193606340__root","titles":"PickerContentAdditionalStep4193606340__titles","suffix":"PickerContentAdditionalStep4193606340__suffix"};
+export var classes = {"root":"PickerContentAdditionalStep2592055544__root","titles":"PickerContentAdditionalStep2592055544__titles","suffix":"PickerContentAdditionalStep2592055544__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_ = "PickerTableListItem1273089754";
+var _namespace_ = "PickerTableListItem3977218348";
 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":"PickerTableListItem1273089754__root"};
+export var classes = {"root":"PickerTableListItem3977218348__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_ = "ScrollableContent254527653";
+var _namespace_ = "ScrollableContent2756177241";
 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":"ScrollableContent254527653__root"};
+export var classes = {"root":"ScrollableContent2756177241__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_ = "SetupWidget3764151626";
+var _namespace_ = "SetupWidget3317736394";
 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":"SetupWidget3764151626__root","row":"SetupWidget3764151626__row","completedCta":"SetupWidget3764151626__completedCta","secondaryCta":"SetupWidget3764151626__secondaryCta","card":"SetupWidget3764151626__card","stepIcon":"SetupWidget3764151626__stepIcon","chevron":"SetupWidget3764151626__chevron","chevronDisabled":"SetupWidget3764151626__chevronDisabled","inProgressLabel":"SetupWidget3764151626__inProgressLabel"};
+export var classes = {"root":"SetupWidget3317736394__root","row":"SetupWidget3317736394__row","completedCta":"SetupWidget3317736394__completedCta","secondaryCta":"SetupWidget3317736394__secondaryCta","card":"SetupWidget3317736394__card","stepIcon":"SetupWidget3317736394__stepIcon","chevron":"SetupWidget3317736394__chevron","chevronDisabled":"SetupWidget3317736394__chevronDisabled","inProgressLabel":"SetupWidget3317736394__inProgressLabel"};
 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_ = "SkeletonCard686540105";
+var _namespace_ = "SkeletonCard2783720785";
 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":"SkeletonCard686540105__root","headerLoading":"SkeletonCard686540105__headerLoading"};
+export var classes = {"root":"SkeletonCard2783720785__root","headerLoading":"SkeletonCard2783720785__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_ = "SlidingModal974585516";
+var _namespace_ = "SlidingModal3852966151";
 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":"SlidingModal974585516__root"};
+export var classes = {"root":"SlidingModal3852966151__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/Table/AddFieldColumnHeader.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "AddFieldColumnHeader720734598";
+var _namespace_ = "AddFieldColumnHeader2071498074";
 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":"AddFieldColumnHeader720734598__root","title":"AddFieldColumnHeader720734598__title","hoverBridge":"AddFieldColumnHeader720734598__hoverBridge"};
+export var classes = {"root":"AddFieldColumnHeader2071498074__root","title":"AddFieldColumnHeader2071498074__title","hoverBridge":"AddFieldColumnHeader2071498074__hoverBridge"};
 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_ = "TabsFilter3081905480";
+var _namespace_ = "TabsFilter2033073221";
 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":"TabsFilter3081905480__root","titleBox":"TabsFilter3081905480__titleBox"};
+export var classes = {"root":"TabsFilter2033073221__root","titleBox":"TabsFilter2033073221__titleBox"};
 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_ = "ManageTagsModal3878019941";
+var _namespace_ = "ManageTagsModal2807948720";
 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":"ManageTagsModal3878019941__root"};
+export var classes = {"root":"ManageTagsModal2807948720__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

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

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "ToolbarItem515751528";
+var _namespace_ = "ToolbarItem1345866058";
 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":"ToolbarItem515751528__root"};
+export var classes = {"root":"ToolbarItem1345866058__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_ = "ToolbarItemBox890073816";
+var _namespace_ = "ToolbarItemBox4262591945";
 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":"ToolbarItemBox890073816__root"};
+export var classes = {"root":"ToolbarItemBox4262591945__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_ = "common1118032026";
+var _namespace_ = "common1575155374";
 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":"common1118032026__root","column":"common1118032026__column","fullHeight":"common1118032026__fullHeight"};
+export var classes = {"root":"common1575155374__root","column":"common1575155374__column","fullHeight":"common1575155374__fullHeight"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/dashboard/WixPatternsDashboardBaseProvider.tsx

@@ -67,7 +67,7 @@ export function WixPatternsDashboardBaseProvider({
     try {
       biLogger = bi.getLogger();
     } catch (error) {
-      console.error(error);
+      console.warn(error);
     }
 
     return {

package/src/schema/EntityPageFieldsCard.tsx

@@ -118,7 +118,10 @@ export function _EntityPageFieldsCard({
       />
       <Card.Divider />
       <Card.Content>
-        <EntityPageFields fieldIds={state.visibleFieldIds} />
+        <EntityPageFields
+          fieldIds={state.visibleFieldIds}
+          loading={!state.isLayoutReady}
+        />
       </Card.Content>
       {/* The host lives on the page, so a panel opened here closes any other.
           Rendered by the card rather than the page, so a page without a fields

package/src/schema/entityPageFieldManagement.ts

@@ -39,6 +39,8 @@ export function entityPageFieldManagement({
         fieldId: opts?.fieldId,
         origin: opts?.origin ?? 'external',
         customOrigin: opts?.customOrigin,
+        initialField: opts?.initialField,
+        lockedProperties: opts?.lockedProperties,
       }),
   };
 }

package/src/state/CollectionFieldsSourceState.ts

@@ -5,6 +5,7 @@ import type {
   FieldsSource,
   CustomFieldOrigin,
   Field,
+  OpenFieldModalOptions,
   Schema,
   SchemaSource,
   WixPatternsErrorCode,
@@ -131,11 +132,7 @@ export class CollectionFieldsSourceState {
   readonly featuredPageActions: MoreActionItemFactory[];
   readonly props?: { disableDefaultPageAction?: boolean };
   readonly filterConfig: FieldFilterConfig;
-  readonly openFieldModal: (opts?: {
-    fieldId?: string;
-    origin?: CustomFieldOrigin;
-    customOrigin?: string;
-  }) => void;
+  readonly openFieldModal: (opts?: OpenFieldModalOptions) => void;
   readonly fieldActionsMenu: FieldActionsMenuBuilder;
   readonly fieldActionHandlers?: FieldActionHandlersBuilder;
   readonly components: FieldsSourceComponents;
@@ -183,6 +180,8 @@ export class CollectionFieldsSourceState {
         fieldId: opts?.fieldId,
         origin: opts?.origin ?? 'external',
         customOrigin: opts?.customOrigin,
+        initialField: opts?.initialField,
+        lockedProperties: opts?.lockedProperties,
       });
     this.fieldActionsMenu = this.customFieldsPanel.fieldActionsMenu;
     this.fieldActionHandlers = params.createFieldActionHandlers?.(

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

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

package/src/state/CustomFields/CustomFieldsPanelState.ts

@@ -4,6 +4,7 @@ import {
   CustomFieldOrigin,
   DeleteFieldModalState,
   FieldsSource,
+  OpenFieldModalOptions,
   ReportBI,
   WixPatternsContainer,
   resolveFieldTypeDefinition,
@@ -111,11 +112,11 @@ export class CustomFieldsPanelState {
     return this.fieldsSource.archive;
   }
 
-  openCustomFieldModal(params: {
-    fieldId?: string;
-    origin: CustomFieldOrigin;
-    customOrigin?: string;
-  }) {
+  openCustomFieldModal(
+    params: Omit<OpenFieldModalOptions, 'origin'> & {
+      origin: CustomFieldOrigin;
+    },
+  ) {
     const { customFieldModal } = this;
     const { customFieldModalBiReporter } = customFieldModal;
 
@@ -123,6 +124,7 @@ export class CustomFieldsPanelState {
     customFieldModal.mode = params.fieldId ? 'edit' : 'new';
     customFieldModal.origin = params.origin;
     customFieldModal.customOrigin = params.customOrigin;
+    customFieldModal.lockedProperties = params.lockedProperties ?? [];
 
     !params.fieldId &&
       customFieldModalBiReporter.reportAddCustomField({
@@ -144,6 +146,8 @@ export class CustomFieldsPanelState {
         disablePermissionCheckboxes: true,
       });
       customFieldModalBiReporter.formSnapshot = formValues;
+    } else {
+      customFieldModal.applyInitialField(params.initialField);
     }
 
     customFieldModal.modalState.modal.open();

package/src/state/EntityPage/EntityPageState.ts

@@ -180,6 +180,10 @@ export class EntityPageState<T, V extends FieldValues = FieldValues>
    *  as a table's panel reads `toolbar.customColumnsState`. */
   customColumnsState: CustomColumnsEntityPageState | null = null;
 
+  // Shallow: a deep set would wrap the token objects, and release could not
+  // find them again.
+  private readonly _saveHolds = observable.set<object>([], { deep: false });
+
   readonly schemaSource?: SchemaSource<T>;
 
   /**
@@ -264,6 +268,8 @@ export class EntityPageState<T, V extends FieldValues = FieldValues>
       _loadedSchema: observable.ref,
       setLoadedSchema: action,
       customColumnsState: observable.ref,
+      holdSave: action,
+      isSaveHeld: computed,
       isFormDirty: computed,
       _withinRouter: computed,
     });
@@ -475,8 +481,26 @@ export class EntityPageState<T, V extends FieldValues = FieldValues>
     this.navigateToParentWithState({ _deletedEntity: deletedCollectionItem });
   }
 
+  /**
+   * Blocks `handleSubmit` until the returned release is called (idempotent).
+   * For features whose form fields are not mounted yet — react-hook-form only
+   * validates mounted controls, so a save in that window would skip their
+   * required-field validation.
+   */
+  holdSave(): () => void {
+    const hold = {};
+    this._saveHolds.add(hold);
+    return action(() => {
+      this._saveHolds.delete(hold);
+    });
+  }
+
+  get isSaveHeld(): boolean {
+    return this._saveHolds.size > 0;
+  }
+
   async handleSubmit(e?: React.BaseSyntheticEvent) {
-    if (this.formPage.submitTask.status.isLoading) {
+    if (this.formPage.submitTask.status.isLoading || this.isSaveHeld) {
       return;
     }
 

package/src/state/EntityPageFieldsCardState.ts

@@ -1,4 +1,4 @@
-import { computed, makeObservable, reaction } from 'mobx';
+import { computed, makeObservable, reaction, when } from 'mobx';
 import {
   addEventListener,
   SourceState,
@@ -66,6 +66,7 @@ export class EntityPageFieldsCardState {
       schema: computed,
       declaredFields: computed,
       visibleFieldIds: computed,
+      isLayoutReady: computed,
       canManageFields: computed,
     });
 
@@ -149,6 +150,11 @@ export class EntityPageFieldsCardState {
       .map((field) => field.id);
   }
 
+  get isLayoutReady(): boolean {
+    const { status } = this.cardState.fieldsState.initTask;
+    return status.isSuccess || status.isError;
+  }
+
   get canManageFields(): boolean {
     return !!this.panelState && this.declaredFields.length > 0;
   }
@@ -167,7 +173,11 @@ export class EntityPageFieldsCardState {
     // itself showing the error.
     this.loadTask.status.promise?.catch(() => null);
 
+    const releaseSaveHold = this.params.pageState.holdSave();
+
     const disposers: (void | (() => void))[] = [
+      when(() => this.isLayoutReady, releaseSaveHold),
+      releaseSaveHold,
       // Hold the stored-layout read until the schema is in, so a saved
       // show/hide and order survives a reload. Registered before the card
       // state's init below, which is what collects the listeners.

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

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

package/src/state/ManageFieldsSource.ts

@@ -1,4 +1,4 @@
-import type { CustomFieldOrigin, FieldsSource } from '@wix/bex-core';
+import type { FieldsSource, OpenFieldModalOptions } from '@wix/bex-core';
 import type {
   CustomFieldsPanelState,
   FieldActionsMenuBuilder,
@@ -16,9 +16,5 @@ export interface ManageFieldsSource {
   readonly fieldsSource: FieldsSource;
   readonly customFieldsPanel: CustomFieldsPanelState;
   readonly fieldActionsMenu: FieldActionsMenuBuilder;
-  readonly openFieldModal: (opts?: {
-    fieldId?: string;
-    origin?: CustomFieldOrigin;
-    customOrigin?: string;
-  }) => void;
+  readonly openFieldModal: (opts?: OpenFieldModalOptions) => void;
 }