@sdcorejs/angular 21.0.1 → 21.0.3

package/fesm2022/sdcorejs-angular-services-notify.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"sdcorejs-angular-services-notify.mjs","sources":["../../../projects/sdcorejs-angular/services/notify/src/components/toast/toast.component.ts","../../../projects/sdcorejs-angular/services/notify/src/components/toast/toast.component.html","../../../projects/sdcorejs-angular/services/notify/src/components/toast-container.component.ts","../../../projects/sdcorejs-angular/services/notify/src/notify.service.ts","../../../projects/sdcorejs-angular/services/notify/sdcorejs-angular-services-notify.ts"],"sourcesContent":["import { Component, Input, signal, HostListener, OnInit, OnDestroy } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { animate, style, transition, trigger } from '@angular/animations';\nimport { TranslatePipe } from '@sdcorejs/angular/i18n';\nimport { ToastData } from '../../notify.model';\nimport { SdNotifyService } from '../../notify.service';\n\n@Component({\n  selector: 'toast',\n  standalone: true,\n  imports: [CommonModule, TranslatePipe],\n  templateUrl: './toast.component.html',\n  styleUrls: ['./toast.component.scss'],\n  animations: [\n    trigger('toastAnimation', [\n      transition(':enter', [\n        style({ transform: 'translateX(100%)', opacity: 0 }),\n        animate('300ms ease-out', style({ transform: 'translateX(0)', opacity: 1 }))\n      ]),\n      transition(':leave', [\n        animate('200ms ease-in', style({ transform: 'translateX(100%)', opacity: 0 }))\n      ])\n    ])\n  ],\n  host: {\n    '[@toastAnimation]': 'true',\n    '[class]': '\"bg-white sd-toast\"'\n  }\n})\nexport class ToastComponent implements OnInit, OnDestroy {\n  @Input({ required: true }) data!: ToastData;\n  \n  isExpanded = signal(false);\n  readonly MAX_SHOW = 2;\n\n  // --- Logic Timer ---\n  private timer: any;\n  private start!: number;\n  private remaining!: number;\n\n  constructor(private notifyService: SdNotifyService) {}\n\n  ngOnInit() {\n    // Khởi tạo thời gian còn lại bằng duration ban đầu\n    this.remaining = this.data.duration;\n    // Bắt đầu đếm ngược ngay khi hiện ra\n    this.resumeTimer();\n  }\n\n  ngOnDestroy() {\n    clearTimeout(this.timer);\n  }\n\n  // --- Logic Pause/Resume ---\n\n  @HostListener('mouseenter')\n  pauseTimer() {\n    if (this.timer) {\n      // Xóa timer hiện tại\n      clearTimeout(this.timer);\n      this.timer = null;\n      // Tính toán thời gian đã trôi qua để trừ đi\n      this.remaining -= Date.now() - this.start;\n    }\n  }\n\n  @HostListener('mouseleave')\n  resumeTimer() {\n    // Chỉ chạy tiếp nếu còn thời gian và timer chưa chạy\n    if (this.remaining > 0 && !this.timer) {\n      this.start = Date.now();\n      this.timer = setTimeout(() => {\n        this.close();\n      }, this.remaining);\n    }\n  }\n\n  // --- Logic cũ ---\n\n  close() {\n    this.notifyService.remove(this.data.id);\n  }\n\n  onActionClick() {\n    this.data.onAction?.();\n  }\n\n  toggleExpand() {\n    this.isExpanded.update(v => !v);\n  }\n\n  get isMultiMessage(): boolean {\n    return Array.isArray(this.data.message);\n  }\n\n  get messages(): string[] {\n    return this.data.message as string[];\n  }\n\n  get displayMessages(): string[] {\n    const msgs = this.messages;\n    if (this.isExpanded()) return msgs;\n    return msgs.slice(0, this.MAX_SHOW);\n  }\n\n  get restCount(): number {\n    return this.messages.length - this.MAX_SHOW;\n  }\n\n  get hasMore(): boolean {\n    return this.isMultiMessage && this.messages.length > this.MAX_SHOW;\n  }\n}","<div class=\"sd-toast__bar\" [class]=\"'bg-' + data.type\"></div>\n\n<div class=\"sd-toast__icon\" [class]=\"'text-' + data.type\">\n  @switch (data.type) {\n    @case ('success') {\n      <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"/></svg>\n    }\n    @case ('info') {\n      <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z\"/></svg>\n    }\n    @case ('warning') {\n      <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z\"/></svg>\n    }\n    @case ('error') {\n      <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z\"/></svg>\n    }\n  }\n</div>\n\n<div class=\"sd-toast__content\">\n  <div class=\"sd-toast__header\">\n    <strong class=\"sd-toast__title\">{{ data.title || ('core.notify.type.' + data.type | translate) }}</strong>\n    <button class=\"sd-toast__close\" (click)=\"close()\">✕</button>\n  </div>\n\n  <div class=\"sd-toast__body\">\n    @if (!isMultiMessage) {\n      <div [innerHTML]=\"data.message\"></div>\n    } \n    @else {\n      <ul class=\"msg-list\">\n        @for (msg of displayMessages; track msg) {\n          <li [innerHTML]=\"'- ' + msg\"></li>\n        }\n      </ul>\n\n      @if (hasMore) {\n        <button type=\"button\" \n                class=\"toggle-more btn-link\" \n                [class]=\"'text-' + data.type\" \n                (click)=\"toggleExpand()\">\n          {{ isExpanded() ? ('core.notify.show-less' | translate) : ('core.notify.show-more' | translate: { count: restCount }) }}\n        </button>\n      }\n    }\n  </div>\n\n  @if (data.actionLabel) {\n    <div class=\"sd-toast__actions\">\n      <button class=\"btn-action\" \n              [class]=\"'bg-' + data.type + '-light text-' + data.type\"\n              (click)=\"onActionClick()\">\n        {{ data.actionLabel }}\n      </button>\n    </div>\n  }\n</div>","import { Component, signal, WritableSignal } from '@angular/core';\nimport { ToastData } from '../notify.model';\nimport { ToastComponent } from './toast/toast.component';\n\n@Component({\n  selector: 'toast-container',\n  standalone: true,\n  imports: [ToastComponent],\n  template: `\n    <div class=\"toast-container\">\n      @for (toast of toasts(); track toast.id) {\n        <toast [data]=\"toast\"> </toast>\n      }\n    </div>\n  `,\n  styles: [\n    `\n      .toast-container {\n        position: fixed;\n        top: 20px;\n        right: 20px;\n        z-index: 9999;\n        display: flex;\n        flex-direction: column;\n        pointer-events: none; /* Cho phép click xuyên qua vùng trống */\n      }\n      sd-toast {\n        pointer-events: auto; /* Bật lại click cho toast */\n      }\n    `,\n  ],\n})\nexport class ToastContainerComponent {\n  toasts: WritableSignal<ToastData[]> = signal([]);\n}\n","import { DOCUMENT } from '@angular/common';\nimport {\n  ApplicationRef,\n  createComponent,\n  EnvironmentInjector,\n  Inject,\n  Injectable,\n  signal\n} from '@angular/core';\nimport { Utilities } from '@sdcorejs/utils/fns';\nimport { ToastContainerComponent } from './components/toast-container.component';\nimport { NotifyOption, ToastData, ToastType } from './notify.model';\n\n@Injectable({\n  providedIn: 'root',\n})\nexport class SdNotifyService {\n  readonly toasts = signal<ToastData[]>([]);\n\n  // Constants\n  readonly #DEBOUNCE_TIME = 500;\n  readonly #DEFAULT_SUCCESS_DURATION = 3000;\n  readonly #DEFAULT_BUFFERED_DURATION = 5000;\n  readonly #MAX_TOASTS = 5;\n\n  // State\n  #buffer: Record<string, string[]> = {};\n  #timers: Record<string, ReturnType<typeof setTimeout> | null> = {};\n\n  constructor(\n    private appRef: ApplicationRef,\n    private injector: EnvironmentInjector,\n    @Inject(DOCUMENT) private document: Document\n  ) {\n    this.#initContainer();\n  }\n\n  #initContainer() {\n    const componentRef = createComponent(ToastContainerComponent, {\n      environmentInjector: this.injector,\n    });\n    componentRef.instance.toasts = this.toasts;\n    this.appRef.attachView(componentRef.hostView);\n    const domElem = (componentRef.hostView as any).rootNodes[0] as HTMLElement;\n    this.document.body.appendChild(domElem);\n  }\n\n  // Public API\n  success(message: string, option?: NotifyOption) {\n    this.#addImmediate('success', message, option);\n  }\n\n  info(message: string, option?: NotifyOption) {\n    this.#addImmediate('info', message, option);\n  }\n\n  warning(message: string | string[], option?: NotifyOption) {\n    this.#addToBuffer('warning', message, option);\n  }\n\n  error(message: string | string[], option?: NotifyOption) {\n    this.#addToBuffer('error', message, option);\n  }\n\n  remove(id: string) {\n    this.toasts.update((current) => current.filter((t) => t.id !== id));\n  }\n\n  clearAll() {\n    this.toasts.set([]);\n    this.#clearAllTimers();\n  }\n\n  clearByType(type: ToastType) {\n    this.toasts.update((current) => current.filter((t) => t.type !== type));\n  }\n\n  // Private helpers\n  #addImmediate(type: ToastType, message: string, option?: NotifyOption) {\n    const newToast: ToastData = {\n      id: Utilities.generateUuid(),\n      type,\n      message,\n      title: option?.title,\n      duration: option?.duration ?? this.#DEFAULT_SUCCESS_DURATION,\n      actionLabel: option?.actionLabel,\n      onAction: option?.onAction\n    };\n\n    this.toasts.update((current) => {\n      const updated = [newToast, ...current];\n      return updated.slice(0, this.#MAX_TOASTS);\n    });\n  }\n\n  #addToBuffer(type: ToastType, message: string | string[], option?: NotifyOption) {\n    if (!this.#buffer[type]) {\n      this.#buffer[type] = [];\n    }\n    \n    const msgs = Array.isArray(message) ? message : [message];\n    this.#buffer[type].push(...msgs);\n\n    // Clear existing timer and set new one\n    if (this.#timers[type]) {\n      clearTimeout(this.#timers[type]!);\n    }\n\n    this.#timers[type] = setTimeout(() => {\n      this.#flushBuffer(type, option);\n    }, this.#DEBOUNCE_TIME);\n  }\n\n  #flushBuffer(type: ToastType, option?: NotifyOption) {\n    const messages = [...new Set(this.#buffer[type])];\n    \n    // Cleanup\n    this.#buffer[type] = [];\n    this.#timers[type] = null;\n\n    if (messages.length === 0) return;\n\n    const typeLabel = type === 'error' ? 'Error' : 'Warning';\n    const title = option?.title ?? typeLabel;\n    const finalTitle = messages.length > 1 ? `${title} (${messages.length})` : title;\n\n    const newToast: ToastData = {\n      id: Utilities.generateUuid(),\n      type,\n      message: messages.length === 1 ? messages[0] : messages, \n      title: finalTitle,\n      duration: option?.duration ?? this.#DEFAULT_BUFFERED_DURATION,\n      actionLabel: option?.actionLabel,\n      onAction: option?.onAction\n    };\n\n    this.toasts.update((current) => {\n      const updated = [newToast, ...current];\n      return updated.slice(0, this.#MAX_TOASTS);\n    });\n  }\n\n  #clearAllTimers() {\n    Object.values(this.#timers).forEach(timer => {\n      if (timer) clearTimeout(timer);\n    });\n    this.#timers = {};\n  }\n}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1.SdNotifyService"],"mappings":"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"}
+{"version":3,"file":"sdcorejs-angular-services-notify.mjs","sources":["../../../projects/sdcorejs-angular/services/notify/src/components/toast/toast.component.ts","../../../projects/sdcorejs-angular/services/notify/src/components/toast/toast.component.html","../../../projects/sdcorejs-angular/services/notify/src/components/toast-container.component.ts","../../../projects/sdcorejs-angular/services/notify/src/notify.service.ts","../../../projects/sdcorejs-angular/services/notify/sdcorejs-angular-services-notify.ts"],"sourcesContent":["import { Component, Input, signal, HostListener, OnInit, OnDestroy } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { animate, style, transition, trigger } from '@angular/animations';\nimport { TranslatePipe } from '@sdcorejs/angular/i18n';\nimport { ToastData } from '../../notify.model';\nimport { SdNotifyService } from '../../notify.service';\n\n@Component({\n  selector: 'toast',\n  standalone: true,\n  imports: [CommonModule, TranslatePipe],\n  templateUrl: './toast.component.html',\n  styleUrls: ['./toast.component.scss'],\n  animations: [\n    trigger('toastAnimation', [\n      transition(':enter', [\n        style({ transform: 'translateX(100%)', opacity: 0 }),\n        animate('300ms ease-out', style({ transform: 'translateX(0)', opacity: 1 }))\n      ]),\n      transition(':leave', [\n        animate('200ms ease-in', style({ transform: 'translateX(100%)', opacity: 0 }))\n      ])\n    ])\n  ],\n  host: {\n    '[@toastAnimation]': 'true',\n    '[class]': '\"bg-white sd-toast\"',\n    // E2E hooks đọc bởi sd-autoid-inspector: autoid theo loại + state type/title/message.\n    '[attr.data-autoid]': 'autoId',\n    '[attr.data-type]': 'data.type',\n    '[attr.data-title]': 'data.title ?? null',\n    '[attr.data-message]': 'dataMessage'\n  }\n})\nexport class ToastComponent implements OnInit, OnDestroy {\n  @Input({ required: true }) data!: ToastData;\n  \n  isExpanded = signal(false);\n  readonly MAX_SHOW = 2;\n\n  // --- Logic Timer ---\n  private timer: any;\n  private start!: number;\n  private remaining!: number;\n\n  constructor(private notifyService: SdNotifyService) {}\n\n  ngOnInit() {\n    // Khởi tạo thời gian còn lại bằng duration ban đầu\n    this.remaining = this.data.duration;\n    // Bắt đầu đếm ngược ngay khi hiện ra\n    this.resumeTimer();\n  }\n\n  ngOnDestroy() {\n    clearTimeout(this.timer);\n  }\n\n  // --- Logic Pause/Resume ---\n\n  @HostListener('mouseenter')\n  pauseTimer() {\n    if (this.timer) {\n      // Xóa timer hiện tại\n      clearTimeout(this.timer);\n      this.timer = null;\n      // Tính toán thời gian đã trôi qua để trừ đi\n      this.remaining -= Date.now() - this.start;\n    }\n  }\n\n  @HostListener('mouseleave')\n  resumeTimer() {\n    // Chỉ chạy tiếp nếu còn thời gian và timer chưa chạy\n    if (this.remaining > 0 && !this.timer) {\n      this.start = Date.now();\n      this.timer = setTimeout(() => {\n        this.close();\n      }, this.remaining);\n    }\n  }\n\n  // --- Logic cũ ---\n\n  close() {\n    this.notifyService.remove(this.data.id);\n  }\n\n  onActionClick() {\n    this.data.onAction?.();\n  }\n\n  toggleExpand() {\n    this.isExpanded.update(v => !v);\n  }\n\n  get isMultiMessage(): boolean {\n    return Array.isArray(this.data.message);\n  }\n\n  get messages(): string[] {\n    return this.data.message as string[];\n  }\n\n  get displayMessages(): string[] {\n    const msgs = this.messages;\n    if (this.isExpanded()) return msgs;\n    return msgs.slice(0, this.MAX_SHOW);\n  }\n\n  get restCount(): number {\n    return this.messages.length - this.MAX_SHOW;\n  }\n\n  get hasMore(): boolean {\n    return this.isMultiMessage && this.messages.length > this.MAX_SHOW;\n  }\n\n  /** autoid theo loại toast để E2E chọn trực tiếp, vd `services-notify-toast-success`. */\n  get autoId(): string {\n    return `services-notify-toast-${this.data.type}`;\n  }\n\n  /** Gộp message (mảng nối ' | ') để phơi ra data-message cho E2E. */\n  get dataMessage(): string {\n    return Array.isArray(this.data.message) ? this.data.message.join(' | ') : this.data.message;\n  }\n}","<div class=\"sd-toast__bar\" [class]=\"'bg-' + data.type\"></div>\n\n<div class=\"sd-toast__icon\" [class]=\"'text-' + data.type\">\n  @switch (data.type) {\n    @case ('success') {\n      <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"/></svg>\n    }\n    @case ('info') {\n      <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z\"/></svg>\n    }\n    @case ('warning') {\n      <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z\"/></svg>\n    }\n    @case ('error') {\n      <svg viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z\"/></svg>\n    }\n  }\n</div>\n\n<div class=\"sd-toast__content\">\n  <div class=\"sd-toast__header\">\n    <strong class=\"sd-toast__title\">{{ data.title || ('core.notify.type.' + data.type | translate) }}</strong>\n    <button class=\"sd-toast__close\" (click)=\"close()\">✕</button>\n  </div>\n\n  <div class=\"sd-toast__body\">\n    @if (!isMultiMessage) {\n      <div [innerHTML]=\"data.message\"></div>\n    } \n    @else {\n      <ul class=\"msg-list\">\n        @for (msg of displayMessages; track msg) {\n          <li [innerHTML]=\"'- ' + msg\"></li>\n        }\n      </ul>\n\n      @if (hasMore) {\n        <button type=\"button\" \n                class=\"toggle-more btn-link\" \n                [class]=\"'text-' + data.type\" \n                (click)=\"toggleExpand()\">\n          {{ isExpanded() ? ('core.notify.show-less' | translate) : ('core.notify.show-more' | translate: { count: restCount }) }}\n        </button>\n      }\n    }\n  </div>\n\n  @if (data.actionLabel) {\n    <div class=\"sd-toast__actions\">\n      <button class=\"btn-action\" \n              [class]=\"'bg-' + data.type + '-light text-' + data.type\"\n              (click)=\"onActionClick()\">\n        {{ data.actionLabel }}\n      </button>\n    </div>\n  }\n</div>","import { Component, signal, WritableSignal } from '@angular/core';\nimport { ToastData } from '../notify.model';\nimport { ToastComponent } from './toast/toast.component';\n\n@Component({\n  selector: 'toast-container',\n  standalone: true,\n  imports: [ToastComponent],\n  template: `\n    <div class=\"toast-container\">\n      @for (toast of toasts(); track toast.id) {\n        <toast [data]=\"toast\"> </toast>\n      }\n    </div>\n  `,\n  styles: [\n    `\n      .toast-container {\n        position: fixed;\n        top: 20px;\n        right: 20px;\n        z-index: 9999;\n        display: flex;\n        flex-direction: column;\n        pointer-events: none; /* Cho phép click xuyên qua vùng trống */\n      }\n      sd-toast {\n        pointer-events: auto; /* Bật lại click cho toast */\n      }\n    `,\n  ],\n})\nexport class ToastContainerComponent {\n  toasts: WritableSignal<ToastData[]> = signal([]);\n}\n","import { DOCUMENT } from '@angular/common';\nimport {\n  ApplicationRef,\n  createComponent,\n  EnvironmentInjector,\n  Inject,\n  Injectable,\n  signal\n} from '@angular/core';\nimport { Utilities } from '@sdcorejs/utils/fns';\nimport { ToastContainerComponent } from './components/toast-container.component';\nimport { NotifyOption, ToastData, ToastType } from './notify.model';\n\n@Injectable({\n  providedIn: 'root',\n})\nexport class SdNotifyService {\n  readonly toasts = signal<ToastData[]>([]);\n\n  // Constants\n  readonly #DEBOUNCE_TIME = 500;\n  readonly #DEFAULT_SUCCESS_DURATION = 3000;\n  readonly #DEFAULT_BUFFERED_DURATION = 5000;\n  readonly #MAX_TOASTS = 5;\n\n  // State\n  #buffer: Record<string, string[]> = {};\n  #timers: Record<string, ReturnType<typeof setTimeout> | null> = {};\n\n  constructor(\n    private appRef: ApplicationRef,\n    private injector: EnvironmentInjector,\n    @Inject(DOCUMENT) private document: Document\n  ) {\n    this.#initContainer();\n  }\n\n  #initContainer() {\n    const componentRef = createComponent(ToastContainerComponent, {\n      environmentInjector: this.injector,\n    });\n    componentRef.instance.toasts = this.toasts;\n    this.appRef.attachView(componentRef.hostView);\n    const domElem = (componentRef.hostView as any).rootNodes[0] as HTMLElement;\n    this.document.body.appendChild(domElem);\n  }\n\n  // Public API\n  success(message: string, option?: NotifyOption) {\n    this.#addImmediate('success', message, option);\n  }\n\n  info(message: string, option?: NotifyOption) {\n    this.#addImmediate('info', message, option);\n  }\n\n  warning(message: string | string[], option?: NotifyOption) {\n    this.#addToBuffer('warning', message, option);\n  }\n\n  error(message: string | string[], option?: NotifyOption) {\n    this.#addToBuffer('error', message, option);\n  }\n\n  remove(id: string) {\n    this.toasts.update((current) => current.filter((t) => t.id !== id));\n  }\n\n  clearAll() {\n    this.toasts.set([]);\n    this.#clearAllTimers();\n  }\n\n  clearByType(type: ToastType) {\n    this.toasts.update((current) => current.filter((t) => t.type !== type));\n  }\n\n  // Private helpers\n  #addImmediate(type: ToastType, message: string, option?: NotifyOption) {\n    const newToast: ToastData = {\n      id: Utilities.generateUuid(),\n      type,\n      message,\n      title: option?.title,\n      duration: option?.duration ?? this.#DEFAULT_SUCCESS_DURATION,\n      actionLabel: option?.actionLabel,\n      onAction: option?.onAction\n    };\n\n    this.toasts.update((current) => {\n      const updated = [newToast, ...current];\n      return updated.slice(0, this.#MAX_TOASTS);\n    });\n  }\n\n  #addToBuffer(type: ToastType, message: string | string[], option?: NotifyOption) {\n    if (!this.#buffer[type]) {\n      this.#buffer[type] = [];\n    }\n    \n    const msgs = Array.isArray(message) ? message : [message];\n    this.#buffer[type].push(...msgs);\n\n    // Clear existing timer and set new one\n    if (this.#timers[type]) {\n      clearTimeout(this.#timers[type]!);\n    }\n\n    this.#timers[type] = setTimeout(() => {\n      this.#flushBuffer(type, option);\n    }, this.#DEBOUNCE_TIME);\n  }\n\n  #flushBuffer(type: ToastType, option?: NotifyOption) {\n    const messages = [...new Set(this.#buffer[type])];\n    \n    // Cleanup\n    this.#buffer[type] = [];\n    this.#timers[type] = null;\n\n    if (messages.length === 0) return;\n\n    const typeLabel = type === 'error' ? 'Error' : 'Warning';\n    const title = option?.title ?? typeLabel;\n    const finalTitle = messages.length > 1 ? `${title} (${messages.length})` : title;\n\n    const newToast: ToastData = {\n      id: Utilities.generateUuid(),\n      type,\n      message: messages.length === 1 ? messages[0] : messages, \n      title: finalTitle,\n      duration: option?.duration ?? this.#DEFAULT_BUFFERED_DURATION,\n      actionLabel: option?.actionLabel,\n      onAction: option?.onAction\n    };\n\n    this.toasts.update((current) => {\n      const updated = [newToast, ...current];\n      return updated.slice(0, this.#MAX_TOASTS);\n    });\n  }\n\n  #clearAllTimers() {\n    Object.values(this.#timers).forEach(timer => {\n      if (timer) clearTimeout(timer);\n    });\n    this.#timers = {};\n  }\n}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1.SdNotifyService"],"mappings":"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"}

