@sdcorejs/angular 19.0.0-rc.1

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

@@ -0,0 +1,19 @@
+import * as i0 from "@angular/core";
+export declare class SdAvatar {
+    #private;
+    /**
+     * The source string to be used for the avatar.
+     * - If it matches a URL pattern, an image is displayed.
+     * - If it is a string representing a name, initials and a colored background are generated.
+     * - If undefined, it falls back to a neutral ? initial.
+     */
+    readonly src: import("@angular/core").InputSignal<string | null | undefined>;
+    readonly size: import("@angular/core").InputSignal<number>;
+    constructor();
+    readonly isUrl: import("@angular/core").Signal<boolean>;
+    readonly bgColor: import("@angular/core").Signal<string>;
+    readonly initials: import("@angular/core").Signal<string>;
+    handleError(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdAvatar, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdAvatar, "sd-avatar", never, { "src": { "alias": "src"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/components/badge/index.d.ts

@@ -0,0 +1 @@
+export * from './src/badge.component';

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

@@ -0,0 +1,98 @@
+import { EventEmitter } from '@angular/core';
+import { Color, Size } from '@sdcorejs/utils/models';
+import { MaterialIconFontSet } from '@sdcorejs/angular/utilities/models';
+import * as i0 from "@angular/core";
+export type SdBadgeType = 'tag' | 'round' | 'icon';
+export declare class SdBadge {
+    defaultIcon: string;
+    type: import("@angular/core").InputSignalWithTransform<SdBadgeType, SdBadgeType | null | undefined>;
+    color: import("@angular/core").InputSignalWithTransform<Color, Color | null | undefined>;
+    primary: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    secondary: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    success: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    info: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    warning: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    error: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    fontSet: import("@angular/core").InputSignalWithTransform<MaterialIconFontSet, MaterialIconFontSet | null | undefined>;
+    title: import("@angular/core").InputSignal<string | number | null | undefined>;
+    description: import("@angular/core").InputSignal<string | null | undefined>;
+    tooltip: import("@angular/core").InputSignal<string | null | undefined>;
+    icon: import("@angular/core").InputSignal<string | null | undefined>;
+    size: import("@angular/core").InputSignalWithTransform<Size, Size | null | undefined>;
+    click: EventEmitter<Event>;
+    onClick: (event: Event) => void;
+    effectiveColor: import("@angular/core").Signal<Color>;
+    baseColorClasses: import("@angular/core").Signal<{
+        'c-primary': boolean;
+        'c-secondary': boolean;
+        'c-info': boolean;
+        'c-success': boolean;
+        'c-warning': boolean;
+        'c-error': boolean;
+    }>;
+    iconColorClasses: import("@angular/core").Signal<{
+        'c-primary': boolean;
+        'c-black400': boolean;
+        'c-info': boolean;
+        'c-success': boolean;
+        'c-warning': boolean;
+        'c-error': boolean;
+    }>;
+    iconSizeAndFontClasses: import("@angular/core").Signal<{
+        'c-sm': boolean;
+        'c-md': boolean;
+        'c-lg': boolean;
+        'material-icons': boolean;
+        'material-icons-outlined': boolean;
+        'material-icons-round': boolean;
+        'material-icons-sharp': boolean;
+    }>;
+    containerSizeClasses: import("@angular/core").Signal<{
+        'c-badge--sm': boolean;
+        'c-badge--md': boolean;
+        'c-badge--lg': boolean;
+    }>;
+    tagIconCombinedClasses: import("@angular/core").Signal<{
+        'c-primary': boolean;
+        'c-secondary': boolean;
+        'c-info': boolean;
+        'c-success': boolean;
+        'c-warning': boolean;
+        'c-error': boolean;
+        'c-sm': boolean;
+        'c-md': boolean;
+        'c-lg': boolean;
+        'material-icons': boolean;
+        'material-icons-outlined': boolean;
+        'material-icons-round': boolean;
+        'material-icons-sharp': boolean;
+    }>;
+    containerCombinedClasses: import("@angular/core").Signal<{
+        'c-badge--sm': boolean;
+        'c-badge--md': boolean;
+        'c-badge--lg': boolean;
+        'c-primary': boolean;
+        'c-secondary': boolean;
+        'c-info': boolean;
+        'c-success': boolean;
+        'c-warning': boolean;
+        'c-error': boolean;
+    }>;
+    iconCombinedClasses: import("@angular/core").Signal<{
+        'c-primary': boolean;
+        'c-black400': boolean;
+        'c-info': boolean;
+        'c-success': boolean;
+        'c-warning': boolean;
+        'c-error': boolean;
+        'c-sm': boolean;
+        'c-md': boolean;
+        'c-lg': boolean;
+        'material-icons': boolean;
+        'material-icons-outlined': boolean;
+        'material-icons-round': boolean;
+        'material-icons-sharp': boolean;
+    }>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdBadge, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdBadge, "sd-badge", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "primary": { "alias": "primary"; "required": false; "isSignal": true; }; "secondary": { "alias": "secondary"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "info": { "alias": "info"; "required": false; "isSignal": true; }; "warning": { "alias": "warning"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "fontSet": { "alias": "fontSet"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "tooltip": { "alias": "tooltip"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "click": "click"; }, never, never, true, never>;
+}

package/components/base/index.d.ts

@@ -0,0 +1 @@
+export * from './src/base-secure.component';

package/components/base/src/base-secure.component.d.ts

@@ -0,0 +1,8 @@
+import { SdLicenseService } from '@sdcorejs/angular/services/license';
+import * as i0 from "@angular/core";
+export declare abstract class SdBaseSecureComponent {
+    protected licenseService: SdLicenseService;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdBaseSecureComponent, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SdBaseSecureComponent, never, never, {}, {}, never, never, true, never>;
+}

package/components/button/index.d.ts

@@ -0,0 +1 @@
+export * from './src/button.component';

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

@@ -0,0 +1,42 @@
+import { OnDestroy, OnInit } from '@angular/core';
+import { SdBaseSecureComponent } from '@sdcorejs/angular/components/base';
+import { Color } from '@sdcorejs/utils/models';
+import { MaterialIconFontSet } from '@sdcorejs/angular/utilities/models';
+import * as i0 from "@angular/core";
+export type SdButtonType = 'fill' | 'light' | 'outline' | 'link';
+export type SdButtonSize = 'sm' | 'md' | 'lg';
+export type SdButtonHtmlType = 'button' | 'submit' | 'reset';
+export declare class SdButton extends SdBaseSecureComponent implements OnInit, OnDestroy {
+    #private;
+    private el;
+    autoIdInput: import("@angular/core").InputSignal<string | null | undefined>;
+    type: import("@angular/core").InputSignalWithTransform<SdButtonType, SdButtonType | null | undefined>;
+    color: import("@angular/core").InputSignalWithTransform<Color, Color | null | undefined>;
+    size: import("@angular/core").InputSignalWithTransform<SdButtonSize, SdButtonSize | null | undefined>;
+    fontSet: import("@angular/core").InputSignalWithTransform<MaterialIconFontSet, MaterialIconFontSet | null | undefined>;
+    title: import("@angular/core").InputSignal<string | null | undefined>;
+    width: import("@angular/core").InputSignal<string | null | undefined>;
+    tooltip: import("@angular/core").InputSignal<string | null | undefined>;
+    prefixIcon: import("@angular/core").InputSignal<string | null | undefined>;
+    suffixIcon: import("@angular/core").InputSignal<string | null | undefined>;
+    disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    loading: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    block: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    htmlType: import("@angular/core").InputSignalWithTransform<SdButtonHtmlType, SdButtonHtmlType | null | undefined>;
+    autoId: import("@angular/core").Signal<string | undefined>;
+    buttonClasses: import("@angular/core").Signal<{
+        'c-square': boolean | "" | null | undefined;
+        'c-sm': boolean;
+        'c-md': boolean;
+        'c-lg': boolean;
+        'c-disabled': boolean;
+        'c-block': boolean;
+    }>;
+    click: import("@angular/core").OutputEmitterRef<Event>;
+    constructor();
+    ngOnInit(): void;
+    onInternalClick(event: Event): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdButton, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdButton, "sd-button", never, { "autoIdInput": { "alias": "autoId"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "fontSet": { "alias": "fontSet"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "tooltip": { "alias": "tooltip"; "required": false; "isSignal": true; }; "prefixIcon": { "alias": "prefixIcon"; "required": false; "isSignal": true; }; "suffixIcon": { "alias": "suffixIcon"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "block": { "alias": "block"; "required": false; "isSignal": true; }; "htmlType": { "alias": "htmlType"; "required": false; "isSignal": true; }; }, { "click": "click"; }, never, never, true, never>;
+}

package/components/chart/index.d.ts

@@ -0,0 +1,4 @@
+export * from './src/bar-chart.component';
+export * from './src/line-chart.component';
+export * from './src/pie-chart.component';
+export * from './src/doughnut-chart.component';

package/components/chart/src/bar-chart.component.d.ts

@@ -0,0 +1,18 @@
+import { ElementRef, InputSignal, OnDestroy, OnInit } from '@angular/core';
+import { Chart, ChartData, ChartOptions, Plugin } from 'chart.js';
+import * as i0 from "@angular/core";
+export declare class SdBarChartComponent implements OnInit, OnDestroy {
+    #private;
+    canvas: import("@angular/core").Signal<ElementRef<HTMLCanvasElement>>;
+    data: InputSignal<ChartData<'bar'>>;
+    options: InputSignal<ChartOptions<'bar'> | undefined>;
+    plugins: InputSignal<Plugin<'bar'>[]>;
+    isScrollable: import("@angular/core").Signal<boolean>;
+    computedMinWidth: import("@angular/core").Signal<number | null>;
+    chart: Chart<'bar'> | undefined;
+    constructor();
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdBarChartComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdBarChartComponent, "sd-bar-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "plugins": { "alias": "plugins"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/components/chart/src/doughnut-chart.component.d.ts

@@ -0,0 +1,16 @@
+import { ElementRef, InputSignal, OnDestroy, OnInit } from '@angular/core';
+import { Chart, ChartData, ChartOptions, Plugin } from 'chart.js';
+import * as i0 from "@angular/core";
+export declare class SdDoughnutChartComponent implements OnInit, OnDestroy {
+    #private;
+    canvas: import("@angular/core").Signal<ElementRef<HTMLCanvasElement>>;
+    data: InputSignal<ChartData<'doughnut'>>;
+    options: InputSignal<ChartOptions<'doughnut'> | undefined>;
+    plugins: InputSignal<Plugin<'doughnut'>[]>;
+    chart: Chart<'doughnut'> | undefined;
+    constructor();
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdDoughnutChartComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdDoughnutChartComponent, "sd-doughnut-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "plugins": { "alias": "plugins"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/components/chart/src/line-chart.component.d.ts

@@ -0,0 +1,18 @@
+import { ElementRef, InputSignal, OnDestroy, OnInit } from '@angular/core';
+import { Chart, ChartData, ChartOptions, Plugin } from 'chart.js';
+import * as i0 from "@angular/core";
+export declare class SdLineChartComponent implements OnInit, OnDestroy {
+    #private;
+    canvas: import("@angular/core").Signal<ElementRef<HTMLCanvasElement>>;
+    data: InputSignal<ChartData<'line'>>;
+    options: InputSignal<ChartOptions<'line'> | undefined>;
+    plugins: InputSignal<Plugin<'line'>[]>;
+    isScrollable: import("@angular/core").Signal<boolean>;
+    computedMinWidth: import("@angular/core").Signal<number | null>;
+    chart: Chart<'line'> | undefined;
+    constructor();
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdLineChartComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdLineChartComponent, "sd-line-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "plugins": { "alias": "plugins"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/components/chart/src/pie-chart.component.d.ts

@@ -0,0 +1,16 @@
+import { ElementRef, InputSignal, OnDestroy, OnInit } from '@angular/core';
+import { Chart, ChartData, ChartOptions, Plugin } from 'chart.js';
+import * as i0 from "@angular/core";
+export declare class SdPieChartComponent implements OnInit, OnDestroy {
+    #private;
+    canvas: import("@angular/core").Signal<ElementRef<HTMLCanvasElement>>;
+    data: InputSignal<ChartData<'pie'>>;
+    options: InputSignal<ChartOptions<'pie'> | undefined>;
+    plugins: InputSignal<Plugin<'pie'>[]>;
+    chart: Chart<'pie'> | undefined;
+    constructor();
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdPieChartComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdPieChartComponent, "sd-pie-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "plugins": { "alias": "plugins"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/components/ckeditor-styles/index.d.ts

@@ -0,0 +1 @@
+export * from './src/ckeditor-styles.component';

package/components/ckeditor-styles/src/ckeditor-styles.component.d.ts

@@ -0,0 +1,25 @@
+import * as i0 from "@angular/core";
+/**
+ * Styles-only component that loads the global CKEditor 5 stylesheet on demand.
+ *
+ * Why this exists:
+ * - CKEditor's CSS must be global (applies to body-rendered overlays, dialogs, balloons),
+ *   which means whichever Angular component declares it must use ViewEncapsulation.None.
+ * - Switching encapsulation on the main editor components (`<sd-editor>`, `<sd-mini-editor>`,
+ *   `<sd-document-builder>`) would un-scope all their local styles too.
+ * - Instead, this tiny no-render component owns the global CSS. The editor components embed
+ *   `<sd-ckeditor-styles>` at the top of their template; the CSS is injected once into <head>
+ *   the first time any editor instance mounts. Editor components themselves keep
+ *   ViewEncapsulation.Emulated.
+ *
+ * Behavior:
+ * - Renders nothing in the DOM (empty template).
+ * - Angular dedupes styles per component class — multiple instances inject the <style> tag
+ *   only once.
+ * - When the host editor component is lazy-loaded, this component's chunk and its CSS travel
+ *   with it.
+ */
+export declare class SdCKEditorStyles {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdCKEditorStyles, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdCKEditorStyles, "sd-ckeditor-styles", never, {}, {}, never, never, true, never>;
+}

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

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

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

@@ -0,0 +1,25 @@
+import { SafeHtml } from '@angular/platform-browser';
+import 'prismjs/components/prism-typescript';
+import 'prismjs/components/prism-json';
+import 'prismjs/components/prism-css';
+import 'prismjs/components/prism-scss';
+import 'prismjs/components/prism-markup';
+import * as i0 from "@angular/core";
+export type CodeLanguage = 'html' | 'typescript' | 'json' | 'css' | 'scss';
+export declare class SdCodeEditor {
+    #private;
+    valueModel: import("@angular/core").ModelSignal<any>;
+    language: import("@angular/core").InputSignal<CodeLanguage>;
+    maxHeight: import("@angular/core").InputSignal<string>;
+    viewed: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    copied: import("@angular/core").WritableSignal<boolean>;
+    textValue: import("@angular/core").WritableSignal<string>;
+    prismLang: import("@angular/core").Signal<CodeLanguage | "markup">;
+    private _lastEmittedValue;
+    constructor();
+    highlightedCode: import("@angular/core").Signal<SafeHtml>;
+    onTextChange(newText: string): void;
+    copyToClipboard(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdCodeEditor, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdCodeEditor, "sd-code-editor", never, { "valueModel": { "alias": "model"; "required": false; "isSignal": true; }; "language": { "alias": "language"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "viewed": { "alias": "viewed"; "required": false; "isSignal": true; }; }, { "valueModel": "modelChange"; }, never, never, true, never>;
+}

package/components/document-builder/index.d.ts

@@ -0,0 +1,4 @@
+export * from './src/components';
+export * from './src/document-builder.model';
+export * from './src/document-builder.component';
+export * from './src/plugins/ck-comment/ck-comment.plugin.model';

package/components/document-builder/src/components/header-footer-builder/header-footer-builder.component.d.ts

@@ -0,0 +1,16 @@
+import { EventEmitter } from '@angular/core';
+import { DocumentBuilderI18n } from '../../document-builder.model';
+import { ClassicEditor, EditorConfig } from 'ckeditor5';
+import * as i0 from "@angular/core";
+export declare class SdHeaderFooterBuilder {
+    #private;
+    Editor: typeof ClassicEditor;
+    set model(value: string | undefined | null);
+    modelChange: EventEmitter<string>;
+    config: EditorConfig & {
+        _i18n?: DocumentBuilderI18n;
+    };
+    onReady(editor: ClassicEditor): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdHeaderFooterBuilder, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdHeaderFooterBuilder, "sd-header-footer-builder", never, { "model": { "alias": "model"; "required": false; }; }, { "modelChange": "modelChange"; }, never, never, true, never>;
+}

package/components/document-builder/src/components/header-footer-builder/plugins/page-number.plugin.d.ts

@@ -0,0 +1,4 @@
+import { Plugin } from 'ckeditor5';
+export declare class PageNumberPlugin extends Plugin {
+    init(): void;
+}

package/components/document-builder/src/components/index.d.ts

@@ -0,0 +1 @@
+export * from './header-footer-builder/header-footer-builder.component';

package/components/document-builder/src/document-builder.component.d.ts

@@ -0,0 +1,53 @@
+import { EventEmitter } from '@angular/core';
+import { ClassicEditor, ModelRange } from 'ckeditor5';
+import { VariablePlugin, CkCommentPlugin } from './plugins';
+import { DocumentBuilderOption, SdDocumentBuilderHeading, SdDocumentBuilderOption } from './document-builder.model';
+import * as i0 from "@angular/core";
+export declare class SdDocumentBuilder {
+    #private;
+    option: SdDocumentBuilderOption;
+    disabled: boolean;
+    set _disabled(val: boolean | '' | undefined | null);
+    contentChange: EventEmitter<string>;
+    Editor: typeof ClassicEditor;
+    config: DocumentBuilderOption;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    onReady(editor: ClassicEditor): void;
+    setContent: (html: string) => void;
+    getContent: () => string;
+    setOrientation: (orientation: "PORTRAIT" | "LANDSCAPE") => void;
+    getOrientation: () => "PORTRAIT" | "LANDSCAPE";
+    scrollToTop(): void;
+    heading: {
+        /**
+         * Lấy tất cả headings trong document
+         * @returns Danh sách tất cả headings
+         */
+        all: () => SdDocumentBuilderHeading[];
+        /**
+         * Scroll tới vị trí của heading
+         * @param id - ID của heading cần scroll tới
+         */
+        scroll: (id: string) => void;
+    };
+    getCommentPluginAPI(): CkCommentPlugin | null;
+    getVariablePluginAPI(): VariablePlugin | null;
+    /**
+     * Xuất file Word có Header/Footer
+     * @param fileName Tên file
+     * @param headerText Nội dung Header (hoặc HTML)
+     * '<p style="text-align: center; font-weight: bold;">CÔNG TY CỔ PHẦN CÔNG NGHỆ ABC</p>'
+     * @param footerText Nội dung Footer (hoặc HTML)
+     * '<p style="text-align: right; font-size: 10pt;">Trang <span style="mso-field-code: PAGE"></span> / <span style="mso-field-code: NUMPAGES"></span></p>'
+     */
+    exportDocx(args: {
+        fileName?: string;
+        header?: string;
+        footer?: string;
+    }): void;
+    hightSelectRange: (range: ModelRange) => void;
+    removeHighlightSeclectRange: () => void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdDocumentBuilder, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdDocumentBuilder, "sd-document-builder", never, { "option": { "alias": "option"; "required": true; }; "_disabled": { "alias": "disabled"; "required": false; }; }, { "contentChange": "contentChange"; }, never, never, true, never>;
+}

package/components/document-builder/src/document-builder.config.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Cấu hình màu cho Document Builder
+ * Bảng màu tập trung và cấu hình cho việc lựa chọn màu nhất quán
+ */
+import { ColorPickerConfig, FontColorConfig, FontSizeConfig, HeadingConfig } from 'ckeditor5';
+/**
+ * Trả về bảng màu chung được sử dụng trong tất cả tính năng của document builder
+ * @returns Mảng các tùy chọn màu được định sẵn với giá trị hex và label
+ */
+export declare function getPresetColors(): FontColorConfig['colors'];
+/**
+ * Trả về cấu hình bộ chọn màu với định dạng hex
+ * @returns Đối tượng cấu hình bộ chọn màu
+ */
+export declare function getColorPickerConfig(): ColorPickerConfig;
+/**
+ * Trả về cấu hình kích thước font cho document builder
+ * @returns Mảng các tùy chọn kích thước font được định sẵn
+ */
+export declare function getFontSizeOptions(): FontSizeConfig['options'];
+export declare function getHeadingOptions(): HeadingConfig['options'];

package/components/document-builder/src/document-builder.model.d.ts

@@ -0,0 +1,41 @@
+import { EditorConfig, EventInfo, ModelDocumentSelection, ViewDataTransfer } from 'ckeditor5';
+import { I18nParams } from '@sdcorejs/angular/i18n';
+import { CkCommentConfig } from './plugins/ck-comment/ck-comment.plugin.model';
+/** Plain translator cho CKEditor plugin — tránh truyền thẳng I18nService (private fields mất `this` qua config). */
+export interface DocumentBuilderI18n {
+    t(key: string, params?: I18nParams): string;
+}
+export type DocumentBuilderOption = EditorConfig & {
+    getOption?: () => SdDocumentBuilderOption;
+    _i18n?: DocumentBuilderI18n;
+};
+export interface SdDocumentBuilderOption {
+    onDropVariable?: (variable: SdDocumentBuilderVariable) => boolean | Promise<boolean | SdDocumentBuilderVariable>;
+    onAfterDropVariable?: (variable: SdDocumentBuilderVariable) => void;
+    onPasteVariable?: (display: string) => SdDocumentBuilderVariable | null | Promise<SdDocumentBuilderVariable | null>;
+    comment?: CkCommentConfig;
+    onSelection?: (selection: ModelDocumentSelection, $event: EventInfo<string, unknown>) => void;
+    onOrientation?: (orientation: 'PORTRAIT' | 'LANDSCAPE') => void;
+    onPaste?: (data: SdPasteEventData) => void | Promise<void>;
+    orientation?: 'PORTRAIT' | 'LANDSCAPE';
+}
+export interface SdDocumentBuilderVariable<T = any> {
+    id: string;
+    uuid?: string;
+    value: string;
+    display: string;
+    bindingValue?: string;
+    data?: T;
+}
+export interface SdDocumentBuilderHeading {
+    id: string;
+    text: string;
+    level: number;
+    type: string;
+}
+export interface SdPasteEventData {
+    html?: string;
+    text: string;
+    source: 'word' | 'excel' | 'google-docs' | 'web' | 'unknown';
+    dataTransfer: ViewDataTransfer;
+}

package/components/document-builder/src/document-builder.utils.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Document Builder Utilities
+ * Các hàm tiện ích cho document builder
+ */
+/**
+ * Chuẩn hóa nội dung bằng cách chuyển đổi tất cả màu HSL và RGB sang hex
+ * @param content - Nội dung HTML cần chuẩn hóa
+ * @returns Nội dung đã được chuẩn hóa với màu hex
+ */
+export declare function normalize(content: string): string;

package/components/document-builder/src/plugins/block-space/block-space.plugin.d.ts

@@ -0,0 +1,9 @@
+import { Plugin } from 'ckeditor5';
+/**
+ * Plugin để thêm margin-bottom: 4px cho các block elements
+ * (paragraph, heading, list, table) thông qua downcast conversion
+ */
+export declare class BlockSpace extends Plugin {
+    static get pluginName(): string;
+    init(): void;
+}

package/components/document-builder/src/plugins/ck-comment/ck-comment.plugin.d.ts

@@ -0,0 +1,44 @@
+import { Plugin, ContextualBalloon } from 'ckeditor5';
+import { CkComment, CkCommentConfig, CkCommentColors } from './ck-comment.plugin.model';
+export declare class CkCommentPlugin extends Plugin {
+    #private;
+    static get pluginName(): string;
+    static get requires(): (typeof ContextualBalloon)[];
+    static readonly PENDING_MARKER_ID = "__pending_comment__";
+    static readonly DEFAULT_SEARCH_RANGE = 5;
+    static readonly DEFAULT_MAX_TEXT_LENGTH = 1000;
+    static readonly DEFAULT_COLORS: CkCommentColors;
+    init(): void;
+    /**
+     * Thiết lập config với callbacks
+     */
+    setConfig(config: CkCommentConfig): void;
+    /**
+     * Thêm comment và tạo marker
+     */
+    addComment(comment: CkComment): boolean;
+    /**
+     * Xóa comment theo id
+     */
+    removeComment(id: string | number): boolean;
+    /**
+     * Chọn comment theo id - chỉ thêm class highlight, không bôi đen text
+     */
+    selectComment(id: string | number, scrollIntoView?: boolean): void;
+    /**
+     * Thiết lập tất cả comments (khôi phục từ dữ liệu)
+     */
+    setComments(comments: CkComment[]): void;
+    /**
+     * Lấy tất cả comments
+     */
+    get comments(): CkComment[];
+    /**
+     * Thiết lập pending highlight cho selection (khi user đang nhập nội dung comment)
+     */
+    setPendingSelection(startPath: number[], endPath: number[]): boolean;
+    /**
+     * Xóa pending highlight và fire onCancelPending callback
+     */
+    clearPendingSelection(): void;
+}

package/components/document-builder/src/plugins/ck-comment/ck-comment.plugin.model.d.ts

@@ -0,0 +1,57 @@
+import { ModelRange } from 'ckeditor5';
+/**
+ * Comment status based on text changes
+ */
+export type CkCommentStatus = 'normal' | 'modified' | 'broken';
+/**
+ * Color configuration for comment markers
+ */
+export interface CkCommentColors {
+    marker?: string;
+    markerSelected?: string;
+    markerPending?: string;
+    markerModified?: string;
+    markerBroken?: string;
+}
+/**
+ * Comment data structure for CkCommentPlugin
+ */
+export interface CkComment<T = any> {
+    id: string | number;
+    startPath: number[];
+    endPath: number[];
+    originalText: string;
+    currentText: string;
+    status: CkCommentStatus;
+    data?: T;
+}
+/**
+ * Config for CkCommentPlugin
+ */
+export interface CkCommentConfig {
+    onPendingComment?: (comment: CkComment) => void;
+    onAddComment?: (comment: CkComment) => void;
+    onSelectComment?: (id: string | number) => void;
+    onRemoveComment?: (id: string | number) => void;
+    onChange?: (comments: CkComment[]) => void;
+    onCancelPending?: () => void;
+    onError?: (error: {
+        code: string;
+        message: string;
+        data?: any;
+    }) => void;
+    searchRange?: number;
+    debug?: boolean;
+    colors?: CkCommentColors;
+    maxTextLength?: number;
+    allowCreating?: boolean;
+}
+/**
+ * Data returned when user selects text for comment
+ */
+export interface CkCommentSelection {
+    range: ModelRange;
+    startPath: number[];
+    endPath: number[];
+    text: string;
+}

package/components/document-builder/src/plugins/heading/heading.plugin.d.ts

@@ -0,0 +1,5 @@
+import { Plugin } from 'ckeditor5';
+export declare class HeadingPlugin extends Plugin {
+    static get pluginName(): string;
+    init(): void;
+}

package/components/document-builder/src/plugins/highlight-range/highlight-range.plugin.d.ts

@@ -0,0 +1,4 @@
+import { Plugin } from 'ckeditor5';
+export declare class HighlightRangePlugin extends Plugin {
+    init(): void;
+}