@futdevpro/fsm-dynamo 1.15.21 → 1.15.22

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

@@ -0,0 +1,20 @@
+/**
+ * Forms v2 (BL-FORMS-V2 Wave-1A) — validator descriptor enum.
+ *
+ * A Settings rétegen tárolt descriptor-ok az Angular `ValidatorFn`-ektől függetlenek
+ * (POJO, server-importálható). A dynamo-ngx-ben egy statikus util
+ * (`DyNX_FormsNewValidator_Util`) konvertálja `ValidatorFn`-re.
+ *
+ * @see _specifications/forms-v2/02-architecture-spec.md (3.1)
+ */
+export enum DyFM_FieldNew_Validator_Type {
+  required  = 'required',
+  minLength = 'minLength',
+  maxLength = 'maxLength',
+  pattern   = 'pattern',
+  min       = 'min',
+  max       = 'max',
+  email     = 'email',
+  /** Wave-1: a `custom` típus dob — registry/JSON-logic Wave-2-ben. */
+  custom    = 'custom',
+}

package/src/_modules/ngx-models/_enums/frames/header-item-type.enum.ts

@@ -0,0 +1,15 @@
+/**
+ * CCAP-mirror Wave-1a — Frame header item kind.
+ *
+ * Q9-paraméterezett `headerItems: DyFM_HeaderItem_Settings[]` lista
+ * elemei kit típusúak lehetnek. A renderer per-típus külön template-blokkot
+ * használ.
+ */
+export enum DyFM_HeaderItem_Type {
+  logo            = 'logo',
+  icon            = 'icon',
+  text            = 'text',
+  badgeIndicator  = 'badge-indicator',
+  spacer          = 'spacer',
+  custom          = 'custom',
+}

package/src/_modules/ngx-models/_enums/frames/header-position.enum.ts

@@ -0,0 +1,10 @@
+/**
+ * CCAP-mirror Wave-1a — Frame header item layout position.
+ *
+ * A renderer `flex` layout-jával 3 oldal-szegmenset támogat.
+ */
+export enum DyFM_Header_Position {
+  left   = 'left',
+  center = 'center',
+  right  = 'right',
+}

package/src/_modules/ngx-models/_enums/frames/side-nav-badge-color.enum.ts

@@ -0,0 +1,13 @@
+/**
+ * CCAP-mirror Wave-1a — Side-nav item badge color.
+ *
+ * Q11-bind-olt `badgeSignal` melletti vizuális token. A renderer
+ * `bg-amber-500`, `text-red-400` stb. Tailwind utility-class-eket alkalmaz.
+ */
+export enum DyFM_SideNavBadge_Color {
+  amber   = 'amber',
+  red     = 'red',
+  green   = 'green',
+  cyan    = 'cyan',
+  fuchsia = 'fuchsia',
+}

package/src/_modules/ngx-models/_enums/html/input-types.enum.ts

@@ -0,0 +1,27 @@
+
+/** HTML input element types. */
+export enum DyFM_HTMLInput_Type {
+  button = 'button',
+  checkbox = 'checkbox',
+  color = 'color',
+  date = 'date',
+  datetimeLocal = 'datetime-local',
+  email = 'email',
+  file = 'file',
+  hidden = 'hidden',
+  image = 'image',
+  month = 'month',
+  number = 'number',
+  password = 'password',
+  radio = 'radio',
+  range = 'range',
+  reset = 'reset',
+  search = 'search',
+  submit = 'submit',
+  tel = 'tel',
+  text = 'text',
+  time = 'time',
+  url = 'url',
+  week = 'week',
+}
+

package/src/_modules/ngx-models/_enums/material-color.enum.ts

@@ -0,0 +1,16 @@
+
+
+/**
+ * Angular Material color palette identifiers.
+ */
+export enum DyFM_MaterialColor {
+  primary = 'primary',
+  accent = 'accent',
+  warn = 'warn',
+  none = '',
+}
+
+/**
+ * List of every available material color.
+ */
+export const DyFM_allMaterialColors: DyFM_MaterialColor[] = Object.values(DyFM_MaterialColor);

