@futdevpro/fsm-dynamo 1.20.7 → 1.20.9

package/__documentations/2026-08-23-forms-v2-color-picker-settings.md

@@ -1,20 +1,23 @@
-# Forms v2 ColorPicker settings — 2026-08-23
-
-## Outcome
-
-Forms v2 now exposes `DyFM_ColorPickerFieldNew_Settings` as the serializable bedrock Settings model for a
-color-picker field. `DyFM_Field_Type.colorPicker` uses the stable `color-picker` discriminator.
-
-The value contract is a CSS/browser-native `#RRGGBB` string. Rendering and interaction remain the responsibility
-of `@futdevpro/ngx-dynamo`; this package owns only the framework-independent constructor and discriminated union.
-
-## Public surface
-
-- `DyFM_Field_Type.colorPicker`
-- `DyFM_ColorPickerFieldNew_Settings`
-- `DyFM_FieldNew_Settings_AnyType` includes the new settings class
-
-## Verification
-
-The Forms v2 settings suite verifies constructor persistence and the immutable discriminator. The complete package
-test and build gates must remain green before publishing the patch release.
+# Forms v2 ColorPicker settings — 2026-08-23
+
+## Outcome
+
+Forms v2 now exposes `DyFM_ColorPickerFieldNew_Settings` as the serializable bedrock Settings model for a
+color-picker field. `DyFM_Field_Type.colorPicker` uses the stable `color-picker` discriminator.
+
+The value contract is a CSS/browser-native `#RRGGBB` string. The constructor adds that contract as a serializable
+pattern validator while preserving consumer validators, so backend and Angular consumers share the same rule.
+Rendering and interaction remain the responsibility of `@futdevpro/ngx-dynamo`; this package owns only the
+framework-independent constructor and discriminated union.
+
+## Public surface
+
+- `DyFM_Field_Type.colorPicker`
+- `DyFM_ColorPickerFieldNew_Settings`
+- `DyFM_FieldNew_Settings_AnyType` includes the new settings class
+
+## Verification
+
+The Forms v2 settings suite verifies constructor persistence, the immutable discriminator, default hexadecimal
+validation, and preservation of consumer validators. The complete package test and build gates must remain green
+before publishing the patch release.

package/__documentations/2026-08-23-forms-v2-symbol-picker-settings.md

@@ -0,0 +1,24 @@
+# Forms V2 emoji and Material icon picker settings — 2026-08-23
+
+## Outcome
+
+The shared `@futdevpro/fsm-dynamo` Forms V2 contract now includes serializable settings for emoji and
+Material Symbols pickers. Both types protect their field discriminator and can carry an optional curated
+option catalog through the backend-safe Settings layer.
+
+## Contracts
+
+- `DyFM_EmojiPickerFieldNew_Settings` uses `DyFM_Field_Type.emojiPicker`, a string value, configurable
+  grid columns, and `DyFM_PickerFieldNew_Option[]`.
+- `DyFM_IconPickerFieldNew_Settings` uses `DyFM_Field_Type.iconPicker`, the same option contract, and a
+  `DyFM_ButtonNewIconStyleType` preview style.
+- Icon values accept Material Symbols ligature names such as `rocket_launch`; the settings constructor
+  adds the shared pattern validator without duplicating an equivalent consumer validator.
+- Empty option arrays are intentional: the Angular renderer owns the default discovery catalog while
+  consumers can replace it with a serializable project-specific catalog.
+
+## Verification
+
+- TypeScript package build.
+- Focused Forms V2 Jasmine settings tests.
+- ESLint on the new settings and option-interface sources.

package/build/_modules/ngx-models/_enums/field-type.enum.d.ts

@@ -20,6 +20,8 @@ export declare enum DyFM_Field_Type {
     chipMultiselect = "chipMultiselect",//
     radioSelect = "radioSelect",//
     colorPicker = "color-picker",
+    emojiPicker = "emoji-picker",
+    iconPicker = "icon-picker",
     date = "date",
     dateRange = "dateRange",
     dateTime = "dateTime",

package/build/_modules/ngx-models/_enums/field-type.enum.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"field-type.enum.d.ts","sourceRoot":"","sources":["../../../../src/_modules/ngx-models/_enums/field-type.enum.ts"],"names":[],"mappings":"AACA;;GAEG;AACH,oBAAY,eAAe;IAEzB,MAAM,WAAW;IACjB,QAAQ,aAAa;IACrB,MAAM,WAAW;IACjB,IAAI,SAAS;IACb,QAAQ,aAAa;IACrB,QAAQ,aAAa;IACrB,QAAQ,aAAa;IACrB,YAAY,iBAAiB;IAC7B,MAAM,WAAW;IACjB,WAAW,gBAAgB;IAC3B,MAAM,WAAW;IACjB,WAAW,gBAAgB;IAC3B,MAAM,WAAW;IACjB,WAAW,gBAAgB;IAC3B,UAAU,eAAe,CAAE,EAAE;IAC7B,eAAe,oBAAoB,CAAE,EAAE;IACvC,WAAW,gBAAgB,CAAE,EAAE;IAC/B,WAAW,iBAAiB;IAC5B,IAAI,SAAS;IACb,SAAS,cAAc;IACvB,QAAQ,aAAa;IACrB,aAAa,kBAAkB;IAG/B,IAAI,SAAS;IACb,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,QAAQ,aAAa;IAGrB,UAAU,eAAc;IAGxB,UAAU,eAAe;CAa1B"}
+{"version":3,"file":"field-type.enum.d.ts","sourceRoot":"","sources":["../../../../src/_modules/ngx-models/_enums/field-type.enum.ts"],"names":[],"mappings":"AACA;;GAEG;AACH,oBAAY,eAAe;IAEzB,MAAM,WAAW;IACjB,QAAQ,aAAa;IACrB,MAAM,WAAW;IACjB,IAAI,SAAS;IACb,QAAQ,aAAa;IACrB,QAAQ,aAAa;IACrB,QAAQ,aAAa;IACrB,YAAY,iBAAiB;IAC7B,MAAM,WAAW;IACjB,WAAW,gBAAgB;IAC3B,MAAM,WAAW;IACjB,WAAW,gBAAgB;IAC3B,MAAM,WAAW;IACjB,WAAW,gBAAgB;IAC3B,UAAU,eAAe,CAAE,EAAE;IAC7B,eAAe,oBAAoB,CAAE,EAAE;IACvC,WAAW,gBAAgB,CAAE,EAAE;IAC/B,WAAW,iBAAiB;IAC5B,WAAW,iBAAiB;IAC5B,UAAU,gBAAgB;IAC1B,IAAI,SAAS;IACb,SAAS,cAAc;IACvB,QAAQ,aAAa;IACrB,aAAa,kBAAkB;IAG/B,IAAI,SAAS;IACb,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,QAAQ,aAAa;IAGrB,UAAU,eAAc;IAGxB,UAAU,eAAe;CAa1B"}

package/build/_modules/ngx-models/_enums/field-type.enum.js

@@ -25,6 +25,8 @@ var DyFM_Field_Type;
     DyFM_Field_Type["chipMultiselect"] = "chipMultiselect";
     DyFM_Field_Type["radioSelect"] = "radioSelect";
     DyFM_Field_Type["colorPicker"] = "color-picker";
+    DyFM_Field_Type["emojiPicker"] = "emoji-picker";
+    DyFM_Field_Type["iconPicker"] = "icon-picker";
     DyFM_Field_Type["date"] = "date";
     DyFM_Field_Type["dateRange"] = "dateRange";
     DyFM_Field_Type["dateTime"] = "dateTime";

