@futdevpro/fsm-dynamo 1.20.7 → 1.20.8

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

@@ -5,8 +5,10 @@
 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.
+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
 
@@ -16,5 +18,6 @@ of `@futdevpro/ngx-dynamo`; this package owns only the framework-independent con
 
 ## 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.
+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/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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@futdevpro/fsm-dynamo",
-  "version": "1.20.7",
+  "version": "1.20.8",
   "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/_models/control-models/forms-new/color-picker-field-new-settings.control-model.ts

@@ -1,5 +1,11 @@
 import { DyFM_Field_Type } from '../../../_enums/field-type.enum';
-import { DyFM_FieldNew_Settings } from './field-new-settings.control-model';
+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.
@@ -17,5 +23,22 @@ export class DyFM_ColorPickerFieldNew_Settings extends DyFM_FieldNew_Settings<st
 
     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/forms-new.spec.ts

@@ -3,8 +3,9 @@ import { DyFM_FieldNew_Validator_Type } from '../../../_enums/forms-new/field-ne
 import {
   DyFM_CheckboxFieldNew_Settings,
   DyFM_ColorPickerFieldNew_Settings,
-  DyFM_DateFieldNew_Settings,
-  DyFM_FieldNew_Settings,
+  DyFM_DateFieldNew_Settings,
+  DyFM_FieldNew_Settings,
+  DyFM_FieldNew_Validator_Descriptor,
   DyFM_FormNew_Settings,
   DyFM_MultiselectFieldNew_Settings,
   DyFM_NumberFieldNew_Settings,
@@ -99,6 +100,23 @@ describe('| Forms v2 — Wave-1A Settings layer', () => {
 
       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]);
     });
   });