package/src/_modules/ngx-models/_enums/material-tooltip-position.enum.ts

@@ -0,0 +1,17 @@
+
+
+
+
+/**
+ * Position of Material tooltip relative to the element.
+ */
+export enum DyFM_MaterialTooltipPosition {
+  above = 'above',
+  below = 'below',
+  before = 'before',
+  after = 'after',
+  left = 'left',
+  right = 'right',
+}
+
+export const DyFM_allMaterialTooltipPositions: DyFM_MaterialTooltipPosition[] = Object.values(DyFM_MaterialTooltipPosition);

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

@@ -0,0 +1,8 @@
+
+/**
+ * Commonly used field types with built-in validators.
+ */
+export enum DyFM_PreconfiguredField_Type {
+  email = 'email',
+  phone = 'phone',
+}

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

@@ -0,0 +1,15 @@
+
+
+/**
+ * Supported storage mediums used by the services.
+ */
+export enum DyFM_Storage_Type {
+  session = 'session',
+  local = 'local',
+  none = '',
+
+  /* 
+  dataBase = 'dataBase', 
+  cookie = 'cookie',
+  */
+}

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

@@ -0,0 +1,9 @@
+
+
+
+/**
+ * Additional validator types used by Dynamo forms.
+ */
+export enum DyFM_Validator_Type {
+  requiredCheckbox = 'requiredCheckbox',
+}

package/src/_modules/ngx-models/_enums/voice/audio-mime-type.enum.ts

@@ -0,0 +1,14 @@
+/**
+ * CCAP-mirror Wave-1a — Audio MIME types for MediaRecorder.
+ *
+ * A `DyNX_VoiceRecorder_ControlService` futás-időben capability-detect-tel
+ * választ közülük (`MediaRecorder.isTypeSupported()`). Chrome → `webm/opus`,
+ * Safari → `mp4`, Firefox → `webm`/`ogg`.
+ */
+export enum DyFM_AudioMime_Type {
+  webmOpus = 'audio/webm;codecs=opus',
+  webm     = 'audio/webm',
+  mp4      = 'audio/mp4',
+  ogg      = 'audio/ogg',
+  wav      = 'audio/wav',
+}

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

@@ -0,0 +1,26 @@
+/**
+ * CCAP-mirror Wave-1a — Agnostic voice provider type enum (Q8 + Q12).
+ *
+ * STT (Speech-to-Text) + TTS (Text-to-Speech) provider azonosítók. A
+ * `DyNX_VoiceTranscribe_ControlService` és `DyNX_VoiceSpeak_ControlService`
+ * registry-knek instance-ID-ként szolgálnak.
+ *
+ * Wave-1: `openAiWhisper`, `openAiTts`, `elevenLabsScribe`, `elevenLabsTts`,
+ *         `browserSpeechRecognition`, `browserSpeechSynthesis`.
+ * Wave-N: `vosk`, `whisperWasm`.
+ *
+ * @see _specifications/ccap-mirror/02-architecture-spec.md (K szakasz)
+ */
+export enum DyFM_VoiceProvider_Type {
+  // STT
+  openAiWhisper            = 'openai-whisper',
+  elevenLabsScribe         = 'elevenlabs-scribe',
+  browserSpeechRecognition = 'browser-speech-recognition',
+  // TTS
+  openAiTts                = 'openai-tts',
+  elevenLabsTts            = 'elevenlabs-tts',
+  browserSpeechSynthesis   = 'browser-speech-synthesis',
+  // Wave-N (placeholder)
+  vosk                     = 'vosk',
+  whisperWasm              = 'whisper-wasm',
+}

package/src/_modules/ngx-models/_enums/voice/voice-recorder-state.enum.ts