package/build/_modules/ngx-models/_enums/field-type.enum.js.map

@@ -1 +1 @@
-{"version":3,"file":"field-type.enum.js","sourceRoot":"","sources":["../../../../src/_modules/ngx-models/_enums/field-type.enum.ts"],"names":[],"mappings":";;;AACA;;GAEG;AACH,IAAY,eAgDX;AAhDD,WAAY,eAAe;IACzB,gBAAgB;IAChB,oCAAiB,CAAA;IACjB,wCAAqB,CAAA;IACrB,oCAAiB,CAAA;IACjB,gCAAa,CAAA;IACb,wCAAqB,CAAA;IACrB,wCAAqB,CAAA;IACrB,wCAAqB,CAAA;IACrB,gDAA6B,CAAA;IAC7B,oCAAiB,CAAA;IACjB,8CAA2B,CAAA;IAC3B,oCAAiB,CAAA;IACjB,8CAA2B,CAAA;IAC3B,oCAAiB,CAAA;IACjB,8CAA2B,CAAA;IAC3B,4CAAyB,CAAA;IACzB,sDAAmC,CAAA;IACnC,8CAA2B,CAAA;IAC3B,+CAA4B,CAAA;IAC5B,gCAAa,CAAA;IACb,0CAAuB,CAAA;IACvB,wCAAqB,CAAA;IACrB,kDAA+B,CAAA;IAE/B,aAAa;IACb,gCAAa,CAAA;IACb,kCAAe,CAAA;IACf,sCAAmB,CAAA;IACnB,wCAAqB,CAAA;IAErB,gBAAgB;IAChB,4CAAwB,CAAA;IAExB,UAAU;IACV,4CAAyB,CAAA;IAEzB,QAAQ;IACR,qBAAqB;IACrB;;;MAGE;IACF,qBAAqB;IAErB,qBAAqB;IACrB,uEAAuE;AAEzE,CAAC,EAhDW,eAAe,+BAAf,eAAe,QAgD1B"}
+{"version":3,"file":"field-type.enum.js","sourceRoot":"","sources":["../../../../src/_modules/ngx-models/_enums/field-type.enum.ts"],"names":[],"mappings":";;;AACA;;GAEG;AACH,IAAY,eAkDX;AAlDD,WAAY,eAAe;IACzB,gBAAgB;IAChB,oCAAiB,CAAA;IACjB,wCAAqB,CAAA;IACrB,oCAAiB,CAAA;IACjB,gCAAa,CAAA;IACb,wCAAqB,CAAA;IACrB,wCAAqB,CAAA;IACrB,wCAAqB,CAAA;IACrB,gDAA6B,CAAA;IAC7B,oCAAiB,CAAA;IACjB,8CAA2B,CAAA;IAC3B,oCAAiB,CAAA;IACjB,8CAA2B,CAAA;IAC3B,oCAAiB,CAAA;IACjB,8CAA2B,CAAA;IAC3B,4CAAyB,CAAA;IACzB,sDAAmC,CAAA;IACnC,8CAA2B,CAAA;IAC3B,+CAA4B,CAAA;IAC5B,+CAA4B,CAAA;IAC5B,6CAA0B,CAAA;IAC1B,gCAAa,CAAA;IACb,0CAAuB,CAAA;IACvB,wCAAqB,CAAA;IACrB,kDAA+B,CAAA;IAE/B,aAAa;IACb,gCAAa,CAAA;IACb,kCAAe,CAAA;IACf,sCAAmB,CAAA;IACnB,wCAAqB,CAAA;IAErB,gBAAgB;IAChB,4CAAwB,CAAA;IAExB,UAAU;IACV,4CAAyB,CAAA;IAEzB,QAAQ;IACR,qBAAqB;IACrB;;;MAGE;IACF,qBAAqB;IAErB,qBAAqB;IACrB,uEAAuE;AAEzE,CAAC,EAlDW,eAAe,+BAAf,eAAe,QAkD1B"}

package/build/_modules/ngx-models/_models/control-models/forms-new/color-picker-field-new-settings.control-model.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"color-picker-field-new-settings.control-model.d.ts","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/color-picker-field-new-settings.control-model.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,sBAAsB,EAAE,MAAM,oCAAoC,CAAC;AAE5E;;;;;GAKG;AACH,qBAAa,iCAAkC,SAAQ,sBAAsB,CAAC,MAAM,CAAC;IACnF,SAAkB,IAAI,EAAE,eAAe,CAAC,WAAW,CAA+B;IAElF,qFAAqF;gBACzE,GAAG,EAAE,OAAO,CAAC,iCAAiC,CAAC;CAO5D"}
+{"version":3,"file":"color-picker-field-new-settings.control-model.d.ts","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/color-picker-field-new-settings.control-model.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAElE,OAAO,EACL,sBAAsB,EAEvB,MAAM,oCAAoC,CAAC;AAI5C;;;;;GAKG;AACH,qBAAa,iCAAkC,SAAQ,sBAAsB,CAAC,MAAM,CAAC;IACnF,SAAkB,IAAI,EAAE,eAAe,CAAC,WAAW,CAA+B;IAElF,qFAAqF;gBACzE,GAAG,EAAE,OAAO,CAAC,iCAAiC,CAAC;CAwB5D"}

package/build/_modules/ngx-models/_models/control-models/forms-new/color-picker-field-new-settings.control-model.js

@@ -2,7 +2,9 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DyFM_ColorPickerFieldNew_Settings = void 0;
 const field_type_enum_1 = require("../../../_enums/field-type.enum");
+const field_new_validator_type_enum_1 = require("../../../_enums/forms-new/field-new-validator-type.enum");
 const field_new_settings_control_model_1 = require("./field-new-settings.control-model");
