@sd-angular/core 19.0.0-beta.1 → 19.0.0-beta.100

package/components/{workflow → form-generic}/src/components/form-builder/components/expression-builder/expression-builder.component.d.ts

@@ -8,7 +8,7 @@ export declare class ExpressionBuilderComponent {
     modal?: SdModal;
     form: FormGroup<{}>;
     attributeOperators: Record<"string" | "number" | "boolean" | "datetime" | "values", {
-        value: import("@sd-angular/core/components/workflow").Operator;
+        value: import("@sd-angular/core/components/form-generic").Operator;
         symbol?: string;
         display: string;
     }[]>;

package/components/form-generic/src/components/form-builder/components/group/attribute/group-attribute.component.d.ts

@@ -0,0 +1,23 @@
+import { FormGroup } from '@angular/forms';
+import { SdFormGenericComponent, SdFormGenericGroup } from '../../../../../models';
+import * as i0 from "@angular/core";
+declare const COLOR_PRESETS: readonly ["primary", "secondary", "success", "warning", "error"];
+export declare class GroupAttribute {
+    #private;
+    readonly iconPresets: readonly ["category", "folder", "inventory_2", "group_work", "workspaces", "view_quilt"];
+    readonly colorPresets: readonly ["primary", "secondary", "success", "warning", "error"];
+    readonly componentIcons: Record<string, {
+        symbol: string;
+        label: string;
+    }>;
+    form: FormGroup<{}>;
+    /** Required group reference. Mutated in place khi user pick icon/color/expression. */
+    readonly group: import("@angular/core").InputSignal<SdFormGenericGroup>;
+    constructor();
+    pickIcon: (icon: string) => void;
+    pickColor: (color: (typeof COLOR_PRESETS)[number]) => void;
+    symbolForChild: (c: SdFormGenericComponent) => string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GroupAttribute, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GroupAttribute, "group-attribute", never, { "group": { "alias": "group"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+export {};

package/components/form-generic/src/components/form-builder/components/group/index.d.ts

@@ -0,0 +1 @@
+export * from './attribute/group-attribute.component';

package/components/{workflow → form-generic}/src/components/form-builder/components/index.d.ts

@@ -10,3 +10,4 @@ export * from './checkbox';
 export * from './html';
 export * from './upload';
 export * from './table';
+export * from './group';

package/components/{workflow → form-generic}/src/components/form-builder/components/table/control/table-control.component.d.ts

@@ -11,6 +11,9 @@ export declare class TableControl {
     constructor(ref: ChangeDetectorRef, builderService: BuilderService);
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
+    columnIcon: (type: string) => "image" | "text_fields" | "123" | "calendar_month" | "radio_button_checked" | "check_box" | "attach_file";
+    sampleRows: () => number[];
+    cellPreview: (column: any, rowIndex: number) => any;
     static ɵfac: i0.ɵɵFactoryDeclaration<TableControl, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<TableControl, "table-control", never, { "_component": { "alias": "component"; "required": true; }; }, {}, never, never, true, never>;
 }

package/components/form-generic/src/components/form-builder/form-builder.component.d.ts

@@ -0,0 +1,120 @@
+import { CdkDragDrop, CdkDragMove } from '@angular/cdk/drag-drop';
+import { FormGroup } from '@angular/forms';
+import { SdBaseSecureComponent } from '@sd-angular/core/components/base';
+import { SdModal } from '@sd-angular/core/components/modal';
+import { FormBuilderComponent, FormBuilderComponentGroup, SdFormGenericComponent, SdFormGenericGroup, SdFormGenericVariable } from '../../models';
+import { SdFormGenericValidation } from '../../models/form-generic-validation.model';
+import { SdFormGeneric } from '../../models/form-generic.model';
+import { SdFormRender } from '../form-render/form-render.component';
+import { ConfigureValidationComponent } from './components/configure-validation/configure-validation.component';
+import * as i0 from "@angular/core";
+interface DragDropRowItem {
+    items: (SdFormGenericComponent | SdFormGenericGroup)[];
+    rowIndex?: number;
+}
+export declare class SdFormBuilder extends SdBaseSecureComponent {
+    #private;
+    readonly popupViewJSON: import("@angular/core").Signal<SdModal | undefined>;
+    readonly popupConfigureVariables: import("@angular/core").Signal<SdModal | undefined>;
+    readonly configureValidation: import("@angular/core").Signal<ConfigureValidationComponent | undefined>;
+    readonly formRender: import("@angular/core").Signal<SdFormRender | undefined>;
+    form: FormGroup<{}>;
+    /** Input chính: schema form. Mỗi lần ref thay đổi → effect sẽ clone về local arrays. */
+    readonly formGeneric: import("@angular/core").InputSignal<SdFormGeneric | undefined>;
+    readonly formBuilderComponents: FormBuilderComponent[];
+    readonly componentIcons: Record<string, {
+        symbol: string;
+        label: string;
+    }>;
+    readonly paletteSearch: import("@angular/core").WritableSignal<string>;
+    readonly paletteGroups: import("@angular/core").Signal<{
+        key: FormBuilderComponentGroup;
+        label: string;
+        items: FormBuilderComponent[];
+    }[]>;
+    components: Required<SdFormGeneric>['components'];
+    variables: Required<SdFormGeneric>['variables'];
+    validations: Required<SdFormGeneric>['validations'];
+    /** Cloned variables — dùng cho modal "Configure variables" (huỷ thì discard, ok thì gán ngược). */
+    clonedVariables: SdFormGenericVariable[];
+    readonly selectedComponent: import("@angular/core").WritableSignal<SdFormGenericComponent | SdFormGenericGroup | undefined>;
+    readonly isPreview: import("@angular/core").WritableSignal<boolean>;
+    /** 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: import("@angular/core").WritableSignal<boolean>;
+    expand: boolean;
+    dragDropRows: DragDropRowItem[];
+    isDragging: boolean;
+    targetItem?: DragDropRowItem;
+    private lastDragPointer?;
+    /** Handler chung cho mọi cdkDragStarted — set signal global true. */
+    onAnyDragStarted: () => void;
+    onAnyDragMoved: (event: CdkDragMove<any>) => void;
+    /** Handler chung cho mọi cdkDragEnded — set signal global false (dùng setTimeout 0
+     *  để chờ CDK xử lý xong drop event trước khi UI re-enable). */
+    onAnyDragEnded: () => void;
+    constructor();
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    addComponent: (item: FormBuilderComponent, index?: number) => void;
+    /** Symbol Material để render trên canvas item / attribute header. */
+    symbolFor: (item: SdFormGenericComponent | SdFormGenericGroup) => string;
+    /** Human-readable type label (e.g. "Text field", "Date"). */
+    typeLabelFor: (item: SdFormGenericComponent | SdFormGenericGroup) => string;
+    /** True nếu component có expression điều kiện — drives the "conditional" status chip. */
+    hasConditional: (item: SdFormGenericComponent | SdFormGenericGroup) => boolean;
+    /** Map SdColor preset → 2 CSS var names cho header-bg và header-fg của group card. */
+    groupColorVars: (color: string | undefined | null) => {
+        bg: string;
+        fg: string;
+    };
+    /** 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.
+     */
+    insertBreakAfter: (row: DragDropRowItem) => void;
+    /** Remove a child component from a group's nested list. */
+    removeFromGroup: (group: SdFormGenericGroup, id: string) => void;
+    removeComponent: (id: string) => void;
+    selectComponent: (item?: SdFormGenericComponent | SdFormGenericGroup) => void;
+    onClickedOutside: (e: any) => void;
+    clickFormContentEmpty: () => void;
+    drop: (event: CdkDragDrop<any[]>) => void;
+    dragStartComponentItem: (event: any) => void;
+    dragEndComponentItem: (event: any) => void;
+    onMouseover: (event: MouseEvent, rowItem: DragDropRowItem) => void;
+    onFocus: (event: FocusEvent) => void;
+    xuLyKeoCheo: (dragItem?: SdFormGenericComponent | SdFormGenericGroup) => void;
+    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;
+    jsonString?: string;
+    viewJSON: () => void;
+    updateJSON: () => void;
+    configureVariables: () => void;
+    addVariables: () => void;
+    removeVariables: (id: string) => void;
+    updateVariables: () => void;
+    getComponents: () => (SdFormGenericComponent | SdFormGenericGroup)[];
+    getVariables: () => SdFormGenericVariable[];
+    getForm: () => SdFormGeneric;
+    openConfigureValidation: () => void;
+    onUpdateValidations: (validations: SdFormGenericValidation[]) => void;
+    onValidate: () => Promise<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdFormBuilder, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdFormBuilder, "sd-form-builder", never, { "formGeneric": { "alias": "formGeneric"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+export {};

package/components/{workflow → form-generic}/src/components/form-render/form-render.component.d.ts

@@ -2,7 +2,7 @@ import { AfterViewInit, ChangeDetectorRef, OnDestroy, QueryList } from '@angular
 import { FormGroup } from '@angular/forms';
 import { SdBaseSecureComponent } from '@sd-angular/core/components/base';
 import { Subject } from 'rxjs';
-import { ISdWorkflowConfiguration } from '../../configurations';
+import { ISdFormGenericConfiguration } from '../../configurations';
 import { SdFormRenderConfiguration } from '../../models';
 import { SdFormGenericValidation } from '../../models/form-generic-validation.model';
 import { LibItemComponent } from './components';
@@ -10,7 +10,7 @@ import * as i0 from "@angular/core";
 export declare class SdFormRender extends SdBaseSecureComponent implements OnDestroy, AfterViewInit {
     #private;
     private ref;
-    private workflowConfiguration;
+    private formGenericConfiguration;
     formRenderItems: QueryList<LibItemComponent>;
     form: FormGroup;
     configuration: SdFormRenderConfiguration;
@@ -29,11 +29,11 @@ export declare class SdFormRender extends SdBaseSecureComponent implements OnDes
         key: string;
         value: any;
     }>;
-    constructor(ref: ChangeDetectorRef, workflowConfiguration: ISdWorkflowConfiguration);
+    constructor(ref: ChangeDetectorRef, formGenericConfiguration: ISdFormGenericConfiguration | null);
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     upload: () => Promise<void>;
     getValidationMessages: (alert: SdFormGenericValidation["alert"]) => Promise<string[] | undefined>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SdFormRender, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdFormRender, [null, { optional: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SdFormRender, "sd-form-render", never, { "form": { "alias": "form"; "required": false; }; "_configuration": { "alias": "configuration"; "required": true; }; "_default": { "alias": "defaultEntity"; "required": false; }; "_entity": { "alias": "entity"; "required": false; }; "_properties": { "alias": "properties"; "required": false; }; "_viewed": { "alias": "viewed"; "required": false; }; }, {}, never, never, true, never>;
 }

package/components/{workflow → form-generic}/src/components/sd-feel-expression/sd-feel-expression.component.d.ts

@@ -14,7 +14,7 @@ export declare class SdFeelExpression extends SdBaseSecureComponent {
     modal?: SdModal;
     form: FormGroup<{}>;
     attributeOperators: Record<"string" | "number" | "boolean" | "datetime" | "values", {
-        value: import("@sd-angular/core/components/workflow").Operator;
+        value: import("@sd-angular/core/components/form-generic").Operator;
         symbol?: string;
         display: string;
     }[]>;

package/components/{workflow/src/configurations/workflow.configuration.d.ts → form-generic/src/configurations/form-generic.configuration.d.ts}

@@ -1,6 +1,6 @@
 import { InjectionToken } from '@angular/core';
 import { IWorkflowConfigurationForm } from './form.configuration';
-export interface ISdWorkflowConfiguration {
+export interface ISdFormGenericConfiguration {
     form?: IWorkflowConfigurationForm;
 }
-export declare const SD_WORKFLOW_CONFIGURATION: InjectionToken<ISdWorkflowConfiguration>;
+export declare const SD_FORM_GENERIC_CONFIGURATION: InjectionToken<ISdFormGenericConfiguration>;

package/components/form-generic/src/configurations/index.d.ts

@@ -0,0 +1,2 @@
+export * from './form-generic.configuration';
+export * from './form.configuration';

package/components/{workflow → form-generic}/src/models/form-generic-component.model.d.ts

@@ -5,6 +5,7 @@ import { SdPatternType } from '@sd-angular/core/utilities/models';
 import { SdFormGenericSelectionStaticItem } from './form-generic-definition-selection.model';
 import { SdFormGenericExpression } from './form-generic-expression.model';
 import { SdFormGeneric } from './form-generic.model';
+import { SdUnwrapSignal } from '@sd-angular/core/utilities/models';
 export interface SdFormRenderConfiguration {
     onLoaded?: () => void;
     components: SdFormGeneric['components'];
@@ -25,7 +26,7 @@ export interface SdFormGenericVariable {
     key: string;
     label: string;
 }
-export type SdFormGenericComponent = SdFormGenericTextfield | SdFormGenericChipString | SdFormGenericChipCalendar | SdFormGenericTextarea | SdFormGenericNumber | SdFormGenericCheckbox | SdFormGenericDatetime | SdFormGenericValues | SdFormGenericUpload | SdFormGenericTable | SdFormGenericHtml;
+export type SdFormGenericComponent = SdFormGenericTextfield | SdFormGenericChipString | SdFormGenericChipCalendar | SdFormGenericTextarea | SdFormGenericNumber | SdFormGenericCheckbox | SdFormGenericDatetime | SdFormGenericValues | SdFormGenericUpload | SdFormGenericTable | SdFormGenericHtml | SdFormGenericBreak;
 export type SdFormGenericValues = SdFormGenericRadio | SdFormGenericSelect | SdFormGenericChecklist;
 export interface SdFormGenericComponentBase {
     template?: string;
@@ -158,10 +159,10 @@ export interface SdFormGenericGroup {
 export interface SdFormGenericUpload extends SdFormGenericComponentBase {
     type: 'upload';
     properties?: {
-        type?: SdUploadFile['type'];
-        maxSize?: SdUploadFile['maxSize'];
-        max?: SdUploadFile['max'];
-        extensions?: SdUploadFile['extensions'];
+        type?: SdUnwrapSignal<SdUploadFile['type']>;
+        maxSize?: SdUnwrapSignal<SdUploadFile['maxSize']>;
+        max?: SdUnwrapSignal<SdUploadFile['max']>;
+        extensions?: SdUnwrapSignal<SdUploadFile['extensions']>;
         args?: Record<string, any>;
         source?: 'ALL' | 'PHOTO_LIBRARY' | 'CAPTURE';
     } & SdFormGenericComponentBase['properties'];
@@ -253,6 +254,17 @@ export interface SdFormGenericTable extends SdFormGenericComponentBase {
         titleButtonCreate?: string;
     } & SdFormGenericComponentBase['properties'];
 }
+/**
+ * Break component — invisible runtime element ép xuống dòng mới. Dùng khi layout có
+ * vùng cố định và việc ẩn/hiện trường khác không nên xáo trộn vị trí các trường còn lại.
+ * Ở canvas (design) render thanh ngang mảnh; ở runtime render empty 12-col cell.
+ *
+ * Extend SdFormGenericComponentBase để tương thích với union narrowing trong các pipe/render
+ * (key, validate, disabled, properties full) — runtime sẽ ignore mọi field ngoài id/type/layout.
+ */
+export interface SdFormGenericBreak extends SdFormGenericComponentBase {
+    type: 'break';
+}
 export interface SdFormGenericHtml {
     template?: string;
     id: string;
@@ -281,12 +293,21 @@ export interface SdFormGenericHtml {
         query?: Record<string, any>;
     };
 }
+export type FormBuilderComponentGroup = 'basic' | 'choice' | 'advanced' | 'layout';
 export interface FormBuilderComponent {
     type: string;
-    icon: string;
+    /** Material Symbols Rounded icon name. Rendered via <span class="msi">{symbol}</span>. */
+    symbol: string;
+    /** Category group for the left palette grouping. */
+    group: FormBuilderComponentGroup;
     name: string;
 }
 export declare const FormBuilderComponents: FormBuilderComponent[];
+/** Lookup: component type → Material Symbol + label, used by attribute panel header. */
+export declare const COMPONENT_ICONS: Record<string, {
+    symbol: string;
+    label: string;
+}>;
 export declare const GetComponentAttributes: (components: (SdFormGenericComponent | SdFormGenericGroup)[]) => {
     value: string;
     display: string;

package/components/{workflow → form-generic}/src/models/form-generic-expression.model.d.ts

@@ -69,5 +69,6 @@ export declare const AttributeOperators: Record<Attribute['type'], {
 }[]>;
 export declare const GetAttributes: (components: (SdFormGenericComponent | SdFormGenericGroup)[]) => Attribute[];
 export declare const TemplateToCondition: (template: string | undefined | null, entity: Record<string, any>) => string | undefined;
+export declare const EvaluateExpression: (condition: SdFormGenericExpression | SdFormGenericExpressionCondition, entity: Record<string, any>) => boolean | undefined;
 export declare const ExpressionToJavascriptExpression: (condition: SdFormGenericExpression | SdFormGenericExpressionCondition) => string | undefined;
 export {};

package/components/{workflow → form-generic}/src/models/index.d.ts

@@ -1,4 +1,5 @@
 export * from './form-render';
+export * from './form-generic.model';
 export * from './form-generic-component.model';
 export * from './form-generic-template.model';
 export * from './form-generic-definition-selection.model';

package/components/{workflow → form-generic}/src/pipes/html.pipe.d.ts

@@ -1,11 +1,11 @@
 import { PipeTransform } from '@angular/core';
-import { SdSafeHtmlPipe } from '@sd-angular/core/pipes';
+import { DomSanitizer } from '@angular/platform-browser';
 import { SdFormGenericHtml } from '../models';
 import * as i0 from "@angular/core";
 export declare class HtmlPipe implements PipeTransform {
-    private readonly htmlSafePipe;
-    constructor(htmlSafePipe: SdSafeHtmlPipe);
-    transform: (hashed: string | undefined | null, content: string, component: SdFormGenericHtml) => import("@angular/platform-browser").SafeHtml | undefined;
+    private readonly sanitizer;
+    constructor(sanitizer: DomSanitizer);
+    transform: (hashed: string | undefined | null, content: string, component: SdFormGenericHtml) => string;
     static ɵfac: i0.ɵɵFactoryDeclaration<HtmlPipe, never>;
     static ɵpipe: i0.ɵɵPipeDeclaration<HtmlPipe, "htmlPipe", true>;
 }

package/components/{workflow → form-generic}/src/services/form-generic.service.d.ts

@@ -1,13 +1,13 @@
 import { SdSearch } from '@sd-angular/core/forms';
-import { ISdWorkflowConfiguration } from '../configurations';
+import { ISdFormGenericConfiguration } from '../configurations';
 import { SdFormGenericArgs, SdFormGenericDefinitionHtml, SdFormGenericDefinitionSelection, SdFormGenericSelectionItem } from '../models';
 import * as i0 from "@angular/core";
 export declare class FormGenericService {
     #private;
     private readonly configuration;
-    constructor(configuration: ISdWorkflowConfiguration);
+    constructor(configuration: ISdFormGenericConfiguration);
     get selections(): (() => Promise<SdFormGenericDefinitionSelection[]>) | SdFormGenericDefinitionSelection<any, any>[] | (() => SdFormGenericDefinitionSelection<any, any>[]);
-    get tables(): import("@sd-angular/core/components/workflow").SdFormGenericDefinitionTable<any>[];
+    get tables(): import("@sd-angular/core/components/form-generic").SdFormGenericDefinitionTable<any>[];
     getSelection: (valuesKey: string | undefined | null) => Promise<SdFormGenericDefinitionSelection | undefined>;
     selection: {
         definitions: () => Promise<SdFormGenericDefinitionSelection[]>;

package/components/index.d.ts

@@ -1,3 +1,4 @@
+export * from '@sd-angular/core/components/avatar';
 export * from '@sd-angular/core/components/button';
 export * from '@sd-angular/core/components/badge';
 export * from '@sd-angular/core/components/tab-router';
@@ -7,9 +8,15 @@ export * from '@sd-angular/core/components/table';
 export * from '@sd-angular/core/components/quick-action';
 export * from '@sd-angular/core/components/upload-file';
 export * from '@sd-angular/core/components/section';
-export * from '@sd-angular/core/components/workflow';
 export * from '@sd-angular/core/components/anchor';
-export * from '@sd-angular/core/components/anchor-v2';
 export * from '@sd-angular/core/components/query-builder';
 export * from '@sd-angular/core/components/import-excel';
 export * from '@sd-angular/core/components/document-builder';
+export * from '@sd-angular/core/components/mini-editor';
+export * from '@sd-angular/core/components/view';
+export * from '@sd-angular/core/components/code-editor';
+export * from '@sd-angular/core/components/chart';
+export * from '@sd-angular/core/components/editor';
+export * from '@sd-angular/core/components/splitter';
+export * from '@sd-angular/core/components/preview';
+export * from '@sd-angular/core/components/autoid-inspector';

package/components/mini-editor/index.d.ts

@@ -0,0 +1,2 @@
+export * from './src/mini-editor.model';
+export * from './src/mini-editor.component';

package/components/mini-editor/src/mini-editor.component.d.ts

@@ -0,0 +1,91 @@
+import { EventEmitter } from '@angular/core';
+import { ClassicEditor } from 'ckeditor5';
+import { ControlValueAccessor } from '@angular/forms';
+import { SdMiniEditorOption, SdMiniEditorConfig } from './mini-editor.model';
+import * as i0 from "@angular/core";
+/**
+ * Component sd-mini-editor - Editor đơn giản cho comment input
+ * Sử dụng CKEditor với chế độ đơn giản (bold, italic, link)
+ * Hỗ trợ mention và output format (html/markdown)
+ *
+ * @example
+ * ```html
+ * <sd-mini-editor
+ *   [option]="editorOption"
+ *   [(ngModel)]="content"
+ *   (contentChange)="onContentChange($event)"
+ * >
+ * </sd-mini-editor>
+ * ```
+ */
+export declare class SdMiniEditor implements ControlValueAccessor {
+    #private;
+    /** Cấu hình option cho editor */
+    option: SdMiniEditorOption;
+    get maxEditorHeight(): string | undefined;
+    /** NgModel binding - nội dung HTML/Markdown */
+    value: string;
+    valueChange: EventEmitter<string>;
+    /** Event emitter khi content thay đổi */
+    contentChange: EventEmitter<string>;
+    /** Event emitter khi blur */
+    blur: EventEmitter<FocusEvent>;
+    /** Event emitter khi focus */
+    focus: EventEmitter<FocusEvent>;
+    /** Disabled state */
+    disabled: boolean;
+    Editor: typeof ClassicEditor;
+    get editorConfig(): SdMiniEditorConfig;
+    constructor();
+    ngOnDestroy(): void;
+    /**
+     * Xử lý khi editor ready
+     */
+    onReady(editor: ClassicEditor): void;
+    /**
+     * Set nội dung cho editor
+     */
+    setContent(content: string): void;
+    /**
+     * Get nội dung từ editor
+     */
+    getContent(): string;
+    /**
+     * Get nội dung HTML gốc (không convert)
+     */
+    getHtmlContent(): string;
+    /**
+     * Focus vào editor
+     */
+    focusEditor(): void;
+    /**
+     * Insert mention vào vị trí con trỏ hiện tại
+     */
+    insertMention(item: {
+        id: string;
+        name: string;
+        marker?: string;
+    }): void;
+    /**
+     * Get danh sách mentions trong nội dung
+     */
+    getMentions(): Array<{
+        id: string;
+        name: string;
+        marker: string;
+    }>;
+    /**
+     * ControlValueAccessor: Write value
+     */
+    writeValue(value: string): void;
+    /**
+     * ControlValueAccessor: Register change callback
+     */
+    registerOnChange(fn: (value: string) => void): void;
+    /**
+     * ControlValueAccessor: Register touched callback
+     */
+    registerOnTouched(fn: () => void): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdMiniEditor, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdMiniEditor, "sd-mini-editor", never, { "option": { "alias": "option"; "required": true; }; "value": { "alias": "value"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "valueChange": "valueChange"; "contentChange": "contentChange"; "blur": "blur"; "focus": "focus"; }, never, never, true, never>;
+}

package/components/mini-editor/src/mini-editor.model.d.ts

@@ -0,0 +1,44 @@
+import { EditorConfig, MentionFeed, MentionFeedObjectItem } from 'ckeditor5';
+export type { MentionFeedObjectItem };
+export type SdMiniEditorOutputFormat = 'html' | 'markdown';
+export interface SdMiniEditorMentionConfig {
+    /** Feed data cho mention - có thể là array hoặc function trả về Promise
+     * CKEditor MentionFeed đã hỗ trợ: marker, minChars, dropdownLimit, itemRenderer
+     */
+    feeds?: MentionFeed[];
+    /** Custom render function cho giá trị mention khi chèn vào editor
+     * Trả về object với text và các attributes tùy chỉnh
+     */
+    valueRender?: (item: MentionFeedObjectItem) => {
+        text: string;
+        attributes?: Record<string, string>;
+    };
+}
+export type SdMiniEditorMentionItem<T = any> = MentionFeedObjectItem & {
+    data?: T;
+};
+export interface SdMiniEditorOption {
+    /** Output format: 'html' hoặc 'markdown' (mặc định: 'html') */
+    outputFormat?: SdMiniEditorOutputFormat;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Chiều cao editor (mặc định: auto) */
+    height?: string;
+    /** Chiều cao tối đa của editor (ví dụ: '300px') */
+    maxHeight?: string;
+    /** Bật/tắt mention plugin */
+    enableMention?: boolean;
+    /** Cấu hình mention */
+    mentionConfig?: SdMiniEditorMentionConfig;
+    /** Callback khi nội dung thay đổi */
+    onChange?: (content: string) => void;
+    /** Callback khi blur */
+    onBlur?: (event: FocusEvent) => void;
+    /** Callback khi focus */
+    onFocus?: (event: FocusEvent) => void;
+    /** Callback khi mention được chọn */
+    onMentionSelect?: (item: SdMiniEditorMentionItem) => void;
+}
+export type SdMiniEditorConfig = EditorConfig & {
+    getOption?: () => SdMiniEditorOption;
+};

package/components/modal/index.d.ts

@@ -1 +1 @@
-export * from './src/modal/modal.component';
+export * from './src/modal.component';

package/components/modal/src/modal.component.d.ts

@@ -0,0 +1,29 @@
+import { ElementRef, TemplateRef } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class SdModal {
+    #private;
+    static index: import("@angular/core").WritableSignal<number>;
+    templateRef: import("@angular/core").Signal<TemplateRef<any>>;
+    modal: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    readonly autoIdInput: import("@angular/core").InputSignal<string | null | undefined>;
+    readonly autoId: import("@angular/core").Signal<string | undefined>;
+    readonly closeButtonAutoId: import("@angular/core").Signal<string | undefined>;
+    readonly dataOpened: import("@angular/core").Signal<"true" | "false">;
+    title: import("@angular/core").InputSignalWithTransform<string, string | null | undefined>;
+    color: import("@angular/core").InputSignalWithTransform<import("@sdcorejs/utils/models").Color, import("@sdcorejs/utils/models").Color | null | undefined>;
+    width: import("@angular/core").InputSignalWithTransform<string, string | null | undefined>;
+    height: import("@angular/core").InputSignalWithTransform<string, string | null | undefined>;
+    view: import("@angular/core").InputSignalWithTransform<"dialog" | "bottom-sheet" | undefined, "dialog" | "bottom-sheet" | null | undefined>;
+    modalClass: import("@angular/core").InputSignalWithTransform<string | string[] | Record<string, boolean>, string | string[] | Record<string, boolean> | null | undefined>;
+    lazyLoadContent: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    hideClose: import("@angular/core").InputSignalWithTransform<boolean, boolean | "">;
+    disableBackdropClose: import("@angular/core").InputSignalWithTransform<boolean, boolean | "">;
+    sdClosed: import("@angular/core").OutputEmitterRef<void>;
+    isOpened: import("@angular/core").WritableSignal<boolean>;
+    alreadyOpened: import("@angular/core").WritableSignal<boolean>;
+    constructor();
+    open: () => void;
+    close: () => void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdModal, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdModal, "sd-modal", never, { "autoIdInput": { "alias": "autoId"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "view": { "alias": "view"; "required": false; "isSignal": true; }; "modalClass": { "alias": "modalClass"; "required": false; "isSignal": true; }; "lazyLoadContent": { "alias": "lazyLoadContent"; "required": false; "isSignal": true; }; "hideClose": { "alias": "hideClose"; "required": false; "isSignal": true; }; "disableBackdropClose": { "alias": "disableBackdropClose"; "required": false; "isSignal": true; }; }, { "sdClosed": "sdClosed"; }, never, ["[sdHeaderLeft]", "[sdHeaderRight]", "[sdHeader]", "*", "[sdFooterLeft]", "[sdFooterRight]", "[sdFooter]"], true, never>;
+}

package/components/preview/index.d.ts

@@ -1 +1,4 @@
 export * from './src/preview-image/preview-image.component';
+export * from './src/preview-image/preview-image.types';
+export * from './src/preview-pdf/preview-pdf.component';
+export * from './src/preview-pdf/preview-pdf.types';