@@ -0,0 +1,20 @@
+/**
+ * CCAP-mirror Wave-1a — Voice recorder state machine.
+ *
+ * A POS-POC `SpeechRecognitionStatus` enum mirror-je
+ * (LIVE-projects/ccap/.../a-sound-recorder.control-service.ts), kibővítve a
+ * Dynamo-naming-konvencióval.
+ *
+ * State-flow:
+ *   stopped → listening → recording → break → recording → ... → stopped
+ *   bárhonnan → error
+ *
+ * @see _specifications/ccap-mirror/02-architecture-spec.md (K szakasz)
+ */
+export enum DyFM_VoiceRecorder_State {
+  stopped   = 'stopped',
+  listening = 'listening',
+  recording = 'recording',
+  break     = 'break',
+  error     = 'error',
+}

package/src/_modules/ngx-models/_models/control-models/button-new-style-settings.control-model.ts

@@ -0,0 +1,37 @@
+
+import { DyFM_ButtonNewBorderRadius } from '../../_enums/button-new/button-new-border-radius.enum';
+import { DyFM_ButtonNewIconStyleType } from '../../_enums/button-new/button-new-icon-style-type.enum';
+import { DyFM_ButtonNewSize } from '../../_enums/button-new/button-new-size.enum';
+import { DyFM_ButtonNewStyleType } from '../../_enums/button-new/button-new-style-type.enum';
+import { DyFM_MaterialColor } from '../../_enums/material-color.enum';
+
+/**
+ * Configures the visual appearance of the new button component.
+ *
+ * @example
+ * ```ts
+ * const preset = new DyFM_ButtonNewStyle_Settings({ size: DyFM_ButtonNewSize.xs });
+ * ```
+ */
+export class DyFM_ButtonNewStyle_Settings {
+  size?: DyFM_ButtonNewSize = DyFM_ButtonNewSize.medium;
+  color?: DyFM_MaterialColor | string = DyFM_MaterialColor.primary;
+  styleType?: DyFM_ButtonNewStyleType = DyFM_ButtonNewStyleType.filled;
+  borderRadius?: DyFM_ButtonNewBorderRadius = DyFM_ButtonNewBorderRadius.smallRadius;
+
+  isIconButton?: boolean;
+  iconFill?: boolean;
+  iconStyle?: DyFM_ButtonNewIconStyleType = DyFM_ButtonNewIconStyleType.rounded;
+
+  constructor(
+    set?: DyFM_ButtonNewStyle_Settings,
+  ) {
+    if (set) {
+      Object.assign(this, set);
+    }
+
+    if (this.isIconButton && !this.iconStyle) {
+      this.iconStyle = DyFM_ButtonNewIconStyleType.rounded;
+    } 
+  }
+}

package/src/_modules/ngx-models/_models/control-models/button-params.control-model.spec.ts