+const DYNAMO_COLOR_PICKER_HEX_PATTERN = '^#[0-9a-fA-F]{6}$';
 /**
  * Forms v2 color-picker settings.
  *
@@ -17,6 +19,19 @@ class DyFM_ColorPickerFieldNew_Settings extends field_new_settings_control_model
         const rest = { ...set };
         Reflect.deleteProperty(rest, 'type');
         Object.assign(this, rest);
+        const validators = this.validators ?? [];
+        const hasHexValidator = validators.some((validator) => validator.type === field_new_validator_type_enum_1.DyFM_FieldNew_Validator_Type.pattern
+            && validator.value === DYNAMO_COLOR_PICKER_HEX_PATTERN);
+        if (!hasHexValidator) {
+            this.validators = [
+                ...validators,
+                {
+                    type: field_new_validator_type_enum_1.DyFM_FieldNew_Validator_Type.pattern,
+                    value: DYNAMO_COLOR_PICKER_HEX_PATTERN,
+                    message: 'Enter a color as #RRGGBB.',
+                },
+            ];
+        }
     }
 }
 exports.DyFM_ColorPickerFieldNew_Settings = DyFM_ColorPickerFieldNew_Settings;

package/build/_modules/ngx-models/_models/control-models/forms-new/color-picker-field-new-settings.control-model.js.map

@@ -1 +1 @@
-{"version":3,"file":"color-picker-field-new-settings.control-model.js","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/color-picker-field-new-settings.control-model.ts"],"names":[],"mappings":";;;AAAA,qEAAkE;AAClE,yFAA4E;AAE5E;;;;;GAKG;AACH,MAAa,iCAAkC,SAAQ,yDAA8B;IACjE,IAAI,GAAgC,iCAAe,CAAC,WAAW,CAAC;IAElF,qFAAqF;IACrF,YAAY,GAA+C;QACzD,KAAK,CAAC,GAAG,CAAC,CAAC;QACX,MAAM,IAAI,GAA+C,EAAE,GAAG,GAAG,EAAE,CAAC;QAEpE,OAAO,CAAC,cAAc,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;QACrC,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAC5B,CAAC;CACF;AAXD,8EAWC"}
+{"version":3,"file":"color-picker-field-new-settings.control-model.js","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/color-picker-field-new-settings.control-model.ts"],"names":[],"mappings":";;;AAAA,qEAAkE;AAClE,2GAAuG;AACvG,yFAG4C;AAE5C,MAAM,+BAA+B,GAAW,mBAAmB,CAAC;AAEpE;;;;;GAKG;AACH,MAAa,iCAAkC,SAAQ,yDAA8B;IACjE,IAAI,GAAgC,iCAAe,CAAC,WAAW,CAAC;IAElF,qFAAqF;IACrF,YAAY,GAA+C;QACzD,KAAK,CAAC,GAAG,CAAC,CAAC;QACX,MAAM,IAAI,GAA+C,EAAE,GAAG,GAAG,EAAE,CAAC;QAEpE,OAAO,CAAC,cAAc,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;QACrC,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;QAE1B,MAAM,UAAU,GAAyC,IAAI,CAAC,UAAU,IAAI,EAAE,CAAC;QAC/E,MAAM,eAAe,GAAY,UAAU,CAAC,IAAI,CAAC,CAAC,SAA6C,EAAW,EAAE,CAC1G,SAAS,CAAC,IAAI,KAAK,4DAA4B,CAAC,OAAO;eACpD,SAAS,CAAC,KAAK,KAAK,+BAA+B,CACvD,CAAC;QAEF,IAAI,CAAC,eAAe,EAAE,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG;gBAChB,GAAG,UAAU;gBACb;oBACE,IAAI,EAAE,4DAA4B,CAAC,OAAO;oBAC1C,KAAK,EAAE,+BAA+B;oBACtC,OAAO,EAAE,2BAA2B;iBACrC;aACF,CAAC;QACJ,CAAC;IACH,CAAC;CACF;AA5BD,8EA4BC"}

package/build/_modules/ngx-models/_models/control-models/forms-new/emoji-picker-field-new-settings.control-model.d.ts

@@ -0,0 +1,14 @@
+import { DyFM_Field_Type } from '../../../_enums/field-type.enum';
+import { DyFM_FieldNew_Settings } from './field-new-settings.control-model';
+import { DyFM_PickerFieldNew_Option } from './picker-field-new-option.interface';
+/** Serializable Forms v2 emoji-picker settings. */
+export declare class DyFM_EmojiPickerFieldNew_Settings extends DyFM_FieldNew_Settings<string> {
+    readonly type: DyFM_Field_Type.emojiPicker;
+    /** Optional curated options. The UI supplies a default catalog when empty. */
+    options: DyFM_PickerFieldNew_Option[];
+    /** Preferred picker-grid column count. */
+    columns: number;
+    /** Creates serializable emoji-picker settings while protecting the discriminator. */
+    constructor(set: Partial<DyFM_EmojiPickerFieldNew_Settings>);
+}
+//# sourceMappingURL=emoji-picker-field-new-settings.control-model.d.ts.map

package/build/_modules/ngx-models/_models/control-models/forms-new/emoji-picker-field-new-settings.control-model.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"emoji-picker-field-new-settings.control-model.d.ts","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/emoji-picker-field-new-settings.control-model.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,sBAAsB,EAAE,MAAM,oCAAoC,CAAC;AAC5E,OAAO,EAAE,0BAA0B,EAAE,MAAM,qCAAqC,CAAC;AAEjF,mDAAmD;AACnD,qBAAa,iCAAkC,SAAQ,sBAAsB,CAAC,MAAM,CAAC;IACnF,SAAkB,IAAI,EAAE,eAAe,CAAC,WAAW,CAA+B;IAElF,8EAA8E;IAC9E,OAAO,EAAE,0BAA0B,EAAE,CAAM;IAE3C,0CAA0C;IAC1C,OAAO,EAAE,MAAM,CAAK;IAEpB,qFAAqF;gBACzE,GAAG,EAAE,OAAO,CAAC,iCAAiC,CAAC;CAQ5D"}

package/build/_modules/ngx-models/_models/control-models/forms-new/emoji-picker-field-new-settings.control-model.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DyFM_EmojiPickerFieldNew_Settings = void 0;
+const field_type_enum_1 = require("../../../_enums/field-type.enum");
+const field_new_settings_control_model_1 = require("./field-new-settings.control-model");
+/** Serializable Forms v2 emoji-picker settings. */
+class DyFM_EmojiPickerFieldNew_Settings extends field_new_settings_control_model_1.DyFM_FieldNew_Settings {
+    type = field_type_enum_1.DyFM_Field_Type.emojiPicker;
+    /** Optional curated options. The UI supplies a default catalog when empty. */
+    options = [];
+    /** Preferred picker-grid column count. */
+    columns = 8;
+    /** Creates serializable emoji-picker settings while protecting the discriminator. */
+    constructor(set) {
+        super(set);
+        const rest = { ...set };
+        Reflect.deleteProperty(rest, 'type');
+        Object.assign(this, rest);
+        this.options = this.options ?? [];
+    }
+}
+exports.DyFM_EmojiPickerFieldNew_Settings = DyFM_EmojiPickerFieldNew_Settings;
+//# sourceMappingURL=emoji-picker-field-new-settings.control-model.js.map

package/build/_modules/ngx-models/_models/control-models/forms-new/emoji-picker-field-new-settings.control-model.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"emoji-picker-field-new-settings.control-model.js","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/emoji-picker-field-new-settings.control-model.ts"],"names":[],"mappings":";;;AAAA,qEAAkE;AAClE,yFAA4E;AAG5E,mDAAmD;AACnD,MAAa,iCAAkC,SAAQ,yDAA8B;IACjE,IAAI,GAAgC,iCAAe,CAAC,WAAW,CAAC;IAElF,8EAA8E;IAC9E,OAAO,GAAiC,EAAE,CAAC;IAE3C,0CAA0C;IAC1C,OAAO,GAAW,CAAC,CAAC;IAEpB,qFAAqF;IACrF,YAAY,GAA+C;QACzD,KAAK,CAAC,GAAG,CAAC,CAAC;QACX,MAAM,IAAI,GAA+C,EAAE,GAAG,GAAG,EAAE,CAAC;QAEpE,OAAO,CAAC,cAAc,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;QACrC,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,IAAI,EAAE,CAAC;IACpC,CAAC;CACF;AAlBD,8EAkBC"}

package/build/_modules/ngx-models/_models/control-models/forms-new/field-new-types.d.ts

@@ -4,6 +4,8 @@ import { DyFM_DateFieldNew_Settings } from './date-field-new-settings.control-mo
 import { DyFM_DateRangeFieldNew_Settings } from './date-range-field-new-settings.control-model';
 import { DyFM_DateTimeFieldNew_Settings } from './datetime-field-new-settings.control-model';
 import { DyFM_DateTimeRangeFieldNew_Settings } from './datetime-range-field-new-settings.control-model';
+import { DyFM_EmojiPickerFieldNew_Settings } from './emoji-picker-field-new-settings.control-model';
+import { DyFM_IconPickerFieldNew_Settings } from './icon-picker-field-new-settings.control-model';
 import { DyFM_MultiselectFieldNew_Settings } from './multiselect-field-new-settings.control-model';
 import { DyFM_NumberFieldNew_Settings } from './number-field-new-settings.control-model';
 import { DyFM_PasswordFieldNew_Settings } from './password-field-new-settings.control-model';