package/fesm2022/sdcorejs-angular-services-storage.mjs

@@ -151,10 +151,10 @@ class SdStorageService {
             return val;
         return JSON.parse(JSON.stringify(val));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: SdStorageService, deps: [{ token: SD_STORAGE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: SdStorageService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: SdStorageService, deps: [{ token: SD_STORAGE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: SdStorageService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: SdStorageService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: SdStorageService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sdcorejs/angular",
-  "version": "21.0.1",
+  "version": "21.0.3",
   "license": "MIT",
   "peerDependencies": {
     "@angular/common": "^19.0.0 || ^20.0.0 || ^21.0.0",
@@ -105,6 +105,10 @@
       "types": "./types/sdcorejs-angular-components-modal.d.ts",
       "default": "./fesm2022/sdcorejs-angular-components-modal.mjs"
     },
+    "./components/modal-resizable": {
+      "types": "./types/sdcorejs-angular-components-modal-resizable.d.ts",
+      "default": "./fesm2022/sdcorejs-angular-components-modal-resizable.mjs"
+    },
     "./components/operator": {
       "types": "./types/sdcorejs-angular-components-operator.d.ts",
       "default": "./fesm2022/sdcorejs-angular-components-operator.mjs"
@@ -205,6 +209,10 @@
       "types": "./types/sdcorejs-angular-forms-directives.d.ts",
       "default": "./fesm2022/sdcorejs-angular-forms-directives.mjs"
     },
+    "./forms/inline-text": {
+      "types": "./types/sdcorejs-angular-forms-inline-text.d.ts",
+      "default": "./fesm2022/sdcorejs-angular-forms-inline-text.mjs"
+    },
     "./forms/input": {
       "types": "./types/sdcorejs-angular-forms-input.d.ts",
       "default": "./fesm2022/sdcorejs-angular-forms-input.mjs"

package/types/sdcorejs-angular-components-autoid-inspector.d.ts

@@ -20,6 +20,9 @@ interface SdAutoidElementState {
     minlength?: string;
     pattern?: string;
     errorMessage?: string;
+    type?: string;
+    title?: string;
+    message?: string;
 }
 interface SdAutoidElement {
     stt: number;
@@ -42,6 +45,14 @@ interface SdAutoidElement {
      * Used by the UI to group table-scoped elements into a separate section.
      */
     tableScope?: string;
+    /**
+     * `true` when the element matched a required selector (sd-button, sd-input, …) but
+     * had NO `data-autoid` — the scanner still emits it with `autoid: ''` and a positional
+     * `xpath` fallback so the export stays usable. The dev should backfill an autoid.
+     */
+    missingAutoid?: boolean;
+    /** Human-readable warning attached to a fallback element (only set when `missingAutoid`). */
+    warning?: string;
 }
 interface SdAutoidMissing {
     tag: string;
@@ -119,14 +130,46 @@ declare class SdAutoidInspector implements OnDestroy {
 
 type SdAutoidExportFormat = 'csv' | 'json' | 'md-pom' | 'md-table';
 interface SdAutoidExportMeta {
+    /** `location.pathname + location.search` — kept for back-compat with MD exports. */
     pageUrl: string;
     pageTitle: string;
     timestamp: string;
+    /** Full `location.href`. */
+    url: string;
+    /** `location.pathname` only. */
+    pathname: string;
+    /** Raw `location.search` (incl. leading `?`), or `''`. */
+    search: string;
+    /** Parsed query string → key/value map (last value wins on repeats). */
+    queryParams: Record<string, string>;
+    /**
+     * Angular route path params (`:id`, …) merged across the activated-route tree.
+     * Only present when an Angular `Router` is available at scan time; omitted otherwise.
+     */
+    params?: Record<string, string>;
+}
+/** JSON export envelope: page meta + the scanned elements. */
+interface SdAutoidExportJson {
+    meta: SdAutoidExportMeta;
+    elements: SdAutoidElement[];
 }
 
 declare class SdAutoidScannerService {
-    /** Quét toàn bộ element có [data-autoid] trong root, gắn thông tin name/tag/value/xpath. */
-    scan(root?: HTMLElement): SdAutoidElement[];
+    /**
+     * Quét element có [data-autoid] trong root, gắn name/tag/value/xpath.
+     * Khi truyền `requireSelectors` (vd các sd-* form/button), những node khớp selector
+     * mà KHÔNG có data-autoid (self lẫn con) sẽ được thêm vào dưới dạng phần tử fallback
+     * (`autoid: ''`, xpath theo vị trí thẻ + cờ `missingAutoid` + warning) — để JSON xuất ra
+     * vẫn dùng được và dev biết chỗ cần bổ sung autoid.
+     */
+    scan(root?: HTMLElement, requireSelectors?: ReadonlyArray<string>): SdAutoidElement[];
+    /**
+     * Tìm các node khớp `requireSelectors` nhưng thiếu data-autoid (self + mọi descendant),
+     * thêm vào `result` dưới dạng phần tử fallback. Trả về `stt` kế tiếp.
+     */
+    private appendMissing;
+    /** XPath theo vị trí thẻ trong document, vd `(//sd-button)[2]`, khi không có autoid. */
+    private fallbackXpath;
     /** Group element theo autoid để consumer lấy duplicate map. */
     groupByAutoid(elements: SdAutoidElement[]): Record<string, SdAutoidElement[]>;
     /**
@@ -177,7 +220,13 @@ declare class SdAutoidHighlightService {
 }
 
 declare class SdAutoidExportService {
-    toJson(elements: SdAutoidElement[]): string;
+    /**
+     * Có `meta` → bọc `{ meta, elements }` (kèm url/queryParams) để consumer biết trang/route.
+     * Không `meta` → giữ mảng thuần (back-compat cho caller cũ chỉ cần elements).
+     */
+    toJson(elements: SdAutoidElement[], meta?: SdAutoidExportMeta): string;
+    /** Parse a `location.search` string into a flat key/value map (last value wins). */
+    parseQueryParams(search: string): Record<string, string>;
     toCsv(elements: SdAutoidElement[]): string;
     /** POM TypeScript skeleton — copy ngay vào file Playwright/Cypress. */
     toMarkdownPom(elements: SdAutoidElement[], meta: SdAutoidExportMeta): string;
@@ -196,4 +245,4 @@ declare class SdAutoidExportService {
 }
 
 export { SD_AUTOID_DEFAULT_REQUIRE_SELECTORS, SdAutoidAuditService, SdAutoidExportService, SdAutoidHighlightService, SdAutoidInspector, SdAutoidScannerService };
-export type { SdAutoidAuditResult, SdAutoidElement, SdAutoidElementState, SdAutoidExportFormat, SdAutoidExportMeta, SdAutoidInspectorConfig, SdAutoidMissing };
+export type { SdAutoidAuditResult, SdAutoidElement, SdAutoidElementState, SdAutoidExportFormat, SdAutoidExportJson, SdAutoidExportMeta, SdAutoidInspectorConfig, SdAutoidMissing };

package/types/sdcorejs-angular-components-form-generic.d.ts

@@ -776,6 +776,9 @@ declare class SdFormBuilder extends SdBaseSecureComponent {
     clonedVariables: SdFormGenericVariable[];
     readonly selectedComponent: i0.WritableSignal<SdFormGenericComponent | SdFormGenericGroup | undefined>;
     readonly isPreview: i0.WritableSignal<boolean>;
+    readonly editingGroupId: i0.WritableSignal<string | undefined>;
+    /** Group đang được Detail (tìm ở TOP-LEVEL theo id), undefined = đang ở canvas chính. */
+    readonly editingGroup: i0.Signal<SdFormGenericGroup | undefined>;
     /** Signal toàn cục: TRUE khi BẤT KỲ cdkDrag nào đang active (palette, canvas, group, resize).
      *  Trigger class `.fb-shell--dragging` để ẩn hover/actions/resize toàn diện, không phụ thuộc :has(). */
     readonly isAnyDragging: i0.WritableSignal<boolean>;
@@ -807,15 +810,17 @@ declare class SdFormBuilder extends SdBaseSecureComponent {
     };
     /** Segmented Design/Preview toggle (replaces play_circle/stop_circle). */
     setMode: (preview: boolean) => void;
-    /** Nested drop handler — when dragging a palette item or canvas item INTO a group body. */
-    dropInGroup: (event: CdkDragDrop<any[]>, group: SdFormGenericGroup) => void;
-    /** Quick-add break sau row chỉ định.
-     *  Tính component index cuối cùng của row đó trong this.components, splice break vào sau.
-     *  Không qua palette — chỉ là utility action bám theo row trên canvas.
+    /** Mở canvas thiết kế riêng cho 1 group (chỉ children của nó). Snapshot để Cancel revert. */
+    enterGroupEdit: (group: SdFormGenericGroup) => void;
+    /** OK: giữ thay đổi children, quay về canvas chính. */
+    confirmGroupEdit: () => void;
+    /** Cancel: revert children về snapshot lúc vào Detail, rồi quay về canvas chính. */
+    cancelGroupEdit: () => void;
+    /** Quick-add break sau row chỉ định (theo scope hiện tại — top-level hoặc group).
+     *  Tính component index cuối cùng của row đó trong scope, splice break vào sau.
      */
     insertBreakAfter: (row: DragDropRowItem) => void;
-    /** Remove a child component from a group's nested list. */
-    removeFromGroup: (group: SdFormGenericGroup, id: string) => void;
+    /** Xoá component theo scope hiện tại (top-level hoặc children của group đang Detail). */
     removeComponent: (id: string) => void;
     selectComponent: (item?: SdFormGenericComponent | SdFormGenericGroup) => void;
     onClickedOutside: (e: any) => void;
@@ -829,12 +834,6 @@ declare class SdFormBuilder extends SdBaseSecureComponent {
     noReturnPredicate: () => boolean;
     changeSizeControl: (event: CdkDragMove<SdFormGenericComponent | SdFormGenericGroup>, item: SdFormGenericComponent | SdFormGenericGroup, items: (SdFormGenericComponent | SdFormGenericGroup)[], currentIndex: number) => Promise<void>;
     dragEndChangeSizeControl: (event: any) => void;
-    /** Resize a child item INSIDE a group.
-     *  Math: lấy bounding của chính item, tính (mouse.x - item.left) / colWidth = newCols.
-     *  Cách này đúng cho cả flex-wrap (item ở wrap row 2+) vì dùng item-relative,
-     *  không phải sum-of-all-preceding-cols (sai khi item wrap xuống row mới).
-     */
-    changeSizeChildInGroup: (event: CdkDragMove<SdFormGenericComponent>, child: SdFormGenericComponent, group: SdFormGenericGroup) => void;
     onChangeViewed: (component: SdFormGenericComponent) => void;
     onChangeHidden: (component: SdFormGenericComponent | SdFormGenericGroup) => void;
     onDuplicate: (component: SdFormGenericComponent | SdFormGenericGroup) => void;

package/types/sdcorejs-angular-components-modal-resizable.d.ts

@@ -0,0 +1,32 @@
+import * as _angular_core from '@angular/core';
+import { CdkPortal } from '@angular/cdk/portal';
+
+declare class SdModalResizable {
+    #private;
+    readonly id: string;
+    readonly portal: _angular_core.Signal<CdkPortal>;
+    readonly editable: _angular_core.InputSignalWithTransform<boolean, boolean | "">;
+    readonly width: _angular_core.InputSignal<string>;
+    readonly editingChanged: _angular_core.OutputEmitterRef<boolean>;
+    readonly isEditing: _angular_core.WritableSignal<boolean>;
+    readonly isOpened: _angular_core.WritableSignal<boolean>;
+    readonly isHover: _angular_core.WritableSignal<boolean>;
+    readonly isLoading: _angular_core.WritableSignal<boolean>;
+    readonly isMinimum: _angular_core.WritableSignal<boolean>;
+    readonly isMaximum: _angular_core.WritableSignal<boolean>;
+    constructor();
+    open: () => void;
+    close: () => void;
+    minimize: () => void;
+    maximize: () => void;
+    toggleMaximum: () => void;
+    startLoading: () => void;
+    stopLoading: () => void;
+    toggleEditable(): void;
+    onFocus: () => void;
+    onBlur: () => void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SdModalResizable, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SdModalResizable, "sd-modal-resizable", never, { "editable": { "alias": "editable"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; }, { "editingChanged": "editingChanged"; }, never, ["[sdTitle]", "[sdBody]", "[sdFooter]"], true, never>;
+}
+
+export { SdModalResizable };

package/types/sdcorejs-angular-components-table.d.ts

@@ -710,16 +710,103 @@ interface SdTableOptionStyle<T = any> {
     rowCss?: (rowData: T, index?: number, ctx?: SdTableRowCssContext) => Record<string, string>;
 }
 
-interface SdTableOptionTree<T = any> {
-    /** Key trên object row chứa mảng children. Mặc định: 'children' */
-    childrenKey?: string;
-    /** Giới hạn độ sâu cây. undefined = không giới hạn. */
+/**
+ * Cấu hình tree-rows cho `<sd-table>` — render dòng con inline dưới dòng cha
+ * kèm expand/collapse.
+ *
+ * Đây là discriminated union theo `loadType`:
+ * - `'static'` ({@link TableOptionTreeStatic}) — children đã nằm sẵn trong data
+ *   (embedded array tại `childrenKey`). Không gọi API khi bung.
+ * - `'lazy'`  ({@link TableOptionTreeLazy})  — children nạp theo yêu cầu qua
+ *   `onExpandChildren` khi người dùng bung dòng lần đầu.
+ *
+ * `loadType` là discriminant: TypeScript dựa vào nó để narrow union (vd chỉ
+ * `static` mới có `childrenKey`/`defaultExpanded`, chỉ `lazy` mới có
+ * `onExpandChildren`). Dùng type-guard `isLazyTree()` trong `tree.util.ts` để
+ * narrow an toàn thay vì truy cập field trực tiếp trên union.
+ *
+ * @example Static (children embedded)
+ * ```ts
+ * tree: { loadType: 'static', childrenKey: 'children', defaultExpanded: 1 }
+ * ```
+ * @example Lazy (nạp theo yêu cầu)
+ * ```ts
+ * tree: { loadType: 'lazy', onExpandChildren: row => api.getChildren(row.id) }
+ * ```
+ */
+type SdTableOptionTree<T = any> = TableOptionTreeStatic<T> | TableOptionTreeLazy<T>;
+/**
+ * Tree với dữ liệu children **embedded** sẵn trong mỗi row.
+ *
+ * Table đọc mảng con tại `childrenKey` ngay trên object data; không có lời gọi
+ * bất đồng bộ nào khi bung dòng. Đây cũng là chế độ hỗ trợ **search ở cấp con**
+ * cho table `type: 'local'` (xem `tree.util.ts#subtreeMatches` /
+ * `filterMatchingChildren`): khi lọc, một nhánh được giữ lại nếu chính nó hoặc
+ * bất kỳ hậu duệ nào khớp từ khoá, và nhánh khớp sẽ tự bung.
+ */
+interface TableOptionTreeStatic<T = any> {
+    /** Chế độ nạp children: dữ liệu đã embedded sẵn trong row. */
+    loadType: 'static';
+    /**
+     * Key trên object row chứa mảng children.
+     * Mặc định: `'children'`.
+     */
+    childrenKey?: NestedKeyOf<T> | 'children';
+    /**
+     * Giới hạn độ sâu cây (level gốc = 0).
+     * `undefined` = không giới hạn.
+     */
     maxDepth?: number;
-    /** false | true | number (mở tới cấp N) */
+    /**
+     * Trạng thái bung mặc định khi load:
+     * - `false` — thu gọn hết (mặc định)
+     * - `true`  — bung toàn bộ
+     * - `number N` — bung tới cấp `N` (row có `level < N` được bung)
+     */
     defaultExpanded?: boolean | number;
-    /** Lazy load khi row chưa có children embedded */
-    onExpandChildren?: (rowData: T) => Promise<T[]> | T[];
-    /** Pixel indent mỗi cấp. Mặc định: 20 */
+    /**
+     * Số pixel thụt lề (indent) cho mỗi cấp sâu.
+     * Mặc định: `20`.
+     */
+    indentSize?: number;
+}
+/**
+ * Tree với children **nạp lười (lazy)** theo yêu cầu.
+ *
+ * Khi người dùng bung một dòng lần đầu mà dòng đó chưa có children embedded,
+ * table gọi `onExpandChildren(row)` để nạp; kết quả được cache lại trên row
+ * (ghi vào key `'children'`) nên các lần bung sau không gọi lại.
+ *
+ * Lazy tree **không hỗ trợ** `childrenKey` tuỳ biến (luôn dùng `'children'` làm
+ * nơi lưu kết quả) và **không hỗ trợ** `defaultExpanded` (không thể bung mặc
+ * định nhánh chưa nạp).
+ */
+interface TableOptionTreeLazy<T = any> {
+    /** Chế độ nạp children: nạp lười theo yêu cầu khi bung. */
+    loadType: 'lazy';
+    /**
+     * Giới hạn độ sâu cây (level gốc = 0).
+     * `undefined` = không giới hạn.
+     */
+    maxDepth?: number;
+    /**
+     * Hàm nạp children khi bung dòng chưa có children embedded.
+     * Trả về `Promise<T[]>`; kết quả được ghi vào key `'children'` của row data
+     * và cache cho các lần bung sau.
+     */
+    onExpandChildren: (rowData: T) => Promise<T[]>;
+    /**
+     * Xác định một row có con hay không — để quyết định có hiển thị icon expand.
+     * - Không truyền: MỌI lazy node đều hiện icon expand (không biết trước được).
+     * - Truyền: chỉ hiện icon khi trả `true`; trả `false` ⇒ row là lá (ẩn icon,
+     *   không gọi `onExpandChildren`).
+     * Lưu ý: nếu row đã có children embedded sẵn thì luôn coi là có con (bỏ qua hàm này).
+     */
+    hasChildren?: (rowData: T) => boolean;
+    /**
+     * Số pixel thụt lề (indent) cho mỗi cấp sâu.
+     * Mặc định: `20`.
+     */
     indentSize?: number;
 }
 
@@ -954,8 +1041,10 @@ declare class MobileFilterComponent {
 
 declare class ConfigComponent {
     #private;
+    autoIdInput: _angular_core.InputSignal<string | null | undefined>;
     tableOption: _angular_core.InputSignal<SdTableOption | undefined>;
     changes: _angular_core.OutputEmitterRef<ConfiguredTableResult>;
+    autoId: _angular_core.Signal<string>;
     modal: _angular_core.Signal<SdModal | undefined>;
     table: _angular_core.Signal<MatTable<SdTableColumn>>;
     configuration: _angular_core.WritableSignal<ConfiguredTable | undefined>;
@@ -969,7 +1058,7 @@ declare class ConfigComponent {
     handleMouseDown(): void;
     handleMouseUp(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ConfigComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ConfigComponent, "config", never, { "tableOption": { "alias": "tableOption"; "required": false; "isSignal": true; }; }, { "changes": "changes"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ConfigComponent, "config", never, { "autoIdInput": { "alias": "autoId"; "required": false; "isSignal": true; }; "tableOption": { "alias": "tableOption"; "required": false; "isSignal": true; }; }, { "changes": "changes"; }, never, never, true, never>;
 }
 
 declare class SdPopupExport {
@@ -1158,4 +1247,4 @@ declare class SdTable<T = unknown> extends SdBaseSecureComponent implements OnIn
 }
 
 export { MatPaginatorIntlCro, SD_TABLE_CONFIGURATION, SdConvertToPagingReq, SdMaterialFooterDefDirective, SdTable, SdTableCellDefDirective, SdTableExpandDefDirective, SdTableFilterDefDirective, SdTableGroupDefDirective, SdTableTitleDefDirective };
-export type { ISdTableConfiguration, SdTableColumn, SdTableColumnChildren, SdTableColumnLazyValues, SdTableColumnNormal, SdTableColumnTransformFunc, SdTableColumnValues, SdTableCommand, SdTableCommandChildren, SdTableCommandNormal, SdTableCommandOption, SdTableDisplay, SdTableExternalFilter, SdTableFilterRequest, SdTableGroupDefContext, SdTableItem, SdTableMeta, SdTableOption, SdTableOptionFilter, SdTableOptionTree, SdTableQuickFilter, TableFilterConfiguration, TableFilterRegister, TableFilterValue };
+export type { ISdTableConfiguration, SdTableColumn, SdTableColumnChildren, SdTableColumnLazyValues, SdTableColumnNormal, SdTableColumnTransformFunc, SdTableColumnValues, SdTableCommand, SdTableCommandChildren, SdTableCommandNormal, SdTableCommandOption, SdTableDisplay, SdTableExternalFilter, SdTableFilterRequest, SdTableGroupDefContext, SdTableItem, SdTableMeta, SdTableOption, SdTableOptionFilter, SdTableOptionTree, SdTableQuickFilter, TableFilterConfiguration, TableFilterRegister, TableFilterValue, TableOptionTreeLazy, TableOptionTreeStatic };

package/types/sdcorejs-angular-components-view.d.ts

@@ -1,17 +1,50 @@
 import * as _angular_core from '@angular/core';
 import { TemplateRef } from '@angular/core';
 
+/**
+ * `<sd-view>` — pure read-only display of a value (text, hyperlink, or a custom template).
+ *
+ * Presentational proxy with no state of its own: the parent form control (`<sd-select>`,
+ * `<sd-input>`, …) computes the display string + resolved selection and passes them in;
+ * `<sd-view>` only decides WHICH template renders. It is the single rendering path for every
+ * "viewed" state across the form controls (DETAIL `viewed=true` and the `viewed='inline'`
+ * text face), so a custom `valueTemplate` (e.g. `sdViewDef` / `#sdValue`) looks identical in
+ * both. OnPush — re-renders only when an input signal changes.
+ */
 declare class SdView {
+    /** Optional label rendered above the value (omitted when a parent supplies its own label). */
     label: _angular_core.InputSignal<string | null | undefined>;
+    /** Raw selected value — NOT rendered directly; only exposed in the `valueTemplate` context as `value`. */
     value: _angular_core.InputSignal<any>;
+    /**
+     * Display string — what shows when no custom value template is bound.
+     * why: `input.required()` forces the parent to bind `[display]` (compile error otherwise),
+     * so the component never has to guess a fallback string from `value`.
+     */
     display: _angular_core.InputSignal<string | null | undefined>;
+    /** When set, the value renders as a link (`<a [sdHref]>`) instead of plain text. */
     hyperlink: _angular_core.InputSignal<string | null | undefined>;
+    /** Label template handed down by a parent control (wins over `label` + `#sdLabel`). */
     labelTemplate: _angular_core.InputSignal<TemplateRef<any> | undefined>;
+    /** Value template handed down by a parent control (wins over `display` + `#sdValue`). */
     valueTemplate: _angular_core.InputSignal<TemplateRef<any> | undefined>;
+    /**
+     * Resolved selected-item objects passed by the parent (e.g. `<sd-select>`).
+     * why: the parent owns option/lazy resolution — `<sd-view>` is a proxy and must NOT rebuild
+     * the list. Exposed in the value-template context so a "head +N" template can read `displayField`.
+     */
     selectedItems: _angular_core.InputSignal<any[] | undefined>;
+    /** `#sdLabel` template projected directly into `<sd-view>` (fallback when no `[labelTemplate]`). */
     contentLabelTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
+    /** `#sdValue` template projected directly into `<sd-view>` (fallback when no `[valueTemplate]`). */
     contentValueTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
+    /**
+     * Effective label template: input from parent wins, else the projected `#sdLabel`.
+     * why: `computed` caches the choice so the template's `@if (activeLabelTemplate())` doesn't
+     * re-evaluate two content-child reads on every change-detection pass.
+     */
     activeLabelTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
+    /** Effective value template: input from parent wins, else the projected `#sdValue`. Cached for the same reason. */
     activeValueTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SdView, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SdView, "sd-view", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "display": { "alias": "display"; "required": true; "isSignal": true; }; "hyperlink": { "alias": "hyperlink"; "required": false; "isSignal": true; }; "labelTemplate": { "alias": "labelTemplate"; "required": false; "isSignal": true; }; "valueTemplate": { "alias": "valueTemplate"; "required": false; "isSignal": true; }; "selectedItems": { "alias": "selectedItems"; "required": false; "isSignal": true; }; }, {}, ["contentLabelTemplate", "contentValueTemplate"], never, true, never>;

package/types/sdcorejs-angular-components.d.ts

@@ -3,6 +3,7 @@ export * from '@sdcorejs/angular/components/button';
 export * from '@sdcorejs/angular/components/badge';
 export * from '@sdcorejs/angular/components/tab-router';
 export * from '@sdcorejs/angular/components/side-drawer';
+export * from '@sdcorejs/angular/components/modal-resizable';
 export * from '@sdcorejs/angular/components/modal';
 export * from '@sdcorejs/angular/components/table';
 export * from '@sdcorejs/angular/components/quick-action';

package/types/sdcorejs-angular-forms-autocomplete.d.ts

@@ -5,7 +5,7 @@ import { MatAutocompleteTrigger } from '@angular/material/autocomplete';
 import { ErrorStateMatcher } from '@angular/material/core';
 import { MatFormFieldAppearance } from '@angular/material/form-field';
 import { SdItemDefDefDirective, SdViewDefDirective } from '@sdcorejs/angular/forms/directives';
-import { SdSearch, SdCustomValidator, SdSelectionData, SdFormControl } from '@sdcorejs/angular/forms/models';
+import { SdSearch, SdViewed, SdViewedInput, SdCustomValidator, SdSelectionData, SdFormControl } from '@sdcorejs/angular/forms/models';
 import { Size } from '@sdcorejs/utils/models';
 
 declare class SdAutocompleteErrotStateMatcher implements ErrorStateMatcher {
@@ -50,7 +50,18 @@ declare class SdAutocomplete<T = any> implements OnInit, OnDestroy, AfterViewIni
     addable: _angular_core.InputSignalWithTransform<boolean, unknown>;
     required: _angular_core.InputSignalWithTransform<boolean, unknown>;
     disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
-    viewed: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Display mode: `false` edit · `true` static view · `'inline'` view + click-to-edit (autocomplete panel). */
+    viewed: _angular_core.InputSignalWithTransform<SdViewed, SdViewedInput>;
+    /** In `viewed='inline'`, show a hover clear-× on the text face. Set `false` when the host owns removal (chips). */
+    clearable: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** `true` when `viewed === 'inline'`. */
+    readonly isInline: _angular_core.Signal<boolean>;
+    /** `true` when `viewed === true` (static view, no editor). */
+    readonly isViewed: _angular_core.Signal<boolean>;
+    /** Open the autocomplete panel from the inline text face. No-op unless `viewed='inline'`. */
+    enterInlineEdit: () => void;
+    /** View display template: `sdViewDef` overrides the projected `#sdValue` (unified). */
+    readonly viewTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
     validator: _angular_core.InputSignal<SdCustomValidator | undefined>;
     inlineError: _angular_core.InputSignal<string | undefined>;
     /**
@@ -85,11 +96,13 @@ declare class SdAutocomplete<T = any> implements OnInit, OnDestroy, AfterViewIni
     onClick: () => void;
     blur: () => void;
     focus: () => void;
+    /** Open the autocomplete panel programmatically (anchors to the field input). Used by inline mode. */
+    open: () => void;
     clear: ($event?: any) => void;
     onAdd: ($event: Event) => void;
     reValidate: () => void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SdAutocomplete<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SdAutocomplete<any>, "sd-autocomplete", never, { "autoIdInput": { "alias": "autoId"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "form": { "alias": "form"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "helperText": { "alias": "helperText"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "valueField": { "alias": "valueField"; "required": false; "isSignal": true; }; "displayField": { "alias": "displayField"; "required": false; "isSignal": true; }; "disabledField": { "alias": "disabledField"; "required": false; "isSignal": true; }; "limit": { "alias": "limit"; "required": false; "isSignal": true; }; "cacheChecksum": { "alias": "cacheChecksum"; "required": false; "isSignal": true; }; "hyperlink": { "alias": "hyperlink"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "hideInlineError": { "alias": "hideInlineError"; "required": false; "isSignal": true; }; "addable": { "alias": "addable"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "viewed": { "alias": "viewed"; "required": false; "isSignal": true; }; "validator": { "alias": "validator"; "required": false; "isSignal": true; }; "inlineError": { "alias": "inlineError"; "required": false; "isSignal": true; }; "appearanceInput": { "alias": "appearance"; "required": false; "isSignal": true; }; "valueModel": { "alias": "model"; "required": false; "isSignal": true; }; }, { "valueModel": "modelChange"; "sdChange": "sdChange"; "sdSelection": "sdSelection"; "sdAdd": "sdAdd"; }, ["sdLabelTemplate", "sdValueTemplate", "itemDef", "sdViewDef"], ["[sdLabel]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SdAutocomplete<any>, "sd-autocomplete", never, { "autoIdInput": { "alias": "autoId"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "form": { "alias": "form"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "helperText": { "alias": "helperText"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "valueField": { "alias": "valueField"; "required": false; "isSignal": true; }; "displayField": { "alias": "displayField"; "required": false; "isSignal": true; }; "disabledField": { "alias": "disabledField"; "required": false; "isSignal": true; }; "limit": { "alias": "limit"; "required": false; "isSignal": true; }; "cacheChecksum": { "alias": "cacheChecksum"; "required": false; "isSignal": true; }; "hyperlink": { "alias": "hyperlink"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "hideInlineError": { "alias": "hideInlineError"; "required": false; "isSignal": true; }; "addable": { "alias": "addable"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "viewed": { "alias": "viewed"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "validator": { "alias": "validator"; "required": false; "isSignal": true; }; "inlineError": { "alias": "inlineError"; "required": false; "isSignal": true; }; "appearanceInput": { "alias": "appearance"; "required": false; "isSignal": true; }; "valueModel": { "alias": "model"; "required": false; "isSignal": true; }; }, { "valueModel": "modelChange"; "sdChange": "sdChange"; "sdSelection": "sdSelection"; "sdAdd": "sdAdd"; }, ["sdLabelTemplate", "sdValueTemplate", "itemDef", "sdViewDef"], ["[sdLabel]"], true, never>;
 }
 
 export { SdAutocomplete };

package/types/sdcorejs-angular-forms-checkbox.d.ts

@@ -1,6 +1,7 @@
 import * as _angular_core from '@angular/core';
 import { OnDestroy, AfterViewInit } from '@angular/core';
 import { FormControl, FormGroup } from '@angular/forms';
+import { SdViewed, SdViewedInput } from '@sdcorejs/angular/forms/models';
 import { Color } from '@sdcorejs/utils/models';
 
 declare class SdCheckbox implements OnDestroy, AfterViewInit {
@@ -13,7 +14,10 @@ declare class SdCheckbox implements OnDestroy, AfterViewInit {
     readonly label: _angular_core.InputSignalWithTransform<string | undefined, string | null | undefined>;
     readonly color: _angular_core.InputSignalWithTransform<Color, Color | null | undefined>;
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
-    readonly viewed: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Display mode: `false` edit · `true` static view · `'inline'` interactive (disabled `'inline'` → static). */
+    readonly viewed: _angular_core.InputSignalWithTransform<SdViewed, SdViewedInput>;
+    /** `true` when the static read-only view should render. */
+    readonly isViewed: _angular_core.Signal<boolean>;
     readonly inlineError: _angular_core.InputSignalWithTransform<string, string | null | undefined>;
     readonly model: _angular_core.ModelSignal<unknown>;
     readonly sdChange: _angular_core.OutputEmitterRef<unknown>;

package/types/sdcorejs-angular-forms-chip-calendar.d.ts

@@ -7,7 +7,7 @@ import { MatCalendar } from '@angular/material/datepicker';
 import { MatFormFieldAppearance, FloatLabelType } from '@angular/material/form-field';
 import { MatMenuTrigger } from '@angular/material/menu';
 import { SdViewDefDirective, SdLabelDefDirective } from '@sdcorejs/angular/forms/directives';
-import { SdFormControl } from '@sdcorejs/angular/forms/models';
+import { SdViewed, SdViewedInput, SdFormControl } from '@sdcorejs/angular/forms/models';
 import { Size } from '@sdcorejs/utils/models';
 
 declare class SdChipCalendarErrorStateMatcher implements ErrorStateMatcher {
@@ -40,7 +40,10 @@ declare class SdChipCalendar implements AfterViewInit {
     min: _angular_core.InputSignalWithTransform<number, number | null | undefined>;
     max: _angular_core.InputSignalWithTransform<number, number | null | undefined>;
     disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
-    viewed: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Display mode: `false` edit · `true` static view · `'inline'` interactive (disabled `'inline'` → static). */
+    viewed: _angular_core.InputSignalWithTransform<SdViewed, SdViewedInput>;
+    /** `true` when the static view should render (`viewed===true`, or disabled `'inline'`). */
+    readonly isViewed: _angular_core.Signal<boolean>;
     hyperlink: _angular_core.InputSignalWithTransform<string | undefined, string | null | undefined>;
     model: _angular_core.ModelSignal<(string | number)[] | undefined>;
     sdChange: _angular_core.OutputEmitterRef<any[]>;