@@ -0,0 +1,70 @@
+
+import { DyFM_Button_Type } from '../../_enums/button-type.enum';
+import { DyFM_MaterialColor } from '../../_enums/material-color.enum';
+import { DyFM_MaterialTooltipPosition } from '../../_enums/material-tooltip-position.enum';
+import { D_Button_Params, DyFM_Button_Params } from './button-params.control-model';
+
+describe('| DyFM_Button_Params', () => {
+  it('| should create an instance with default values', () => {
+    const buttonParams = new DyFM_Button_Params();
+
+    expect(buttonParams.type).toBe(DyFM_Button_Type.default);
+    expect(buttonParams.color).toBe(DyFM_MaterialColor.primary);
+    expect(buttonParams.descriptionPosition).toBeUndefined();
+    expect(buttonParams.descriptionDelay).toBeUndefined();
+    expect(buttonParams.class).toContain('disabled:cursor-not-allowed');
+    expect(buttonParams.contentClass).toContain('flex items-center justify-center');
+  });
+
+  it('| should assign provided values', () => {
+    const settings: Partial<D_Button_Params> = {
+      label: 'Test Button',
+      color: DyFM_MaterialColor.accent,
+      type: DyFM_Button_Type.icon,
+      description: 'Test Description'
+    };
+    const buttonParams = new DyFM_Button_Params(settings);
+
+    expect(buttonParams.label).toBe('Test Button');
+    expect(buttonParams.color).toBe(DyFM_MaterialColor.accent);
+    expect(buttonParams.type).toBe(DyFM_Button_Type.icon);
+    expect(buttonParams.description).toBe('Test Description');
+    expect(buttonParams.descriptionPosition).toBe(DyFM_MaterialTooltipPosition.above);
+    expect(buttonParams.descriptionDelay).toBe(250);
+  });
+
+  it('| should generate id if not provided', () => {
+    const settings: Partial<D_Button_Params> = {
+      label: 'Test Button',
+      type: DyFM_Button_Type.icon
+    };
+    const buttonParams = new DyFM_Button_Params(settings);
+
+    expect(buttonParams.id).toBe('Test Button-icon-primary-button');
+  });
+
+  it('| should execute onClickEvents', async () => {
+    const mockEvent1 = jasmine.createSpy('mockEvent1');
+    const mockEvent2 = jasmine.createSpy('mockEvent2');
+    const buttonParams = new DyFM_Button_Params({
+      onClickEvents: [mockEvent1, mockEvent2]
+    });
+
+    await buttonParams.executeEvents('click' as any);
+
+    expect(mockEvent1).toHaveBeenCalled();
+    expect(mockEvent2).toHaveBeenCalled();
+  });
+
+  it('| should set classes based on type and color', () => {
+    const settings: Partial<D_Button_Params> = {
+      type: DyFM_Button_Type.stroked,
+      color: DyFM_MaterialColor.warn
+    };
+    const buttonParams = new DyFM_Button_Params(settings);
+
+    expect(buttonParams.class).toContain('border-warn-500');
+    expect(buttonParams.class).toContain('text-warn-500');
+    expect(buttonParams.class).toContain('hover:bg-warn-950');
+  });
+});

package/src/_modules/ngx-models/_models/control-models/button-params.control-model.ts