@@ -25,5 +27,5 @@ import { DyFM_TextFieldNew_Settings } from './text-field-new-settings.control-mo
  *
  * @see _specifications/forms-v2/02-architecture-spec.md (11. mátrix)
  */
-export type DyFM_FieldNew_Settings_AnyType = DyFM_TextFieldNew_Settings | DyFM_TextAreaFieldNew_Settings | DyFM_NumberFieldNew_Settings | DyFM_PasswordFieldNew_Settings | DyFM_SliderFieldNew_Settings | DyFM_SliderRangeFieldNew_Settings | DyFM_CheckboxFieldNew_Settings | DyFM_ColorPickerFieldNew_Settings | DyFM_SelectFieldNew_Settings<unknown> | DyFM_MultiselectFieldNew_Settings<unknown> | DyFM_RadioSelectFieldNew_Settings<unknown> | DyFM_DateFieldNew_Settings | DyFM_DateTimeFieldNew_Settings | DyFM_DateRangeFieldNew_Settings | DyFM_DateTimeRangeFieldNew_Settings;
+export type DyFM_FieldNew_Settings_AnyType = DyFM_TextFieldNew_Settings | DyFM_TextAreaFieldNew_Settings | DyFM_NumberFieldNew_Settings | DyFM_PasswordFieldNew_Settings | DyFM_SliderFieldNew_Settings | DyFM_SliderRangeFieldNew_Settings | DyFM_CheckboxFieldNew_Settings | DyFM_ColorPickerFieldNew_Settings | DyFM_EmojiPickerFieldNew_Settings | DyFM_IconPickerFieldNew_Settings | DyFM_SelectFieldNew_Settings<unknown> | DyFM_MultiselectFieldNew_Settings<unknown> | DyFM_RadioSelectFieldNew_Settings<unknown> | DyFM_DateFieldNew_Settings | DyFM_DateTimeFieldNew_Settings | DyFM_DateRangeFieldNew_Settings | DyFM_DateTimeRangeFieldNew_Settings;
 //# sourceMappingURL=field-new-types.d.ts.map

package/build/_modules/ngx-models/_models/control-models/forms-new/field-new-types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"field-new-types.d.ts","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/field-new-types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AAC7F,OAAO,EAAE,iCAAiC,EAAE,MAAM,iDAAiD,CAAC;AACpG,OAAO,EAAE,0BAA0B,EAAE,MAAM,yCAAyC,CAAC;AACrF,OAAO,EAAE,+BAA+B,EAAE,MAAM,+CAA+C,CAAC;AAChG,OAAO,EAAE,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AAC7F,OAAO,EAAE,mCAAmC,EAAE,MAAM,mDAAmD,CAAC;AACxG,OAAO,EAAE,iCAAiC,EAAE,MAAM,gDAAgD,CAAC;AACnG,OAAO,EAAE,4BAA4B,EAAE,MAAM,2CAA2C,CAAC;AACzF,OAAO,EAAE,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AAC7F,OAAO,EAAE,iCAAiC,EAAE,MAAM,iDAAiD,CAAC;AACpG,OAAO,EAAE,4BAA4B,EAAE,MAAM,2CAA2C,CAAC;AACzF,OAAO,EAAE,4BAA4B,EAAE,MAAM,2CAA2C,CAAC;AACzF,OAAO,EAAE,iCAAiC,EAAE,MAAM,iDAAiD,CAAC;AACpG,OAAO,EAAE,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AAC7F,OAAO,EAAE,0BAA0B,EAAE,MAAM,yCAAyC,CAAC;AAErF;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,8BAA8B,GACtC,0BAA0B,GAC1B,8BAA8B,GAC9B,4BAA4B,GAC5B,8BAA8B,GAC9B,4BAA4B,GAC5B,iCAAiC,GACjC,8BAA8B,GAC9B,iCAAiC,GACjC,4BAA4B,CAAC,OAAO,CAAC,GACrC,iCAAiC,CAAC,OAAO,CAAC,GAC1C,iCAAiC,CAAC,OAAO,CAAC,GAC1C,0BAA0B,GAC1B,8BAA8B,GAC9B,+BAA+B,GAC/B,mCAAmC,CAAC"}
+{"version":3,"file":"field-new-types.d.ts","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/field-new-types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AAC7F,OAAO,EAAE,iCAAiC,EAAE,MAAM,iDAAiD,CAAC;AACpG,OAAO,EAAE,0BAA0B,EAAE,MAAM,yCAAyC,CAAC;AACrF,OAAO,EAAE,+BAA+B,EAAE,MAAM,+CAA+C,CAAC;AAChG,OAAO,EAAE,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AAC7F,OAAO,EAAE,mCAAmC,EAAE,MAAM,mDAAmD,CAAC;AACxG,OAAO,EAAE,iCAAiC,EAAE,MAAM,iDAAiD,CAAC;AACpG,OAAO,EAAE,gCAAgC,EAAE,MAAM,gDAAgD,CAAC;AAClG,OAAO,EAAE,iCAAiC,EAAE,MAAM,gDAAgD,CAAC;AACnG,OAAO,EAAE,4BAA4B,EAAE,MAAM,2CAA2C,CAAC;AACzF,OAAO,EAAE,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AAC7F,OAAO,EAAE,iCAAiC,EAAE,MAAM,iDAAiD,CAAC;AACpG,OAAO,EAAE,4BAA4B,EAAE,MAAM,2CAA2C,CAAC;AACzF,OAAO,EAAE,4BAA4B,EAAE,MAAM,2CAA2C,CAAC;AACzF,OAAO,EAAE,iCAAiC,EAAE,MAAM,iDAAiD,CAAC;AACpG,OAAO,EAAE,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AAC7F,OAAO,EAAE,0BAA0B,EAAE,MAAM,yCAAyC,CAAC;AAErF;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,8BAA8B,GACtC,0BAA0B,GAC1B,8BAA8B,GAC9B,4BAA4B,GAC5B,8BAA8B,GAC9B,4BAA4B,GAC5B,iCAAiC,GACjC,8BAA8B,GAC9B,iCAAiC,GACjC,iCAAiC,GACjC,gCAAgC,GAChC,4BAA4B,CAAC,OAAO,CAAC,GACrC,iCAAiC,CAAC,OAAO,CAAC,GAC1C,iCAAiC,CAAC,OAAO,CAAC,GAC1C,0BAA0B,GAC1B,8BAA8B,GAC9B,+BAA+B,GAC/B,mCAAmC,CAAC"}

package/build/_modules/ngx-models/_models/control-models/forms-new/icon-picker-field-new-settings.control-model.d.ts

@@ -0,0 +1,17 @@
+import { DyFM_ButtonNewIconStyleType } from '../../../_enums/button-new/button-new-icon-style-type.enum';
+import { DyFM_Field_Type } from '../../../_enums/field-type.enum';
+import { DyFM_FieldNew_Settings } from './field-new-settings.control-model';
+import { DyFM_PickerFieldNew_Option } from './picker-field-new-option.interface';
+/** Serializable Forms v2 Material Symbols picker settings. */
+export declare class DyFM_IconPickerFieldNew_Settings extends DyFM_FieldNew_Settings<string> {
+    readonly type: DyFM_Field_Type.iconPicker;
+    /** Optional curated options. The UI supplies a default catalog when empty. */
+    options: DyFM_PickerFieldNew_Option[];
+    /** Preferred picker-grid column count. */
+    columns: number;
+    /** Material Symbols font family used by the option preview. */
+    iconStyle: DyFM_ButtonNewIconStyleType;
+    /** Creates serializable icon-picker settings while protecting the discriminator. */
+    constructor(set: Partial<DyFM_IconPickerFieldNew_Settings>);
+}
+//# sourceMappingURL=icon-picker-field-new-settings.control-model.d.ts.map

package/build/_modules/ngx-models/_models/control-models/forms-new/icon-picker-field-new-settings.control-model.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-picker-field-new-settings.control-model.d.ts","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/icon-picker-field-new-settings.control-model.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,2BAA2B,EAAE,MAAM,4DAA4D,CAAC;AACzG,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAElE,OAAO,EACL,sBAAsB,EAEvB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAE,0BAA0B,EAAE,MAAM,qCAAqC,CAAC;AAIjF,8DAA8D;AAC9D,qBAAa,gCAAiC,SAAQ,sBAAsB,CAAC,MAAM,CAAC;IAClF,SAAkB,IAAI,EAAE,eAAe,CAAC,UAAU,CAA8B;IAEhF,8EAA8E;IAC9E,OAAO,EAAE,0BAA0B,EAAE,CAAM;IAE3C,0CAA0C;IAC1C,OAAO,EAAE,MAAM,CAAK;IAEpB,+DAA+D;IAC/D,SAAS,EAAE,2BAA2B,CAAuC;IAE7E,oFAAoF;gBACxE,GAAG,EAAE,OAAO,CAAC,gCAAgC,CAAC;CA0B3D"}

package/build/_modules/ngx-models/_models/control-models/forms-new/icon-picker-field-new-settings.control-model.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DyFM_IconPickerFieldNew_Settings = void 0;
+const button_new_icon_style_type_enum_1 = require("../../../_enums/button-new/button-new-icon-style-type.enum");
+const field_type_enum_1 = require("../../../_enums/field-type.enum");
+const field_new_validator_type_enum_1 = require("../../../_enums/forms-new/field-new-validator-type.enum");
+const field_new_settings_control_model_1 = require("./field-new-settings.control-model");
+const DYNAMO_MATERIAL_ICON_PATTERN = '^[a-z0-9]+(?:_[a-z0-9]+)*$';
+/** Serializable Forms v2 Material Symbols picker settings. */
+class DyFM_IconPickerFieldNew_Settings extends field_new_settings_control_model_1.DyFM_FieldNew_Settings {
+    type = field_type_enum_1.DyFM_Field_Type.iconPicker;
+    /** Optional curated options. The UI supplies a default catalog when empty. */
+    options = [];
+    /** Preferred picker-grid column count. */
+    columns = 6;
+    /** Material Symbols font family used by the option preview. */
+    iconStyle = button_new_icon_style_type_enum_1.DyFM_ButtonNewIconStyleType.rounded;
+    /** Creates serializable icon-picker settings while protecting the discriminator. */
+    constructor(set) {
+        super(set);
+        const rest = { ...set };
+        Reflect.deleteProperty(rest, 'type');
+        Object.assign(this, rest);
+        this.options = this.options ?? [];
+        const validators = this.validators ?? [];
+        const hasMaterialIconValidator = validators.some((validator) => validator.type === field_new_validator_type_enum_1.DyFM_FieldNew_Validator_Type.pattern
+            && validator.value === DYNAMO_MATERIAL_ICON_PATTERN);
+        if (!hasMaterialIconValidator) {
+            this.validators = [
+                ...validators,
+                {
+                    type: field_new_validator_type_enum_1.DyFM_FieldNew_Validator_Type.pattern,
+                    value: DYNAMO_MATERIAL_ICON_PATTERN,
+                    message: 'Enter a Material icon name such as rocket_launch.',
+                },
+            ];
+        }
+    }
+}
+exports.DyFM_IconPickerFieldNew_Settings = DyFM_IconPickerFieldNew_Settings;
+//# sourceMappingURL=icon-picker-field-new-settings.control-model.js.map

package/build/_modules/ngx-models/_models/control-models/forms-new/icon-picker-field-new-settings.control-model.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-picker-field-new-settings.control-model.js","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/icon-picker-field-new-settings.control-model.ts"],"names":[],"mappings":";;;AAAA,gHAAyG;AACzG,qEAAkE;AAClE,2GAAuG;AACvG,yFAG4C;AAG5C,MAAM,4BAA4B,GAAW,4BAA4B,CAAC;AAE1E,8DAA8D;AAC9D,MAAa,gCAAiC,SAAQ,yDAA8B;IAChE,IAAI,GAA+B,iCAAe,CAAC,UAAU,CAAC;IAEhF,8EAA8E;IAC9E,OAAO,GAAiC,EAAE,CAAC;IAE3C,0CAA0C;IAC1C,OAAO,GAAW,CAAC,CAAC;IAEpB,+DAA+D;IAC/D,SAAS,GAAgC,6DAA2B,CAAC,OAAO,CAAC;IAE7E,oFAAoF;IACpF,YAAY,GAA8C;QACxD,KAAK,CAAC,GAAG,CAAC,CAAC;QACX,MAAM,IAAI,GAA8C,EAAE,GAAG,GAAG,EAAE,CAAC;QAEnE,OAAO,CAAC,cAAc,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;QACrC,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,IAAI,EAAE,CAAC;QAElC,MAAM,UAAU,GAAyC,IAAI,CAAC,UAAU,IAAI,EAAE,CAAC;QAC/E,MAAM,wBAAwB,GAAY,UAAU,CAAC,IAAI,CACvD,CAAC,SAA6C,EAAW,EAAE,CACzD,SAAS,CAAC,IAAI,KAAK,4DAA4B,CAAC,OAAO;eACpD,SAAS,CAAC,KAAK,KAAK,4BAA4B,CACtD,CAAC;QAEF,IAAI,CAAC,wBAAwB,EAAE,CAAC;YAC9B,IAAI,CAAC,UAAU,GAAG;gBAChB,GAAG,UAAU;gBACb;oBACE,IAAI,EAAE,4DAA4B,CAAC,OAAO;oBAC1C,KAAK,EAAE,4BAA4B;oBACnC,OAAO,EAAE,mDAAmD;iBAC7D;aACF,CAAC;QACJ,CAAC;IACH,CAAC;CACF;AAvCD,4EAuCC"}

package/build/_modules/ngx-models/_models/control-models/forms-new/index.d.ts

@@ -7,6 +7,9 @@ export * from './slider-field-new-settings.control-model';
 export * from './slider-range-field-new-settings.control-model';
 export * from './checkbox-field-new-settings.control-model';
 export * from './color-picker-field-new-settings.control-model';
+export * from './emoji-picker-field-new-settings.control-model';
+export * from './icon-picker-field-new-settings.control-model';
+export * from './picker-field-new-option.interface';
 export * from './select-field-new-settings.control-model';
 export * from './multiselect-field-new-settings.control-model';
 export * from './radio-select-field-new-settings.control-model';