@@ -0,0 +1,332 @@
+
+import { DyFM_Array } from '../../../..';
+import { DyFM_Button_Type } from '../../_enums/button-type.enum';
+import { DyFM_MaterialColor } from '../../_enums/material-color.enum';
+import { DyFM_MaterialTooltipPosition } from '../../_enums/material-tooltip-position.enum';
+
+const defaultDescriptionPosition = DyFM_MaterialTooltipPosition.above;
+const defaultDescriptionDelay = 250;
+
+/* export interface DyFM_Button_Settings {
+
+} */
+
+export type DyFM_Button_Settings = Partial<DyFM_Button_Params>;
+
+/* type eventType = (mouseEvent?: MouseEvent) => void; */
+export type D_Button_P = DyFM_Button_Params;
+export type D_Button_Params = DyFM_Button_Params;
+
+/**
+ * Runtime configuration for a button instance.
+ * Handles style, behaviour and routing options.
+ *
+ * @example
+ * ```ts
+ * const btn = new DyFM_Button_Params({ label: 'Save' });
+ * ```
+ * 
+ * @deprecated use DyFM_ButtonNew_Params instead
+ */
+export class DyFM_Button_Params {
+  id?: string;
+  label?: string;
+  color?: DyFM_MaterialColor | string = DyFM_MaterialColor.primary;
+  /** https://fonts.google.com/icons */
+  icon?: string;
+  description?: string;
+  descriptionPosition?: DyFM_MaterialTooltipPosition;
+  descriptionDelay?: number;
+  type?: DyFM_Button_Type;
+  disabled?: boolean;
+  dontRoute?: boolean;
+  routerLink?: string;
+  routerLinkQueryParams?: any;
+  iconAfter?: boolean;
+  buttonType?: string;
+
+  // runtime values
+  class?: string;
+  contentClass?: string;
+  classOnActive?: string;
+  contentClassOnActive?: string;
+
+  // setting values
+  customClass?: string;
+  customContentClass?: string;
+  customClassOnActive?: string;
+  customContentClassOnActive?: string;
+
+  /* events?: eventType[] = []; */
+  /* onClick?: (mouseEvent?: MouseEvent) => Promise<void> | void; */
+  onClickEvents?: ((mouseEvent?: MouseEvent) => Promise<void> | void)[] = [];
+  useDisablerWhileEventsInProgress?: boolean;
+  
+  constructor(
+    set?: Partial<DyFM_Button_Settings>
+  ) {
+    if (set) {
+      Object.assign(this, set);
+    }
+
+    if (!this.type) {
+      if (this.icon && !this.label) {
+        this.type = DyFM_Button_Type.icon;
+      } else {
+        this.type = DyFM_Button_Type.default;
+      }
+    }
+
+    if (!this.id) {
+      this.id = `${this.label}-${this.type}-${this.color}-button`;
+    }
+
+    if (this.description || (this.type.includes('icon') && this.label)) {
+      if (!this.descriptionPosition) {
+        this.descriptionPosition = defaultDescriptionPosition;
+      }
+
+      if (!this.descriptionDelay) {
+        this.descriptionDelay = defaultDescriptionDelay;
+      }
+    }
+
+    this.class = getDefaultButtonClasses(
+      this.type, 
+      this.color,
+    ) + (this.customClass ?? '');
+
+    this.contentClass = getCustomContentClasses(
+      this.type,
+      this.customContentClass
+    ) + (this.customContentClass ?? '');
+
+    if (this.customClassOnActive || this.routerLink) {
+      this.classOnActive = getDefaultOnActiveButtonClasses(
+        this.type, 
+        this.color,
+      ) + (this.customClassOnActive ?? '');
+
+      this.contentClassOnActive = this.customContentClassOnActive ?? '';
+    }
+  }
+
+  async executeEvents(mouseEvent: MouseEvent): Promise<void> {
+    await DyFM_Array.asyncForEach(
+      this.onClickEvents,
+      async (event: (mouseEvent?: MouseEvent) => Promise<void> | void) => {
+        await event(mouseEvent);
+      }
+    );
+  }
+}
+
+function getDefaultButtonClasses(
+  type: DyFM_Button_Type, 
+  color: DyFM_MaterialColor | string,
+  dark: boolean = true
+): string {
+  let classes = '';
+
+  if (dark) {
+    classes += 'disabled:bg-neutral-800 ';
+    classes += 'disabled:hover:bg-neutral-600 ';
+    classes += 'disabled:text-neutral-600 ';
+    classes += 'disabled:hover:text-neutral-900 ';
+  } else {
+    classes += 'disabled:bg-neutral-200 ';
+    classes += 'disabled:hover:bg-neutral-400 ';
+    classes += 'disabled:text-neutral-400 ';
+    classes += 'disabled:hover:text-neutral-100 ';
+  }
+
+  classes += 'disabled:cursor-not-allowed ';
+
+  switch (type) {
+    case DyFM_Button_Type.default:
+    case DyFM_Button_Type.stroked:
+      classes += 'rounded-xl ';
+      break;
+
+    case DyFM_Button_Type.small:
+    case DyFM_Button_Type.smallStroked:
+      classes += 'rounded-md ';
+      break;
+
+    case DyFM_Button_Type.big:
+    case DyFM_Button_Type.bigStroked:
+      classes += 'rounded-2xl ';
+      break;
+  }
+
+  if (type.includes('stroked')) {
+    if (type.includes('big')) {
+      classes += 'border-4 ';
+    } else {
+      classes += 'border-2 ';
+    }
+
+    classes += `border-${color}-500 `;
+    classes += `text-${color}-500 `;
+    /* classes += `hover:text-${color}C-500 `; */
+
+    if (dark) {
+      classes += `hover:bg-${color}-950 `;
+      classes += `disabled:border-neutral-600 `;
+    } else {
+      classes += `hover:bg-${color}-50 `;
+      classes += `disabled:border-neutral-400 `;
+    }
+  } else {
+    classes += `bg-${color}-500 `;
+    classes += `text-${color}C-500 `;
+
+    if (dark) {
+      classes += `hover:bg-${color}-300 `;
+      classes += `hover:text-${color}C-300 `;
+    } else {
+      classes += `hover:bg-${color}-700 `;
+      classes += `hover:text-${color}C-700 `;
+    }
+  }
+
+  if (type.includes('round')) {
+    classes += 'rounded-full ';
+  }
+
+  if (type.includes('icon')) {
+    classes += 'rounded-full ';
+  } else {
+    classes += 'w-full ';
+  }
+
+  if (type.includes('outstanding')) {
+    classes += 'outstanding ';
+
+    if (!classes.includes('rounded-full')) {
+      classes += 'rounded-full ';
+    }
+  }
+
+  return classes;
+}
+
+function getDefaultOnActiveButtonClasses(
+  type: DyFM_Button_Type, 
+  color: DyFM_MaterialColor | string,
+  dark: boolean = true
+): string {
+  let classes = ' ';
+
+  if (type.includes('stroked')) {
+    if (dark) {
+      classes += `bg-${color}-950 `;
+    } else {
+      classes += `bg-${color}-50 `;
+    }
+  } else {
+    if (dark) {
+      classes += `bg-${color}-300 `;
+      classes += `text-${color}C-300 `;
+    } else {
+      classes += `bg-${color}-700 `;
+      classes += `text-${color}C-700 `;
+    }
+  }
+
+  return classes;
+}
+
+function getCustomContentClasses(
+  type: DyFM_Button_Type, 
+  customClass?: string
+): string {
+  let classes = 'flex ';
+
+  if (!customClass?.includes('items-')) {
+    classes += 'items-center ';
+  }
+
+  if (!customClass?.includes('justify-')) {
+    classes += 'justify-center ';
+  }
+
+  if (!type.includes('icon')) {
+    if (type.includes('big')) {
+      classes += 'text-2xl ';
+    } else {
+      classes += 'text-md ';
+    }
+  }
+
+  if (!type.includes('icon')) {
+    if (type.includes('small')) {
+      classes += 'mx-2 ';
+    } else {
+      classes += 'mx-5 ';
+    }
+  }
+
+  switch (type) {
+    case DyFM_Button_Type.default:
+    case DyFM_Button_Type.block:
+      classes += 'my-3 ';
+      break;
+
+    case DyFM_Button_Type.stroked:
+    case DyFM_Button_Type.strokedBlock:
+      classes += 'my-2.5 ';
+      break;
+
+    case DyFM_Button_Type.big:
+    case DyFM_Button_Type.bigBlock:
+    case DyFM_Button_Type.bigStroked:
+    case DyFM_Button_Type.bigStrokedBlock:
+      classes += 'my-3 ';
+      break;
+
+    case DyFM_Button_Type.round:
+      classes += 'my-3 ';
+      break;
+
+    case DyFM_Button_Type.strokedRound:
+      classes += 'my-2.5 ';
+      break;
+
+    case DyFM_Button_Type.outstanding:
+      classes += 'my-3 ';
+      break;
+
+    case DyFM_Button_Type.icon:
+      classes += 'p-2 ';
+      classes += 'text-2xl ';
+      break;
+
+    case DyFM_Button_Type.iconStroked:
+      classes += 'p-1.5 ';
+      classes += 'text-2xl ';
+      break;
+
+    case DyFM_Button_Type.iconSmall:
+    case DyFM_Button_Type.iconSmallStroked:
+      classes += 'p-1 ';
+      classes += 'text-lg ';
+      break;
+
+    case DyFM_Button_Type.iconBig:
+      classes += 'p-4 ';
+      classes += 'text-4xl ';
+      break;
+
+    case DyFM_Button_Type.iconBigStroked:
+      classes += 'p-3 ';
+      classes += 'text-4xl ';
+      break;
+
+    case DyFM_Button_Type.iconOutstanding:
+      classes += 'p-2.5 ';
+      break;
+  }
+
+  return classes;
+}