package/build/_modules/ngx-models/_models/control-models/forms-new/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/index.ts"],"names":[],"mappings":"AAGA,cAAc,oCAAoC,CAAC;AACnD,cAAc,yCAAyC,CAAC;AACxD,cAAc,6CAA6C,CAAC;AAC5D,cAAc,2CAA2C,CAAC;AAC1D,cAAc,6CAA6C,CAAC;AAC5D,cAAc,2CAA2C,CAAC;AAC1D,cAAc,iDAAiD,CAAC;AAChE,cAAc,6CAA6C,CAAC;AAC5D,cAAc,iDAAiD,CAAC;AAChE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,gDAAgD,CAAC;AAC/D,cAAc,iDAAiD,CAAC;AAChE,cAAc,yCAAyC,CAAC;AACxD,cAAc,6CAA6C,CAAC;AAC5D,cAAc,+CAA+C,CAAC;AAC9D,cAAc,mDAAmD,CAAC;AAClE,cAAc,mCAAmC,CAAC;AAClD,cAAc,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/index.ts"],"names":[],"mappings":"AAGA,cAAc,oCAAoC,CAAC;AACnD,cAAc,yCAAyC,CAAC;AACxD,cAAc,6CAA6C,CAAC;AAC5D,cAAc,2CAA2C,CAAC;AAC1D,cAAc,6CAA6C,CAAC;AAC5D,cAAc,2CAA2C,CAAC;AAC1D,cAAc,iDAAiD,CAAC;AAChE,cAAc,6CAA6C,CAAC;AAC5D,cAAc,iDAAiD,CAAC;AAChE,cAAc,iDAAiD,CAAC;AAChE,cAAc,gDAAgD,CAAC;AAC/D,cAAc,qCAAqC,CAAC;AACpD,cAAc,2CAA2C,CAAC;AAC1D,cAAc,gDAAgD,CAAC;AAC/D,cAAc,iDAAiD,CAAC;AAChE,cAAc,yCAAyC,CAAC;AACxD,cAAc,6CAA6C,CAAC;AAC5D,cAAc,+CAA+C,CAAC;AAC9D,cAAc,mDAAmD,CAAC;AAClE,cAAc,mCAAmC,CAAC;AAClD,cAAc,mBAAmB,CAAC"}

package/build/_modules/ngx-models/_models/control-models/forms-new/index.js

@@ -12,6 +12,9 @@ tslib_1.__exportStar(require("./slider-field-new-settings.control-model"), expor
 tslib_1.__exportStar(require("./slider-range-field-new-settings.control-model"), exports);
 tslib_1.__exportStar(require("./checkbox-field-new-settings.control-model"), exports);
 tslib_1.__exportStar(require("./color-picker-field-new-settings.control-model"), exports);
+tslib_1.__exportStar(require("./emoji-picker-field-new-settings.control-model"), exports);
+tslib_1.__exportStar(require("./icon-picker-field-new-settings.control-model"), exports);
+tslib_1.__exportStar(require("./picker-field-new-option.interface"), exports);
 tslib_1.__exportStar(require("./select-field-new-settings.control-model"), exports);
 tslib_1.__exportStar(require("./multiselect-field-new-settings.control-model"), exports);
 tslib_1.__exportStar(require("./radio-select-field-new-settings.control-model"), exports);

package/build/_modules/ngx-models/_models/control-models/forms-new/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/index.ts"],"names":[],"mappings":";AAAA,iEAAiE;AACjE,kCAAkC;;;AAElC,6EAAmD;AACnD,kFAAwD;AACxD,sFAA4D;AAC5D,oFAA0D;AAC1D,sFAA4D;AAC5D,oFAA0D;AAC1D,0FAAgE;AAChE,sFAA4D;AAC5D,0FAAgE;AAChE,oFAA0D;AAC1D,yFAA+D;AAC/D,0FAAgE;AAChE,kFAAwD;AACxD,sFAA4D;AAC5D,wFAA8D;AAC9D,4FAAkE;AAClE,4EAAkD;AAClD,4DAAkC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/index.ts"],"names":[],"mappings":";AAAA,iEAAiE;AACjE,kCAAkC;;;AAElC,6EAAmD;AACnD,kFAAwD;AACxD,sFAA4D;AAC5D,oFAA0D;AAC1D,sFAA4D;AAC5D,oFAA0D;AAC1D,0FAAgE;AAChE,sFAA4D;AAC5D,0FAAgE;AAChE,0FAAgE;AAChE,yFAA+D;AAC/D,8EAAoD;AACpD,oFAA0D;AAC1D,yFAA+D;AAC/D,0FAAgE;AAChE,kFAAwD;AACxD,sFAA4D;AAC5D,wFAA8D;AAC9D,4FAAkE;AAClE,4EAAkD;AAClD,4DAAkC"}

package/build/_modules/ngx-models/_models/control-models/forms-new/picker-field-new-option.interface.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Serializable option shared by the Forms v2 emoji and icon pickers.
+ */
+export interface DyFM_PickerFieldNew_Option {
+    value: string;
+    label: string;
+    keywords?: string[];
+    disabled?: boolean;
+}
+//# sourceMappingURL=picker-field-new-option.interface.d.ts.map

package/build/_modules/ngx-models/_models/control-models/forms-new/picker-field-new-option.interface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"picker-field-new-option.interface.d.ts","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/picker-field-new-option.interface.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB"}

package/build/_modules/ngx-models/_models/control-models/forms-new/picker-field-new-option.interface.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=picker-field-new-option.interface.js.map

package/build/_modules/ngx-models/_models/control-models/forms-new/picker-field-new-option.interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"picker-field-new-option.interface.js","sourceRoot":"","sources":["../../../../../../src/_modules/ngx-models/_models/control-models/forms-new/picker-field-new-option.interface.ts"],"names":[],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@futdevpro/fsm-dynamo",
-  "version": "1.20.7",
+  "version": "1.20.9",
   "description": "Full Stack Model Collection for Dynamic (NodeJS-Typescript) Framework called Dynamo, by Future Development Ltd.",
   "DyBu_settings": {
     "packageType": "full-stack-package",

package/src/_modules/ngx-models/_enums/field-type.enum.ts

@@ -18,10 +18,12 @@ export enum DyFM_Field_Type {
   sliderRange = 'sliderRange',
   select = 'select',
   multiselect = 'multiselect',
-  chipSelect = 'chipSelect', //
-  chipMultiselect = 'chipMultiselect', //
+  chipSelect = 'chipSelect', //
+  chipMultiselect = 'chipMultiselect', //
   radioSelect = 'radioSelect', //
   colorPicker = 'color-picker',
+  emojiPicker = 'emoji-picker',
+  iconPicker = 'icon-picker',
   date = 'date',
   dateRange = 'dateRange',
   dateTime = 'dateTime',

package/src/_modules/ngx-models/_models/control-models/forms-new/color-picker-field-new-settings.control-model.ts

@@ -1,21 +1,44 @@
-import { DyFM_Field_Type } from '../../../_enums/field-type.enum';
-import { DyFM_FieldNew_Settings } from './field-new-settings.control-model';
-
-/**
- * Forms v2 color-picker settings.
- *
- * The string value uses the browser-native `#RRGGBB` color contract so the same
- * serializable Settings object can be shared by frontend and backend consumers.
- */
-export class DyFM_ColorPickerFieldNew_Settings extends DyFM_FieldNew_Settings<string> {
-  override readonly type: DyFM_Field_Type.colorPicker = DyFM_Field_Type.colorPicker;
-
-  /** Creates serializable color-picker settings while protecting the discriminator. */
-  constructor(set: Partial<DyFM_ColorPickerFieldNew_Settings>) {
-    super(set);
-    const rest: Partial<DyFM_ColorPickerFieldNew_Settings> = { ...set };
-
-    Reflect.deleteProperty(rest, 'type');
-    Object.assign(this, rest);
-  }
-}
+import { DyFM_Field_Type } from '../../../_enums/field-type.enum';
+import { DyFM_FieldNew_Validator_Type } from '../../../_enums/forms-new/field-new-validator-type.enum';
+import {
+  DyFM_FieldNew_Settings,
+  DyFM_FieldNew_Validator_Descriptor
+} from './field-new-settings.control-model';
+
+const DYNAMO_COLOR_PICKER_HEX_PATTERN: string = '^#[0-9a-fA-F]{6}$';
+
+/**
+ * Forms v2 color-picker settings.
+ *
+ * The string value uses the browser-native `#RRGGBB` color contract so the same
+ * serializable Settings object can be shared by frontend and backend consumers.
+ */
+export class DyFM_ColorPickerFieldNew_Settings extends DyFM_FieldNew_Settings<string> {
+  override readonly type: DyFM_Field_Type.colorPicker = DyFM_Field_Type.colorPicker;
+
+  /** Creates serializable color-picker settings while protecting the discriminator. */
+  constructor(set: Partial<DyFM_ColorPickerFieldNew_Settings>) {
+    super(set);
+    const rest: Partial<DyFM_ColorPickerFieldNew_Settings> = { ...set };
+
+    Reflect.deleteProperty(rest, 'type');
+    Object.assign(this, rest);
+
+    const validators: DyFM_FieldNew_Validator_Descriptor[] = this.validators ?? [];
+    const hasHexValidator: boolean = validators.some((validator: DyFM_FieldNew_Validator_Descriptor): boolean =>
+      validator.type === DyFM_FieldNew_Validator_Type.pattern
+      && validator.value === DYNAMO_COLOR_PICKER_HEX_PATTERN,
+    );
+
+    if (!hasHexValidator) {
+      this.validators = [
+        ...validators,
+        {
+          type: DyFM_FieldNew_Validator_Type.pattern,
+          value: DYNAMO_COLOR_PICKER_HEX_PATTERN,
+          message: 'Enter a color as #RRGGBB.',
+        },
+      ];
+    }
+  }
+}

package/src/_modules/ngx-models/_models/control-models/forms-new/emoji-picker-field-new-settings.control-model.ts

@@ -0,0 +1,24 @@
+import { DyFM_Field_Type } from '../../../_enums/field-type.enum';
+import { DyFM_FieldNew_Settings } from './field-new-settings.control-model';
+import { DyFM_PickerFieldNew_Option } from './picker-field-new-option.interface';
+
+/** Serializable Forms v2 emoji-picker settings. */
+export class DyFM_EmojiPickerFieldNew_Settings extends DyFM_FieldNew_Settings<string> {
+  override readonly type: DyFM_Field_Type.emojiPicker = DyFM_Field_Type.emojiPicker;
+
+  /** Optional curated options. The UI supplies a default catalog when empty. */
+  options: DyFM_PickerFieldNew_Option[] = [];
+
+  /** Preferred picker-grid column count. */
+  columns: number = 8;
+
+  /** Creates serializable emoji-picker settings while protecting the discriminator. */
+  constructor(set: Partial<DyFM_EmojiPickerFieldNew_Settings>) {
+    super(set);
+    const rest: Partial<DyFM_EmojiPickerFieldNew_Settings> = { ...set };
+
+    Reflect.deleteProperty(rest, 'type');
+    Object.assign(this, rest);
+    this.options = this.options ?? [];
+  }
+}

package/src/_modules/ngx-models/_models/control-models/forms-new/field-new-types.ts

@@ -1,9 +1,11 @@
-import { DyFM_CheckboxFieldNew_Settings } from './checkbox-field-new-settings.control-model';
-import { DyFM_ColorPickerFieldNew_Settings } from './color-picker-field-new-settings.control-model';
+import { DyFM_CheckboxFieldNew_Settings } from './checkbox-field-new-settings.control-model';
+import { DyFM_ColorPickerFieldNew_Settings } from './color-picker-field-new-settings.control-model';
 import { DyFM_DateFieldNew_Settings } from './date-field-new-settings.control-model';
 import { DyFM_DateRangeFieldNew_Settings } from './date-range-field-new-settings.control-model';
 import { DyFM_DateTimeFieldNew_Settings } from './datetime-field-new-settings.control-model';
-import { DyFM_DateTimeRangeFieldNew_Settings } from './datetime-range-field-new-settings.control-model';
+import { DyFM_DateTimeRangeFieldNew_Settings } from './datetime-range-field-new-settings.control-model';
+import { DyFM_EmojiPickerFieldNew_Settings } from './emoji-picker-field-new-settings.control-model';
+import { DyFM_IconPickerFieldNew_Settings } from './icon-picker-field-new-settings.control-model';
 import { DyFM_MultiselectFieldNew_Settings } from './multiselect-field-new-settings.control-model';
 import { DyFM_NumberFieldNew_Settings } from './number-field-new-settings.control-model';
 import { DyFM_PasswordFieldNew_Settings } from './password-field-new-settings.control-model';
@@ -33,9 +35,11 @@ export type DyFM_FieldNew_Settings_AnyType =
   | DyFM_PasswordFieldNew_Settings
   | DyFM_SliderFieldNew_Settings
   | DyFM_SliderRangeFieldNew_Settings
-  | DyFM_CheckboxFieldNew_Settings
+  | DyFM_CheckboxFieldNew_Settings
   | DyFM_ColorPickerFieldNew_Settings
-  | DyFM_SelectFieldNew_Settings<unknown>
+  | DyFM_EmojiPickerFieldNew_Settings
+  | DyFM_IconPickerFieldNew_Settings
+  | DyFM_SelectFieldNew_Settings<unknown>
   | DyFM_MultiselectFieldNew_Settings<unknown>
   | DyFM_RadioSelectFieldNew_Settings<unknown>
   | DyFM_DateFieldNew_Settings

package/src/_modules/ngx-models/_models/control-models/forms-new/forms-new.spec.ts

@@ -1,11 +1,14 @@
 import { DyFM_Field_Type } from '../../../_enums/field-type.enum';
 import { DyFM_FieldNew_Validator_Type } from '../../../_enums/forms-new/field-new-validator-type.enum';
 import {
-  DyFM_CheckboxFieldNew_Settings,
-  DyFM_ColorPickerFieldNew_Settings,
-  DyFM_DateFieldNew_Settings,
+  DyFM_CheckboxFieldNew_Settings,
+  DyFM_ColorPickerFieldNew_Settings,
+  DyFM_DateFieldNew_Settings,
+  DyFM_EmojiPickerFieldNew_Settings,
   DyFM_FieldNew_Settings,
-  DyFM_FormNew_Settings,
+  DyFM_FieldNew_Validator_Descriptor,
+  DyFM_FormNew_Settings,
+  DyFM_IconPickerFieldNew_Settings,
   DyFM_MultiselectFieldNew_Settings,
   DyFM_NumberFieldNew_Settings,
   DyFM_SelectFieldNew_Settings,
@@ -76,7 +79,7 @@ describe('| Forms v2 — Wave-1A Settings layer', () => {
     });
   });
 
-  describe('| DyFM_CheckboxFieldNew_Settings', () => {
+  describe('| DyFM_CheckboxFieldNew_Settings', () => {
     it('| default constructor + type is checkbox', () => {
       const s = new DyFM_CheckboxFieldNew_Settings({ key: 'done' });
       expect(s.type).toBe(DyFM_Field_Type.checkbox);
@@ -88,17 +91,67 @@ describe('| Forms v2 — Wave-1A Settings layer', () => {
       expect(s.mode).toBe('toggle');
       expect(s.labelPosition).toBe('before');
     });
+  });
+
+  describe('| DyFM_ColorPickerFieldNew_Settings', () => {
+    it('| stores a serializable hex value and owns the color-picker discriminator', () => {
+      const settings: DyFM_ColorPickerFieldNew_Settings = new DyFM_ColorPickerFieldNew_Settings({
+        key: 'accentColor',
+        defaultValue: '#22d3ee',
+      });
+
+      expect(settings.type).toBe(DyFM_Field_Type.colorPicker);
+      expect(settings.defaultValue).toBe('#22d3ee');
+      expect(settings.validators).toContain(jasmine.objectContaining({
+        type: DyFM_FieldNew_Validator_Type.pattern,
+        value: '^#[0-9a-fA-F]{6}$',
+        message: 'Enter a color as #RRGGBB.',
+      }));
+    });
+
+    it('| preserves consumer validators while adding the strict hexadecimal contract once', () => {
+      const settings: DyFM_ColorPickerFieldNew_Settings = new DyFM_ColorPickerFieldNew_Settings({
+        key: 'accentColor',
+        validators: [{ type: DyFM_FieldNew_Validator_Type.required }],
+      });
+
+      expect(settings.validators?.map(
+        (validator: DyFM_FieldNew_Validator_Descriptor): DyFM_FieldNew_Validator_Type => validator.type,
+      ))
+        .toEqual([DyFM_FieldNew_Validator_Type.required, DyFM_FieldNew_Validator_Type.pattern]);
+    });
   });
 
-  describe('| DyFM_ColorPickerFieldNew_Settings', () => {
-    it('| stores a serializable hex value and owns the color-picker discriminator', () => {
-      const settings: DyFM_ColorPickerFieldNew_Settings = new DyFM_ColorPickerFieldNew_Settings({
-        key: 'accentColor',
-        defaultValue: '#22d3ee',
+  describe('| DyFM_EmojiPickerFieldNew_Settings', () => {
+    it('| stores serializable options and protects the emoji-picker discriminator', () => {
+      const settings: DyFM_EmojiPickerFieldNew_Settings = new DyFM_EmojiPickerFieldNew_Settings({
+        key: 'reaction',
+        defaultValue: '🚀',
+        columns: 10,
+        options: [{ value: '🚀', label: 'Rocket', keywords: ['launch'] }],
+      });
+
+      expect(settings.type).toBe(DyFM_Field_Type.emojiPicker);
+      expect(settings.columns).toBe(10);
+      expect(settings.options[0].keywords).toEqual(['launch']);
+    });
+  });
+
+  describe('| DyFM_IconPickerFieldNew_Settings', () => {
+    it('| stores serializable options and adds the Material icon-name contract once', () => {
+      const settings: DyFM_IconPickerFieldNew_Settings = new DyFM_IconPickerFieldNew_Settings({
+        key: 'icon',
+        defaultValue: 'rocket_launch',
+        validators: [{ type: DyFM_FieldNew_Validator_Type.required }],
       });
 
-      expect(settings.type).toBe(DyFM_Field_Type.colorPicker);
-      expect(settings.defaultValue).toBe('#22d3ee');
+      expect(settings.type).toBe(DyFM_Field_Type.iconPicker);
+      expect(settings.validators).toContain(jasmine.objectContaining({
+        type: DyFM_FieldNew_Validator_Type.pattern,
+        value: '^[a-z0-9]+(?:_[a-z0-9]+)*$',
+        message: 'Enter a Material icon name such as rocket_launch.',
+      }));
+      expect(settings.validators?.length).toBe(2);
     });
   });
 

package/src/_modules/ngx-models/_models/control-models/forms-new/icon-picker-field-new-settings.control-model.ts

@@ -0,0 +1,52 @@
+import { DyFM_ButtonNewIconStyleType } from '../../../_enums/button-new/button-new-icon-style-type.enum';
+import { DyFM_Field_Type } from '../../../_enums/field-type.enum';
+import { DyFM_FieldNew_Validator_Type } from '../../../_enums/forms-new/field-new-validator-type.enum';
+import {
+  DyFM_FieldNew_Settings,
+  DyFM_FieldNew_Validator_Descriptor
+} from './field-new-settings.control-model';
+import { DyFM_PickerFieldNew_Option } from './picker-field-new-option.interface';
+
+const DYNAMO_MATERIAL_ICON_PATTERN: string = '^[a-z0-9]+(?:_[a-z0-9]+)*$';
+
+/** Serializable Forms v2 Material Symbols picker settings. */
+export class DyFM_IconPickerFieldNew_Settings extends DyFM_FieldNew_Settings<string> {
+  override readonly type: DyFM_Field_Type.iconPicker = DyFM_Field_Type.iconPicker;
+
+  /** Optional curated options. The UI supplies a default catalog when empty. */
+  options: DyFM_PickerFieldNew_Option[] = [];
+
+  /** Preferred picker-grid column count. */
+  columns: number = 6;
+
+  /** Material Symbols font family used by the option preview. */
+  iconStyle: DyFM_ButtonNewIconStyleType = DyFM_ButtonNewIconStyleType.rounded;
+
+  /** Creates serializable icon-picker settings while protecting the discriminator. */
+  constructor(set: Partial<DyFM_IconPickerFieldNew_Settings>) {
+    super(set);
+    const rest: Partial<DyFM_IconPickerFieldNew_Settings> = { ...set };
+
+    Reflect.deleteProperty(rest, 'type');
+    Object.assign(this, rest);
+    this.options = this.options ?? [];
+
+    const validators: DyFM_FieldNew_Validator_Descriptor[] = this.validators ?? [];
+    const hasMaterialIconValidator: boolean = validators.some(
+      (validator: DyFM_FieldNew_Validator_Descriptor): boolean =>
+        validator.type === DyFM_FieldNew_Validator_Type.pattern
+        && validator.value === DYNAMO_MATERIAL_ICON_PATTERN,
+    );
+
+    if (!hasMaterialIconValidator) {
+      this.validators = [
+        ...validators,
+        {
+          type: DyFM_FieldNew_Validator_Type.pattern,
+          value: DYNAMO_MATERIAL_ICON_PATTERN,
+          message: 'Enter a Material icon name such as rocket_launch.',
+        },
+      ];
+    }
+  }
+}

package/src/_modules/ngx-models/_models/control-models/forms-new/index.ts

@@ -8,9 +8,12 @@ export * from './number-field-new-settings.control-model';
 export * from './password-field-new-settings.control-model';
 export * from './slider-field-new-settings.control-model';
 export * from './slider-range-field-new-settings.control-model';
-export * from './checkbox-field-new-settings.control-model';
+export * from './checkbox-field-new-settings.control-model';
 export * from './color-picker-field-new-settings.control-model';
-export * from './select-field-new-settings.control-model';
+export * from './emoji-picker-field-new-settings.control-model';
+export * from './icon-picker-field-new-settings.control-model';
+export * from './picker-field-new-option.interface';
+export * from './select-field-new-settings.control-model';
 export * from './multiselect-field-new-settings.control-model';
 export * from './radio-select-field-new-settings.control-model';
 export * from './date-field-new-settings.control-model';

package/src/_modules/ngx-models/_models/control-models/forms-new/picker-field-new-option.interface.ts

@@ -0,0 +1,9 @@
+/**
+ * Serializable option shared by the Forms v2 emoji and icon pickers.
+ */
+export interface DyFM_PickerFieldNew_Option {
+  value: string;
+  label: string;
+  keywords?: string[];
+  disabled?: boolean;
+}