@sd-angular/core 19.0.9 → 19.0.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (104) hide show
  1. package/README.md +1 -1
  2. package/assets/scss/core/utilities/_grid.scss +149 -143
  3. package/components/form-generic/src/components/form-builder/components/attribute-table/attribute-table.component.d.ts +2 -4
  4. package/components/form-generic/src/components/form-builder/components/attribute-template/attribute-template.component.d.ts +2 -4
  5. package/components/form-generic/src/components/form-builder/components/configure-validation/configure-validation.component.d.ts +5 -6
  6. package/components/form-generic/src/components/form-render/form-render.component.d.ts +4 -6
  7. package/components/form-generic/src/services/form-generic.service.d.ts +1 -3
  8. package/components/modal/src/modal.component.d.ts +1 -1
  9. package/components/tab-router/src/models/tab-router.model.d.ts +2 -1
  10. package/components/tab-router/src/services/tab-router.service.d.ts +0 -1
  11. package/components/table/src/components/command/desktop-command.component.d.ts +7 -7
  12. package/components/table/src/components/command/pipes/command.pipe.d.ts +1 -12
  13. package/components/table/src/components/command/pipes/filter.pipe.d.ts +1 -8
  14. package/components/table/src/components/filter/column-filter/column-filter.component.d.ts +1 -0
  15. package/components/table/src/models/table-column.model.d.ts +3 -2
  16. package/components/table/src/pipes/selection-disabled.pipe.d.ts +1 -1
  17. package/components/table/src/services/config.service.d.ts +4 -5
  18. package/fesm2022/sd-angular-core-components-anchor.mjs +14 -14
  19. package/fesm2022/sd-angular-core-components-anchor.mjs.map +1 -1
  20. package/fesm2022/sd-angular-core-components-autoid-inspector.mjs.map +1 -1
  21. package/fesm2022/sd-angular-core-components-avatar.mjs.map +1 -1
  22. package/fesm2022/sd-angular-core-components-badge.mjs.map +1 -1
  23. package/fesm2022/sd-angular-core-components-button.mjs.map +1 -1
  24. package/fesm2022/sd-angular-core-components-ckeditor-styles.mjs.map +1 -1
  25. package/fesm2022/sd-angular-core-components-code-editor.mjs.map +1 -1
  26. package/fesm2022/sd-angular-core-components-document-builder.mjs +0 -1
  27. package/fesm2022/sd-angular-core-components-document-builder.mjs.map +1 -1
  28. package/fesm2022/sd-angular-core-components-form-generic.mjs +37 -66
  29. package/fesm2022/sd-angular-core-components-form-generic.mjs.map +1 -1
  30. package/fesm2022/sd-angular-core-components-import-excel.mjs.map +1 -1
  31. package/fesm2022/sd-angular-core-components-inform.mjs.map +1 -1
  32. package/fesm2022/sd-angular-core-components-mini-editor.mjs.map +1 -1
  33. package/fesm2022/sd-angular-core-components-modal-resizable.mjs.map +1 -1
  34. package/fesm2022/sd-angular-core-components-modal.mjs.map +1 -1
  35. package/fesm2022/sd-angular-core-components-operator.mjs.map +1 -1
  36. package/fesm2022/sd-angular-core-components-org-chart.mjs.map +1 -1
  37. package/fesm2022/sd-angular-core-components-query-builder.mjs.map +1 -1
  38. package/fesm2022/sd-angular-core-components-quick-action.mjs.map +1 -1
  39. package/fesm2022/sd-angular-core-components-section.mjs.map +1 -1
  40. package/fesm2022/sd-angular-core-components-side-drawer.mjs.map +1 -1
  41. package/fesm2022/sd-angular-core-components-splitter.mjs.map +1 -1
  42. package/fesm2022/sd-angular-core-components-stepper.mjs.map +1 -1
  43. package/fesm2022/sd-angular-core-components-tab-router.mjs +31 -26
  44. package/fesm2022/sd-angular-core-components-tab-router.mjs.map +1 -1
  45. package/fesm2022/sd-angular-core-components-tab.mjs.map +1 -1
  46. package/fesm2022/sd-angular-core-components-table.mjs +47 -58
  47. package/fesm2022/sd-angular-core-components-table.mjs.map +1 -1
  48. package/fesm2022/sd-angular-core-components-tree.mjs.map +1 -1
  49. package/fesm2022/sd-angular-core-components-upload-file.mjs.map +1 -1
  50. package/fesm2022/sd-angular-core-directives.mjs +0 -1
  51. package/fesm2022/sd-angular-core-directives.mjs.map +1 -1
  52. package/fesm2022/sd-angular-core-forms-autocomplete.mjs.map +1 -1
  53. package/fesm2022/sd-angular-core-forms-chip-calendar.mjs.map +1 -1
  54. package/fesm2022/sd-angular-core-forms-chip.mjs.map +1 -1
  55. package/fesm2022/sd-angular-core-forms-date-range.mjs.map +1 -1
  56. package/fesm2022/sd-angular-core-forms-date.mjs.map +1 -1
  57. package/fesm2022/sd-angular-core-forms-datetime.mjs.map +1 -1
  58. package/fesm2022/sd-angular-core-forms-input-color.mjs.map +1 -1
  59. package/fesm2022/sd-angular-core-forms-input-number.mjs.map +1 -1
  60. package/fesm2022/sd-angular-core-forms-input.mjs.map +1 -1
  61. package/fesm2022/sd-angular-core-forms-radio.mjs.map +1 -1
  62. package/fesm2022/sd-angular-core-forms-select.mjs +45 -12
  63. package/fesm2022/sd-angular-core-forms-select.mjs.map +1 -1
  64. package/fesm2022/sd-angular-core-forms-textarea.mjs.map +1 -1
  65. package/fesm2022/sd-angular-core-interceptors.mjs +0 -2
  66. package/fesm2022/sd-angular-core-interceptors.mjs.map +1 -1
  67. package/fesm2022/sd-angular-core-modules-auth.mjs +14 -38
  68. package/fesm2022/sd-angular-core-modules-auth.mjs.map +1 -1
  69. package/fesm2022/sd-angular-core-modules-layout.mjs +5 -12
  70. package/fesm2022/sd-angular-core-modules-layout.mjs.map +1 -1
  71. package/fesm2022/sd-angular-core-modules-permission.mjs +5 -12
  72. package/fesm2022/sd-angular-core-modules-permission.mjs.map +1 -1
  73. package/fesm2022/sd-angular-core-pipes.mjs +4 -12
  74. package/fesm2022/sd-angular-core-pipes.mjs.map +1 -1
  75. package/fesm2022/sd-angular-core-services-confirm.mjs +16 -21
  76. package/fesm2022/sd-angular-core-services-confirm.mjs.map +1 -1
  77. package/fesm2022/sd-angular-core-services-docx.mjs +1 -8
  78. package/fesm2022/sd-angular-core-services-docx.mjs.map +1 -1
  79. package/fesm2022/sd-angular-core-services-license.mjs +5 -12
  80. package/fesm2022/sd-angular-core-services-license.mjs.map +1 -1
  81. package/fesm2022/sd-angular-core-services-notify.mjs +70 -87
  82. package/fesm2022/sd-angular-core-services-notify.mjs.map +1 -1
  83. package/fesm2022/sd-angular-core-services-storage.mjs +4 -12
  84. package/fesm2022/sd-angular-core-services-storage.mjs.map +1 -1
  85. package/fesm2022/sd-angular-core-utilities-extensions.mjs +43 -1
  86. package/fesm2022/sd-angular-core-utilities-extensions.mjs.map +1 -1
  87. package/forms/select/src/select-footer-action.directive.d.ts +5 -1
  88. package/forms/select/src/select.component.d.ts +4 -0
  89. package/modules/auth/guards/auth.guard.d.ts +2 -4
  90. package/modules/auth/guards/portal.guard.d.ts +2 -4
  91. package/modules/auth/services/auth.service.d.ts +3 -4
  92. package/modules/layout/modules/home/guards/home-redirect.guard.d.ts +3 -5
  93. package/modules/permission/src/guards/permission.guard.d.ts +2 -5
  94. package/package.json +66 -66
  95. package/pipes/src/format-number.pipe.d.ts +1 -3
  96. package/sd-angular-core-19.0.10.tgz +0 -0
  97. package/services/confirm/src/lib/components/dialog-confirm/dialog-confirm.component.d.ts +3 -3
  98. package/services/license/src/license.service.d.ts +2 -3
  99. package/services/notify/src/components/toast/toast.component.d.ts +9 -13
  100. package/services/notify/src/notify.service.d.ts +4 -5
  101. package/services/storage/src/storage.service.d.ts +3 -4
  102. package/utilities/extensions/index.d.ts +1 -0
  103. package/utilities/extensions/src/object.extension.d.ts +8 -0
  104. package/sd-angular-core-19.0.9.tgz +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"sd-angular-core-components-badge.mjs","sources":["../../../projects/sd-angular/components/badge/src/badge.component.ts","../../../projects/sd-angular/components/badge/src/badge.component.html","../../../projects/sd-angular/components/badge/sd-angular-core-components-badge.ts"],"sourcesContent":["/* eslint-disable @angular-eslint/no-input-rename */\r\nimport { CommonModule } from '@angular/common';\r\nimport { ChangeDetectionStrategy, Component, EventEmitter, Output, booleanAttribute, computed, input } from '@angular/core';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { Color, Size } from '@sdcorejs/utils/models';\r\nimport { MaterialIconFontSet, DefaultMaterialIconFontSet } from '@sd-angular/core/utilities/models';\r\n\r\n// Export các Type để dùng chung\r\nexport type SdBadgeType = 'tag' | 'round' | 'icon';\r\n\r\n@Component({\r\n selector: 'sd-badge',\r\n templateUrl: './badge.component.html',\r\n styleUrls: ['./badge.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n imports: [CommonModule, MatIconModule, MatTooltipModule],\r\n})\r\nexport class SdBadge {\r\n defaultIcon = 'fiber_manual_record';\r\n\r\n // ==========================================\r\n // 1. SIGNAL INPUTS\r\n // ==========================================\r\n type = input<SdBadgeType, SdBadgeType | undefined | null>('icon', {\r\n transform: value => value || 'icon',\r\n });\r\n\r\n color = input<Color, Color | undefined | null>('secondary', {\r\n transform: value => value || 'secondary',\r\n });\r\n\r\n primary = input(false, { transform: booleanAttribute });\r\n secondary = input(false, { transform: booleanAttribute });\r\n success = input(false, { transform: booleanAttribute });\r\n info = input(false, { transform: booleanAttribute });\r\n warning = input(false, { transform: booleanAttribute });\r\n error = input(false, { transform: booleanAttribute });\r\n\r\n fontSet = input<MaterialIconFontSet, MaterialIconFontSet | undefined | null>('material-icons', {\r\n transform: value => value || 'material-icons',\r\n });\r\n\r\n title = input<string | number | undefined | null>();\r\n description = input<string | undefined | null>();\r\n tooltip = input<string | undefined | null>();\r\n icon = input<string | undefined | null>();\r\n\r\n size = input<Size, Size | undefined | null>('sm', {\r\n transform: value => value || 'sm',\r\n });\r\n\r\n // ==========================================\r\n // 2. OUTPUT\r\n // ==========================================\r\n @Output() click = new EventEmitter<Event>();\r\n\r\n onClick = (event: Event) => {\r\n event.stopPropagation();\r\n this.click.emit(event);\r\n };\r\n\r\n // ==========================================\r\n // 3. COMPUTED STATE\r\n // ==========================================\r\n\r\n effectiveColor = computed(() => {\r\n if (this.primary()) return 'primary';\r\n if (this.secondary()) return 'secondary';\r\n if (this.success()) return 'success';\r\n if (this.info()) return 'info';\r\n if (this.warning()) return 'warning';\r\n if (this.error()) return 'error';\r\n return this.color();\r\n });\r\n\r\n baseColorClasses = computed(() => {\r\n const c = this.effectiveColor();\r\n return {\r\n 'c-primary': c === 'primary',\r\n 'c-secondary': c === 'secondary',\r\n 'c-info': c === 'info',\r\n 'c-success': c === 'success',\r\n 'c-warning': c === 'warning',\r\n 'c-error': c === 'error',\r\n };\r\n });\r\n\r\n iconColorClasses = computed(() => {\r\n const c = this.effectiveColor();\r\n return {\r\n 'c-primary': c === 'primary',\r\n 'c-black400': c === 'secondary',\r\n 'c-info': c === 'info',\r\n 'c-success': c === 'success',\r\n 'c-warning': c === 'warning',\r\n 'c-error': c === 'error',\r\n };\r\n });\r\n\r\n iconSizeAndFontClasses = computed(() => {\r\n const s = this.size();\r\n const f = this.fontSet();\r\n return {\r\n 'c-sm': s === 'sm',\r\n 'c-md': s === 'md',\r\n 'c-lg': s === 'lg',\r\n 'material-icons': f === 'material-icons',\r\n 'material-icons-outlined': f === 'material-icons-outlined',\r\n 'material-icons-round': f === 'material-icons-round',\r\n 'material-icons-sharp': f === 'material-icons-sharp',\r\n };\r\n });\r\n\r\n // why: size modifier cho container .c-badge (round + tag). Tách prefix c-badge--<size>\r\n // để không đụng class .c-sm/.c-md/.c-lg đang dùng trên icon span.\r\n containerSizeClasses = computed(() => {\r\n const s = this.size();\r\n return {\r\n 'c-badge--sm': s === 'sm',\r\n 'c-badge--md': s === 'md',\r\n 'c-badge--lg': s === 'lg',\r\n };\r\n });\r\n\r\n // GỘP CLASS CHO BADGE TYPE = 'TAG' (cũng dùng lại cho 'ROUND' khi có icon)\r\n tagIconCombinedClasses = computed(() => ({\r\n ...this.iconSizeAndFontClasses(),\r\n ...this.baseColorClasses(),\r\n }));\r\n\r\n // GỘP CLASS CHO CONTAINER round/tag (color tint + size modifier)\r\n containerCombinedClasses = computed(() => ({\r\n ...this.baseColorClasses(),\r\n ...this.containerSizeClasses(),\r\n }));\r\n\r\n // GỘP CLASS CHO BADGE TYPE = 'ICON'\r\n iconCombinedClasses = computed(() => ({\r\n ...this.iconSizeAndFontClasses(),\r\n ...this.iconColorClasses(),\r\n }));\r\n}\r\n","@let _type = type();\r\n@let _tooltip = tooltip();\r\n@let _title = title();\r\n@let _description = description();\r\n@let iconName = icon() || defaultIcon;\r\n@let isPointer = click.observed;\r\n\r\n@if (_type === 'round') {\r\n <div\r\n class=\"c-badge\"\r\n matTooltipPosition=\"above\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipClass=\"sd-multiline-tooltip\"\r\n [ngClass]=\"containerCombinedClasses()\"\r\n [class.c-badge--has-icon]=\"!!icon()\"\r\n [class.pointer]=\"isPointer\"\r\n (click)=\"onClick($event)\"\r\n aria-hidden=\"true\">\r\n @if (icon()) {\r\n <span class=\"c-material-icon\" [ngClass]=\"tagIconCombinedClasses()\">\r\n {{ iconName }}\r\n </span>\r\n }\r\n <span class=\"c-badge-title\">{{ _title }}</span>\r\n </div>\r\n} @else if (_type === 'tag') {\r\n <div\r\n class=\"c-badge c-badge--tag\"\r\n matTooltipPosition=\"above\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipClass=\"sd-multiline-tooltip\"\r\n [ngClass]=\"containerCombinedClasses()\"\r\n [class.pointer]=\"isPointer\"\r\n (click)=\"onClick($event)\"\r\n aria-hidden=\"true\">\r\n <div class=\"c-icon d-flex align-items-center\">\r\n @if (icon()) {\r\n <span class=\"c-material-icon mr-4\" [ngClass]=\"tagIconCombinedClasses()\">\r\n {{ iconName }}\r\n </span>\r\n }\r\n <div class=\"d-flex flex-column align-items-start\">\r\n <span class=\"T14R c-badge-title\">{{ _title }}</span>\r\n @if (_description) {\r\n <span class=\"T12R c-badge-description\">{{ _description }}</span>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n} @else {\r\n <div\r\n class=\"d-flex\"\r\n matTooltipPosition=\"above\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipClass=\"sd-multiline-tooltip\"\r\n [class.c-badge-icon]=\"_type === 'icon'\"\r\n [class.pointer]=\"isPointer\"\r\n (click)=\"onClick($event)\"\r\n aria-hidden=\"true\">\r\n <div class=\"c-icon d-flex align-items-center\">\r\n <span class=\"c-material-icon mr-4\" [ngClass]=\"iconCombinedClasses()\">\r\n {{ iconName }}\r\n </span>\r\n <div class=\"d-flex flex-column\">\r\n <span class=\"T14R c-badge-title\">{{ _title }}</span>\r\n @if (_description) {\r\n <span class=\"T10R c-badge-description\">{{ _description }}</span>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"sd-angular-core-components-badge.mjs","sources":["../../../projects/sd-angular/components/badge/src/badge.component.ts","../../../projects/sd-angular/components/badge/src/badge.component.html","../../../projects/sd-angular/components/badge/sd-angular-core-components-badge.ts"],"sourcesContent":["/* eslint-disable @angular-eslint/no-input-rename */\r\nimport { CommonModule } from '@angular/common';\r\nimport { ChangeDetectionStrategy, Component, EventEmitter, Output, booleanAttribute, computed, input } from '@angular/core';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { Color, Size } from '@sdcorejs/utils/models';\r\nimport { MaterialIconFontSet, DefaultMaterialIconFontSet } from '@sd-angular/core/utilities/models';\r\n\r\n// Export các Type để dùng chung\r\nexport type SdBadgeType = 'tag' | 'round' | 'icon';\r\n\r\n@Component({\r\n selector: 'sd-badge',\r\n templateUrl: './badge.component.html',\r\n styleUrl: './badge.component.scss',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n imports: [CommonModule, MatIconModule, MatTooltipModule],\r\n})\r\nexport class SdBadge {\r\n defaultIcon = 'fiber_manual_record';\r\n\r\n // ==========================================\r\n // 1. SIGNAL INPUTS\r\n // ==========================================\r\n type = input<SdBadgeType, SdBadgeType | undefined | null>('icon', {\r\n transform: value => value || 'icon',\r\n });\r\n\r\n color = input<Color, Color | undefined | null>('secondary', {\r\n transform: value => value || 'secondary',\r\n });\r\n\r\n primary = input(false, { transform: booleanAttribute });\r\n secondary = input(false, { transform: booleanAttribute });\r\n success = input(false, { transform: booleanAttribute });\r\n info = input(false, { transform: booleanAttribute });\r\n warning = input(false, { transform: booleanAttribute });\r\n error = input(false, { transform: booleanAttribute });\r\n\r\n fontSet = input<MaterialIconFontSet, MaterialIconFontSet | undefined | null>('material-icons', {\r\n transform: value => value || 'material-icons',\r\n });\r\n\r\n title = input<string | number | undefined | null>();\r\n description = input<string | undefined | null>();\r\n tooltip = input<string | undefined | null>();\r\n icon = input<string | undefined | null>();\r\n\r\n size = input<Size, Size | undefined | null>('sm', {\r\n transform: value => value || 'sm',\r\n });\r\n\r\n // ==========================================\r\n // 2. OUTPUT\r\n // ==========================================\r\n @Output() click = new EventEmitter<Event>();\r\n\r\n onClick = (event: Event) => {\r\n event.stopPropagation();\r\n this.click.emit(event);\r\n };\r\n\r\n // ==========================================\r\n // 3. COMPUTED STATE\r\n // ==========================================\r\n\r\n effectiveColor = computed(() => {\r\n if (this.primary()) return 'primary';\r\n if (this.secondary()) return 'secondary';\r\n if (this.success()) return 'success';\r\n if (this.info()) return 'info';\r\n if (this.warning()) return 'warning';\r\n if (this.error()) return 'error';\r\n return this.color();\r\n });\r\n\r\n baseColorClasses = computed(() => {\r\n const c = this.effectiveColor();\r\n return {\r\n 'c-primary': c === 'primary',\r\n 'c-secondary': c === 'secondary',\r\n 'c-info': c === 'info',\r\n 'c-success': c === 'success',\r\n 'c-warning': c === 'warning',\r\n 'c-error': c === 'error',\r\n };\r\n });\r\n\r\n iconColorClasses = computed(() => {\r\n const c = this.effectiveColor();\r\n return {\r\n 'c-primary': c === 'primary',\r\n 'c-black400': c === 'secondary',\r\n 'c-info': c === 'info',\r\n 'c-success': c === 'success',\r\n 'c-warning': c === 'warning',\r\n 'c-error': c === 'error',\r\n };\r\n });\r\n\r\n iconSizeAndFontClasses = computed(() => {\r\n const s = this.size();\r\n const f = this.fontSet();\r\n return {\r\n 'c-sm': s === 'sm',\r\n 'c-md': s === 'md',\r\n 'c-lg': s === 'lg',\r\n 'material-icons': f === 'material-icons',\r\n 'material-icons-outlined': f === 'material-icons-outlined',\r\n 'material-icons-round': f === 'material-icons-round',\r\n 'material-icons-sharp': f === 'material-icons-sharp',\r\n };\r\n });\r\n\r\n // why: size modifier cho container .c-badge (round + tag). Tách prefix c-badge--<size>\r\n // để không đụng class .c-sm/.c-md/.c-lg đang dùng trên icon span.\r\n containerSizeClasses = computed(() => {\r\n const s = this.size();\r\n return {\r\n 'c-badge--sm': s === 'sm',\r\n 'c-badge--md': s === 'md',\r\n 'c-badge--lg': s === 'lg',\r\n };\r\n });\r\n\r\n // GỘP CLASS CHO BADGE TYPE = 'TAG' (cũng dùng lại cho 'ROUND' khi có icon)\r\n tagIconCombinedClasses = computed(() => ({\r\n ...this.iconSizeAndFontClasses(),\r\n ...this.baseColorClasses(),\r\n }));\r\n\r\n // GỘP CLASS CHO CONTAINER round/tag (color tint + size modifier)\r\n containerCombinedClasses = computed(() => ({\r\n ...this.baseColorClasses(),\r\n ...this.containerSizeClasses(),\r\n }));\r\n\r\n // GỘP CLASS CHO BADGE TYPE = 'ICON'\r\n iconCombinedClasses = computed(() => ({\r\n ...this.iconSizeAndFontClasses(),\r\n ...this.iconColorClasses(),\r\n }));\r\n}\r\n","@let _type = type();\r\n@let _tooltip = tooltip();\r\n@let _title = title();\r\n@let _description = description();\r\n@let iconName = icon() || defaultIcon;\r\n@let isPointer = click.observed;\r\n\r\n@if (_type === 'round') {\r\n <div\r\n class=\"c-badge\"\r\n matTooltipPosition=\"above\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipClass=\"sd-multiline-tooltip\"\r\n [ngClass]=\"containerCombinedClasses()\"\r\n [class.c-badge--has-icon]=\"!!icon()\"\r\n [class.pointer]=\"isPointer\"\r\n (click)=\"onClick($event)\"\r\n aria-hidden=\"true\">\r\n @if (icon()) {\r\n <span class=\"c-material-icon\" [ngClass]=\"tagIconCombinedClasses()\">\r\n {{ iconName }}\r\n </span>\r\n }\r\n <span class=\"c-badge-title\">{{ _title }}</span>\r\n </div>\r\n} @else if (_type === 'tag') {\r\n <div\r\n class=\"c-badge c-badge--tag\"\r\n matTooltipPosition=\"above\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipClass=\"sd-multiline-tooltip\"\r\n [ngClass]=\"containerCombinedClasses()\"\r\n [class.pointer]=\"isPointer\"\r\n (click)=\"onClick($event)\"\r\n aria-hidden=\"true\">\r\n <div class=\"c-icon d-flex align-items-center\">\r\n @if (icon()) {\r\n <span class=\"c-material-icon mr-4\" [ngClass]=\"tagIconCombinedClasses()\">\r\n {{ iconName }}\r\n </span>\r\n }\r\n <div class=\"d-flex flex-column align-items-start\">\r\n <span class=\"T14R c-badge-title\">{{ _title }}</span>\r\n @if (_description) {\r\n <span class=\"T12R c-badge-description\">{{ _description }}</span>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n} @else {\r\n <div\r\n class=\"d-flex\"\r\n matTooltipPosition=\"above\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipClass=\"sd-multiline-tooltip\"\r\n [class.c-badge-icon]=\"_type === 'icon'\"\r\n [class.pointer]=\"isPointer\"\r\n (click)=\"onClick($event)\"\r\n aria-hidden=\"true\">\r\n <div class=\"c-icon d-flex align-items-center\">\r\n <span class=\"c-material-icon mr-4\" [ngClass]=\"iconCombinedClasses()\">\r\n {{ iconName }}\r\n </span>\r\n <div class=\"d-flex flex-column\">\r\n <span class=\"T14R c-badge-title\">{{ _title }}</span>\r\n @if (_description) {\r\n <span class=\"T10R c-badge-description\">{{ _description }}</span>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"sd-angular-core-components-button.mjs","sources":["../../../projects/sd-angular/components/button/src/button.component.ts","../../../projects/sd-angular/components/button/src/button.component.html","../../../projects/sd-angular/components/button/sd-angular-core-components-button.ts"],"sourcesContent":["/* eslint-disable @angular-eslint/no-input-rename */\nimport { CommonModule } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n OnDestroy,\n OnInit,\n booleanAttribute,\n computed,\n inject,\n input,\n output,\n} from '@angular/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { Color } from '@sdcorejs/utils/models';\nimport { DefaultMaterialIconFontSet, MaterialIconFontSet } from '@sd-angular/core/utilities/models';\nimport { Subject, Subscription } from 'rxjs';\nimport { filter, throttleTime } from 'rxjs/operators';\n\n// Export các Type ra ngoài để tái sử dụng ở file config/interface\nexport type SdButtonType = 'fill' | 'light' | 'outline' | 'link';\nexport type SdButtonSize = 'sm' | 'md' | 'lg';\nexport type SdButtonHtmlType = 'button' | 'submit' | 'reset';\n\n@Component({\n selector: 'sd-button',\n templateUrl: './button.component.html',\n styleUrls: ['./button.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n imports: [CommonModule, MatIconModule, MatButtonModule, MatProgressSpinnerModule, MatTooltipModule],\n host: {\n '[class.sd-disabled]': 'disabled()',\n '[class.sd-loading]': 'loading()',\n '[class.sd-block]': 'block()',\n '[attr.disabled]': 'disabled() ? \"true\" : null',\n }\n})\nexport class SdButton implements OnInit, OnDestroy {\n // ==========================================\n // 1. INJECTS\n // ==========================================\n private el = inject(ElementRef);\n\n // ==========================================\n // 2. SIGNAL INPUTS (Bảo mật 100% với Null/Undefined)\n // ==========================================\n autoIdInput = input<string | undefined | null>(undefined, { alias: 'autoId' });\n \n type = input<SdButtonType, SdButtonType | undefined | null>('light', {\n transform: (value) => value || 'light'\n });\n\n color = input<Color, Color | undefined | null>('secondary', {\n transform: (value) => value || 'secondary'\n });\n\n size = input<SdButtonSize, SdButtonSize | undefined | null>('sm', {\n transform: (value) => value || 'sm'\n });\n\n fontSet = input<MaterialIconFontSet, MaterialIconFontSet | undefined | null>(DefaultMaterialIconFontSet, {\n transform: (value) => value || DefaultMaterialIconFontSet\n });\n\n title = input<string | undefined | null>(undefined);\n width = input<string | undefined | null>(undefined);\n tooltip = input<string | undefined | null>(undefined);\n prefixIcon = input<string | undefined | null>(undefined);\n suffixIcon = input<string | undefined | null>(undefined);\n\n disabled = input(false, { transform: booleanAttribute });\n loading = input(false, { transform: booleanAttribute });\n block = input(false, { transform: booleanAttribute });\n\n htmlType = input<SdButtonHtmlType, SdButtonHtmlType | undefined | null>('button', {\n transform: (value) => value || 'button'\n });\n\n // ==========================================\n // 3. COMPUTED STATE\n // ==========================================\n autoId = computed(() => this.autoIdInput() ? `components-button-${this.autoIdInput()}` : undefined);\n \n buttonClasses = computed(() => ({\n 'c-square': (this.prefixIcon() || this.suffixIcon()) && !this.title(),\n 'c-sm': this.size() === 'sm',\n 'c-md': this.size() === 'md',\n 'c-lg': this.size() === 'lg',\n 'c-disabled': this.disabled(),\n 'c-block': this.block(),\n }));\n\n // ==========================================\n // 4. OUTPUT & RXJS STREAMS\n // ==========================================\n click = output<Event>();\n\n #clickSubject = new Subject<Event>();\n #subscription = new Subscription();\n\n constructor() {\n\n // Kỹ thuật Đánh chặn sự kiện (Capture Phase)\n // Tóm sống mọi sự kiện click ngay khi nó vừa chạm vào component\n this.el.nativeElement.addEventListener(\n 'click',\n (event: Event) => {\n if (this.disabled() || this.loading()) {\n // Nghiền nát sự kiện, không cho Angular phát (click) ra component cha\n event.preventDefault();\n event.stopPropagation();\n event.stopImmediatePropagation();\n }\n },\n { capture: true }\n );\n }\n\n ngOnInit() {\n this.#subscription.add(\n this.#clickSubject\n .pipe(\n throttleTime(300, undefined, { leading: true, trailing: false }),\n filter(() => !this.disabled() && !this.loading())\n )\n .subscribe(event => {\n this.click.emit(event);\n })\n );\n }\n\n // Nhận click từ thẻ button con bên trong\n onInternalClick(event: Event) {\n event.stopPropagation();\n \n if (this.disabled() || this.loading()) {\n return;\n }\n\n this.#clickSubject.next(event);\n }\n\n ngOnDestroy() {\n this.#subscription.unsubscribe();\n }\n}","@let _type = type();\r\n@let _loading = loading();\r\n@let _title = title();\r\n@let _prefixIcon = prefixIcon();\r\n@let _suffixIcon = suffixIcon();\r\n@let _fontSet = fontSet();\r\n@let _htmlType = htmlType();\r\n@let _disabled = disabled();\r\n@let _color = color();\r\n@let _autoId = autoId();\r\n@let _width = width();\r\n@let _tooltip = tooltip();\r\n\r\n@if (_type === 'fill') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-fill\"\r\n [type]=\"_htmlType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"_disabled\"\r\n [color]=\"_color\"\r\n [attr.data-autoId]=\"_autoId\"\r\n [attr.data-disabled]=\"_disabled ? 'true' : 'false'\"\r\n [attr.data-loading]=\"_loading ? 'true' : 'false'\"\r\n [style.width]=\"_width\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (_type === 'light') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-light\"\r\n [type]=\"_htmlType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"_disabled\"\r\n [color]=\"_color\"\r\n [attr.data-autoId]=\"_autoId\"\r\n [attr.data-disabled]=\"_disabled ? 'true' : 'false'\"\r\n [attr.data-loading]=\"_loading ? 'true' : 'false'\"\r\n [style.width]=\"_width\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (_type === 'outline') {\r\n <button\r\n mat-stroked-button\r\n class=\"c-button c-outline\"\r\n [type]=\"_htmlType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"_disabled\"\r\n [color]=\"_color\"\r\n [attr.data-autoId]=\"_autoId\"\r\n [attr.data-disabled]=\"_disabled ? 'true' : 'false'\"\r\n [attr.data-loading]=\"_loading ? 'true' : 'false'\"\r\n [style.width]=\"_width\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (_type === 'link') {\r\n <button\r\n mat-button\r\n class=\"c-button c-link\"\r\n [type]=\"_htmlType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"_disabled\"\r\n [color]=\"_color\"\r\n [attr.data-autoId]=\"_autoId\"\r\n [attr.data-disabled]=\"_disabled ? 'true' : 'false'\"\r\n [attr.data-loading]=\"_loading ? 'true' : 'false'\"\r\n [style.width]=\"_width\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n}\r\n\r\n<ng-template #contentTpl>\r\n <div class=\"c-button-content-wrapper\">\r\n @if (_loading) {\r\n <mat-spinner mode=\"indeterminate\" diameter=\"18\" strokeWidth=\"2\" class=\"c-spinner\"></mat-spinner>\r\n } @else if (_prefixIcon) {\r\n <mat-icon [fontSet]=\"_fontSet\" class=\"c-icon-prefix\">{{ _prefixIcon }}</mat-icon>\r\n }\r\n\r\n @if (_title) {\r\n <span class=\"c-title\" [class.ml-8]=\"_loading || _prefixIcon\" [class.mr-8]=\"_suffixIcon && !_loading\">\r\n {{ _title }}\r\n </span>\r\n }\r\n\r\n @if (_suffixIcon && !_loading) {\r\n <mat-icon [fontSet]=\"_fontSet\" class=\"c-icon-suffix\">{{ _suffixIcon }}</mat-icon>\r\n }\r\n\r\n @if (!_title && !_prefixIcon && !_loading && _suffixIcon) {\r\n <mat-icon [fontSet]=\"_fontSet\">{{ _suffixIcon }}</mat-icon>\r\n }\r\n </div>\r\n</ng-template>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"sd-angular-core-components-button.mjs","sources":["../../../projects/sd-angular/components/button/src/button.component.ts","../../../projects/sd-angular/components/button/src/button.component.html","../../../projects/sd-angular/components/button/sd-angular-core-components-button.ts"],"sourcesContent":["/* eslint-disable @angular-eslint/no-input-rename */\nimport { CommonModule } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n OnDestroy,\n OnInit,\n booleanAttribute,\n computed,\n inject,\n input,\n output,\n} from '@angular/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { Color } from '@sdcorejs/utils/models';\nimport { DefaultMaterialIconFontSet, MaterialIconFontSet } from '@sd-angular/core/utilities/models';\nimport { Subject, Subscription } from 'rxjs';\nimport { filter, throttleTime } from 'rxjs/operators';\n\n// Export các Type ra ngoài để tái sử dụng ở file config/interface\nexport type SdButtonType = 'fill' | 'light' | 'outline' | 'link';\nexport type SdButtonSize = 'sm' | 'md' | 'lg';\nexport type SdButtonHtmlType = 'button' | 'submit' | 'reset';\n\n@Component({\n selector: 'sd-button',\n templateUrl: './button.component.html',\n styleUrl: './button.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: true,\n imports: [CommonModule, MatIconModule, MatButtonModule, MatProgressSpinnerModule, MatTooltipModule],\n host: {\n '[class.sd-disabled]': 'disabled()',\n '[class.sd-loading]': 'loading()',\n '[class.sd-block]': 'block()',\n '[attr.disabled]': 'disabled() ? \"true\" : null',\n }\n})\nexport class SdButton implements OnInit, OnDestroy {\n // ==========================================\n // 1. INJECTS\n // ==========================================\n private el = inject(ElementRef);\n\n // ==========================================\n // 2. SIGNAL INPUTS (Bảo mật 100% với Null/Undefined)\n // ==========================================\n autoIdInput = input<string | undefined | null>(undefined, { alias: 'autoId' });\n \n type = input<SdButtonType, SdButtonType | undefined | null>('light', {\n transform: (value) => value || 'light'\n });\n\n color = input<Color, Color | undefined | null>('secondary', {\n transform: (value) => value || 'secondary'\n });\n\n size = input<SdButtonSize, SdButtonSize | undefined | null>('sm', {\n transform: (value) => value || 'sm'\n });\n\n fontSet = input<MaterialIconFontSet, MaterialIconFontSet | undefined | null>(DefaultMaterialIconFontSet, {\n transform: (value) => value || DefaultMaterialIconFontSet\n });\n\n title = input<string | undefined | null>(undefined);\n width = input<string | undefined | null>(undefined);\n tooltip = input<string | undefined | null>(undefined);\n prefixIcon = input<string | undefined | null>(undefined);\n suffixIcon = input<string | undefined | null>(undefined);\n\n disabled = input(false, { transform: booleanAttribute });\n loading = input(false, { transform: booleanAttribute });\n block = input(false, { transform: booleanAttribute });\n\n htmlType = input<SdButtonHtmlType, SdButtonHtmlType | undefined | null>('button', {\n transform: (value) => value || 'button'\n });\n\n // ==========================================\n // 3. COMPUTED STATE\n // ==========================================\n autoId = computed(() => this.autoIdInput() ? `components-button-${this.autoIdInput()}` : undefined);\n \n buttonClasses = computed(() => ({\n 'c-square': (this.prefixIcon() || this.suffixIcon()) && !this.title(),\n 'c-sm': this.size() === 'sm',\n 'c-md': this.size() === 'md',\n 'c-lg': this.size() === 'lg',\n 'c-disabled': this.disabled(),\n 'c-block': this.block(),\n }));\n\n // ==========================================\n // 4. OUTPUT & RXJS STREAMS\n // ==========================================\n click = output<Event>();\n\n #clickSubject = new Subject<Event>();\n #subscription = new Subscription();\n\n constructor() {\n\n // Kỹ thuật Đánh chặn sự kiện (Capture Phase)\n // Tóm sống mọi sự kiện click ngay khi nó vừa chạm vào component\n this.el.nativeElement.addEventListener(\n 'click',\n (event: Event) => {\n if (this.disabled() || this.loading()) {\n // Nghiền nát sự kiện, không cho Angular phát (click) ra component cha\n event.preventDefault();\n event.stopPropagation();\n event.stopImmediatePropagation();\n }\n },\n { capture: true }\n );\n }\n\n ngOnInit() {\n this.#subscription.add(\n this.#clickSubject\n .pipe(\n throttleTime(300, undefined, { leading: true, trailing: false }),\n filter(() => !this.disabled() && !this.loading())\n )\n .subscribe(event => {\n this.click.emit(event);\n })\n );\n }\n\n // Nhận click từ thẻ button con bên trong\n onInternalClick(event: Event) {\n event.stopPropagation();\n \n if (this.disabled() || this.loading()) {\n return;\n }\n\n this.#clickSubject.next(event);\n }\n\n ngOnDestroy() {\n this.#subscription.unsubscribe();\n }\n}","@let _type = type();\r\n@let _loading = loading();\r\n@let _title = title();\r\n@let _prefixIcon = prefixIcon();\r\n@let _suffixIcon = suffixIcon();\r\n@let _fontSet = fontSet();\r\n@let _htmlType = htmlType();\r\n@let _disabled = disabled();\r\n@let _color = color();\r\n@let _autoId = autoId();\r\n@let _width = width();\r\n@let _tooltip = tooltip();\r\n\r\n@if (_type === 'fill') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-fill\"\r\n [type]=\"_htmlType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"_disabled\"\r\n [color]=\"_color\"\r\n [attr.data-autoId]=\"_autoId\"\r\n [attr.data-disabled]=\"_disabled ? 'true' : 'false'\"\r\n [attr.data-loading]=\"_loading ? 'true' : 'false'\"\r\n [style.width]=\"_width\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (_type === 'light') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-light\"\r\n [type]=\"_htmlType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"_disabled\"\r\n [color]=\"_color\"\r\n [attr.data-autoId]=\"_autoId\"\r\n [attr.data-disabled]=\"_disabled ? 'true' : 'false'\"\r\n [attr.data-loading]=\"_loading ? 'true' : 'false'\"\r\n [style.width]=\"_width\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (_type === 'outline') {\r\n <button\r\n mat-stroked-button\r\n class=\"c-button c-outline\"\r\n [type]=\"_htmlType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"_disabled\"\r\n [color]=\"_color\"\r\n [attr.data-autoId]=\"_autoId\"\r\n [attr.data-disabled]=\"_disabled ? 'true' : 'false'\"\r\n [attr.data-loading]=\"_loading ? 'true' : 'false'\"\r\n [style.width]=\"_width\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (_type === 'link') {\r\n <button\r\n mat-button\r\n class=\"c-button c-link\"\r\n [type]=\"_htmlType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"_disabled\"\r\n [color]=\"_color\"\r\n [attr.data-autoId]=\"_autoId\"\r\n [attr.data-disabled]=\"_disabled ? 'true' : 'false'\"\r\n [attr.data-loading]=\"_loading ? 'true' : 'false'\"\r\n [style.width]=\"_width\"\r\n [matTooltip]=\"_tooltip || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n}\r\n\r\n<ng-template #contentTpl>\r\n <div class=\"c-button-content-wrapper\">\r\n @if (_loading) {\r\n <mat-spinner mode=\"indeterminate\" diameter=\"18\" strokeWidth=\"2\" class=\"c-spinner\"></mat-spinner>\r\n } @else if (_prefixIcon) {\r\n <mat-icon [fontSet]=\"_fontSet\" class=\"c-icon-prefix\">{{ _prefixIcon }}</mat-icon>\r\n }\r\n\r\n @if (_title) {\r\n <span class=\"c-title\" [class.ml-8]=\"_loading || _prefixIcon\" [class.mr-8]=\"_suffixIcon && !_loading\">\r\n {{ _title }}\r\n </span>\r\n }\r\n\r\n @if (_suffixIcon && !_loading) {\r\n <mat-icon [fontSet]=\"_fontSet\" class=\"c-icon-suffix\">{{ _suffixIcon }}</mat-icon>\r\n }\r\n\r\n @if (!_title && !_prefixIcon && !_loading && _suffixIcon) {\r\n <mat-icon [fontSet]=\"_fontSet\">{{ _suffixIcon }}</mat-icon>\r\n }\r\n </div>\r\n</ng-template>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"sd-angular-core-components-ckeditor-styles.mjs","sources":["../../../projects/sd-angular/components/ckeditor-styles/src/ckeditor-styles.component.ts","../../../projects/sd-angular/components/ckeditor-styles/sd-angular-core-components-ckeditor-styles.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';\r\n\r\n/**\r\n * Styles-only component that loads the global CKEditor 5 stylesheet on demand.\r\n *\r\n * Why this exists:\r\n * - CKEditor's CSS must be global (applies to body-rendered overlays, dialogs, balloons),\r\n * which means whichever Angular component declares it must use ViewEncapsulation.None.\r\n * - Switching encapsulation on the main editor components (`<sd-editor>`, `<sd-mini-editor>`,\r\n * `<sd-document-builder>`) would un-scope all their local styles too.\r\n * - Instead, this tiny no-render component owns the global CSS. The editor components embed\r\n * `<sd-ckeditor-styles>` at the top of their template; the CSS is injected once into <head>\r\n * the first time any editor instance mounts. Editor components themselves keep\r\n * ViewEncapsulation.Emulated.\r\n *\r\n * Behavior:\r\n * - Renders nothing in the DOM (empty template).\r\n * - Angular dedupes styles per component class — multiple instances inject the <style> tag\r\n * only once.\r\n * - When the host editor component is lazy-loaded, this component's chunk and its CSS travel\r\n * with it.\r\n */\r\n@Component({\r\n selector: 'sd-ckeditor-styles',\r\n standalone: true,\r\n template: '',\r\n styleUrls: ['../../../assets/scss/ckeditor5.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SdCKEditorStyles {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAEA;;;;;;;;;;;;;;;;;;;AAmBG;MASU,gBAAgB,CAAA;wGAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,gBAAgB,8EALjB,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,6khJAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;4FAKD,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAR5B,SAAS;+BACE,oBAAoB,EAAA,UAAA,EAClB,IAAI,EAAA,QAAA,EACN,EAAE,EAAA,aAAA,EAEG,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,6khJAAA,CAAA,EAAA;;;AC5BjD;;AAEG;;;;"}
1
+ {"version":3,"file":"sd-angular-core-components-ckeditor-styles.mjs","sources":["../../../projects/sd-angular/components/ckeditor-styles/src/ckeditor-styles.component.ts","../../../projects/sd-angular/components/ckeditor-styles/sd-angular-core-components-ckeditor-styles.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';\r\n\r\n/**\r\n * Styles-only component that loads the global CKEditor 5 stylesheet on demand.\r\n *\r\n * Why this exists:\r\n * - CKEditor's CSS must be global (applies to body-rendered overlays, dialogs, balloons),\r\n * which means whichever Angular component declares it must use ViewEncapsulation.None.\r\n * - Switching encapsulation on the main editor components (`<sd-editor>`, `<sd-mini-editor>`,\r\n * `<sd-document-builder>`) would un-scope all their local styles too.\r\n * - Instead, this tiny no-render component owns the global CSS. The editor components embed\r\n * `<sd-ckeditor-styles>` at the top of their template; the CSS is injected once into <head>\r\n * the first time any editor instance mounts. Editor components themselves keep\r\n * ViewEncapsulation.Emulated.\r\n *\r\n * Behavior:\r\n * - Renders nothing in the DOM (empty template).\r\n * - Angular dedupes styles per component class — multiple instances inject the <style> tag\r\n * only once.\r\n * - When the host editor component is lazy-loaded, this component's chunk and its CSS travel\r\n * with it.\r\n */\r\n@Component({\r\n selector: 'sd-ckeditor-styles',\r\n standalone: true,\r\n template: '',\r\n styleUrl: '../../../assets/scss/ckeditor5.scss',\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SdCKEditorStyles {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAEA;;;;;;;;;;;;;;;;;;;AAmBG;MASU,gBAAgB,CAAA;wGAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,gBAAgB,8EALjB,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,6khJAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;4FAKD,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAR5B,SAAS;+BACE,oBAAoB,EAAA,UAAA,EAClB,IAAI,EAAA,QAAA,EACN,EAAE,EAAA,aAAA,EAEG,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,6khJAAA,CAAA,EAAA;;;AC5BjD;;AAEG;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"sd-angular-core-components-code-editor.mjs","sources":["../../../projects/sd-angular/components/code-editor/src/code-editor.component.ts","../../../projects/sd-angular/components/code-editor/src/code-editor.component.html","../../../projects/sd-angular/components/code-editor/sd-angular-core-components-code-editor.ts"],"sourcesContent":["import { Clipboard } from '@angular/cdk/clipboard';\r\nimport { CommonModule } from '@angular/common';\r\nimport {\r\n ChangeDetectionStrategy,\r\n Component,\r\n computed,\r\n effect,\r\n inject,\r\n input,\r\n model,\r\n signal,\r\n untracked,\r\n ViewEncapsulation,\r\n booleanAttribute\r\n} from '@angular/core';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { DomSanitizer, SafeHtml } from '@angular/platform-browser';\r\n\r\nimport * as Prism from 'prismjs';\r\nimport 'prismjs/components/prism-typescript';\r\nimport 'prismjs/components/prism-json';\r\nimport 'prismjs/components/prism-css';\r\nimport 'prismjs/components/prism-scss';\r\nimport { TranslatePipe } from '@sd-angular/core/i18n';\r\nimport 'prismjs/components/prism-markup'; // HTML\r\n\r\nexport type CodeLanguage = 'html' | 'typescript' | 'json' | 'css' | 'scss';\r\n\r\n@Component({\r\n selector: 'sd-code-editor',\r\n standalone: true,\r\n imports: [CommonModule, MatIconModule, MatTooltipModule, TranslatePipe],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n templateUrl: './code-editor.component.html',\r\n styleUrls: ['./code-editor.component.scss'],\r\n encapsulation: ViewEncapsulation.None, // Bắt buộc để nhận màu Prism\r\n})\r\nexport class SdCodeEditor {\r\n #clipboard = inject(Clipboard);\r\n #sanitizer = inject(DomSanitizer);\r\n\r\n // ==========================================\r\n // 1. SIGNAL INPUTS & MODEL\r\n // ==========================================\r\n // Nhận bất kỳ kiểu dữ liệu nào (string, array, object)\r\n valueModel = model<any>(undefined, { alias: 'model' });\r\n \r\n language = input<CodeLanguage>('typescript');\r\n maxHeight = input<string>('500px');\r\n \r\n // Trạng thái Viewed (true = Read Only, false = Editable)\r\n viewed = input(false, { transform: booleanAttribute });\r\n\r\n // ==========================================\r\n // 2. INTERNAL STATE\r\n // ==========================================\r\n copied = signal<boolean>(false);\r\n \r\n // Chuỗi text nội bộ dùng để map với thẻ <textarea>\r\n textValue = signal<string>('');\r\n \r\n prismLang = computed(() => this.language() === 'html' ? 'markup' : this.language());\r\n\r\n // Cờ lưu vết để chống Loop (Vòng lặp vô tận khi bắn 2 chiều)\r\n private _lastEmittedValue: any = undefined;\r\n\r\n constructor() {\r\n // ==========================================\r\n // EFFECT 1: Dữ liệu từ CHA truyền vào (Model -> TextValue)\r\n // ==========================================\r\n effect(() => {\r\n const extVal = this.valueModel();\r\n const lang = this.language();\r\n \r\n untracked(() => {\r\n // Nếu giá trị này do chính component bắn ra, bỏ qua để tránh loop\r\n if (extVal === this._lastEmittedValue) return;\r\n\r\n if (typeof extVal === 'string') {\r\n this.textValue.set(extVal);\r\n } else if (extVal !== undefined && extVal !== null) {\r\n // Tự động format Object -> String nếu là JSON\r\n if (lang === 'json') {\r\n try {\r\n this.textValue.set(JSON.stringify(extVal, null, 2));\r\n } catch {\r\n this.textValue.set('// Lỗi: Object có tham chiếu vòng (Circular Reference)');\r\n }\r\n } else {\r\n this.textValue.set(String(extVal));\r\n }\r\n } else {\r\n this.textValue.set('');\r\n }\r\n });\r\n });\r\n }\r\n\r\n // ==========================================\r\n // EFFECT 2: PrismJS render (TextValue -> HTML MÀU)\r\n // ==========================================\r\n highlightedCode = computed<SafeHtml>(() => {\r\n // Dùng khoảng trắng để giữ độ cao cho thẻ pre nếu rỗng\r\n const rawCode = this.textValue() || ' '; \r\n const langKey = this.prismLang();\r\n const grammar = Prism.languages[langKey] || Prism.languages['markup'];\r\n \r\n // Cộng thêm \\n ở cuối để chống lỗi con trỏ textarea ăn lẹm dòng cuối\r\n const highlightedString = Prism.highlight(rawCode, grammar, langKey) + '\\n';\r\n return this.#sanitizer.bypassSecurityTrustHtml(highlightedString);\r\n });\r\n\r\n // ==========================================\r\n // EVENTS\r\n // ==========================================\r\n \r\n // Khi người dùng gõ vào Textarea (TextValue -> Model)\r\n onTextChange(newText: string) {\r\n this.textValue.set(newText);\r\n \r\n let valToEmit: any = newText;\r\n \r\n // Nếu ngôn ngữ là JSON, cố gắng trả về Object thật\r\n if (this.language() === 'json') {\r\n try {\r\n valToEmit = JSON.parse(newText);\r\n } catch {\r\n // Nếu gõ dở ngoặc/sai cú pháp -> Trả về chuỗi String tạm\r\n valToEmit = newText; \r\n }\r\n }\r\n \r\n // Ghi sổ và bắn ra ngoài\r\n this._lastEmittedValue = valToEmit;\r\n this.valueModel.set(valToEmit);\r\n }\r\n\r\n copyToClipboard() {\r\n const rawCode = this.textValue();\r\n if (!rawCode) return;\r\n \r\n if (this.#clipboard.copy(rawCode)) {\r\n this.copied.set(true);\r\n setTimeout(() => this.copied.set(false), 2000);\r\n }\r\n }\r\n}","<div class=\"sd-code-wrapper\" [class.is-editable]=\"!viewed()\">\r\n \r\n <div class=\"sd-code-header\">\r\n <div class=\"mac-dots\">\r\n <span class=\"dot red\"></span>\r\n <span class=\"dot yellow\"></span>\r\n <span class=\"dot green\"></span>\r\n </div>\r\n \r\n <div class=\"lang-badge\">\r\n {{ language().toUpperCase() }} \r\n <span style=\"opacity: 0.6; margin-left: 4px; font-weight: normal;\">\r\n {{ viewed() ? '(READ ONLY)' : '(EDITING)' }}\r\n </span>\r\n </div>\r\n \r\n <button class=\"copy-btn\" [matTooltip]=\"copied() ? ('core.component.code-editor.copied' | translate) : 'Copy code'\" (click)=\"copyToClipboard()\">\r\n <mat-icon [class.text-success]=\"copied()\">{{ copied() ? 'check' : 'content_copy' }}</mat-icon>\r\n <span>{{ copied() ? 'Copied' : 'Copy' }}</span>\r\n </button>\r\n </div>\r\n\r\n <div class=\"sd-code-content\" [style.maxHeight]=\"maxHeight()\">\r\n <div class=\"editor-overlay-container\">\r\n \r\n @if (!viewed()) {\r\n <textarea\r\n class=\"code-textarea\"\r\n [value]=\"textValue()\"\r\n (input)=\"onTextChange($any($event.target).value)\"\r\n spellcheck=\"false\"\r\n autocomplete=\"off\"\r\n autocorrect=\"off\"\r\n autocapitalize=\"off\">\r\n </textarea>\r\n }\r\n \r\n <pre aria-hidden=\"true\" class=\"code-display\"><code [class]=\"'language-' + prismLang()\" [innerHTML]=\"highlightedCode()\"></code></pre>\r\n \r\n </div>\r\n </div>\r\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"sd-angular-core-components-code-editor.mjs","sources":["../../../projects/sd-angular/components/code-editor/src/code-editor.component.ts","../../../projects/sd-angular/components/code-editor/src/code-editor.component.html","../../../projects/sd-angular/components/code-editor/sd-angular-core-components-code-editor.ts"],"sourcesContent":["import { Clipboard } from '@angular/cdk/clipboard';\r\nimport { CommonModule } from '@angular/common';\r\nimport {\r\n ChangeDetectionStrategy,\r\n Component,\r\n computed,\r\n effect,\r\n inject,\r\n input,\r\n model,\r\n signal,\r\n untracked,\r\n ViewEncapsulation,\r\n booleanAttribute\r\n} from '@angular/core';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { DomSanitizer, SafeHtml } from '@angular/platform-browser';\r\n\r\nimport * as Prism from 'prismjs';\r\nimport 'prismjs/components/prism-typescript';\r\nimport 'prismjs/components/prism-json';\r\nimport 'prismjs/components/prism-css';\r\nimport 'prismjs/components/prism-scss';\r\nimport { TranslatePipe } from '@sd-angular/core/i18n';\r\nimport 'prismjs/components/prism-markup'; // HTML\r\n\r\nexport type CodeLanguage = 'html' | 'typescript' | 'json' | 'css' | 'scss';\r\n\r\n@Component({\r\n selector: 'sd-code-editor',\r\n standalone: true,\r\n imports: [CommonModule, MatIconModule, MatTooltipModule, TranslatePipe],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n templateUrl: './code-editor.component.html',\r\n styleUrl: './code-editor.component.scss',\r\n encapsulation: ViewEncapsulation.None, // Bắt buộc để nhận màu Prism\r\n})\r\nexport class SdCodeEditor {\r\n #clipboard = inject(Clipboard);\r\n #sanitizer = inject(DomSanitizer);\r\n\r\n // ==========================================\r\n // 1. SIGNAL INPUTS & MODEL\r\n // ==========================================\r\n // Nhận bất kỳ kiểu dữ liệu nào (string, array, object)\r\n valueModel = model<any>(undefined, { alias: 'model' });\r\n \r\n language = input<CodeLanguage>('typescript');\r\n maxHeight = input<string>('500px');\r\n \r\n // Trạng thái Viewed (true = Read Only, false = Editable)\r\n viewed = input(false, { transform: booleanAttribute });\r\n\r\n // ==========================================\r\n // 2. INTERNAL STATE\r\n // ==========================================\r\n copied = signal<boolean>(false);\r\n \r\n // Chuỗi text nội bộ dùng để map với thẻ <textarea>\r\n textValue = signal<string>('');\r\n \r\n prismLang = computed(() => this.language() === 'html' ? 'markup' : this.language());\r\n\r\n // Cờ lưu vết để chống Loop (Vòng lặp vô tận khi bắn 2 chiều)\r\n private _lastEmittedValue: any = undefined;\r\n\r\n constructor() {\r\n // ==========================================\r\n // EFFECT 1: Dữ liệu từ CHA truyền vào (Model -> TextValue)\r\n // ==========================================\r\n effect(() => {\r\n const extVal = this.valueModel();\r\n const lang = this.language();\r\n \r\n untracked(() => {\r\n // Nếu giá trị này do chính component bắn ra, bỏ qua để tránh loop\r\n if (extVal === this._lastEmittedValue) return;\r\n\r\n if (typeof extVal === 'string') {\r\n this.textValue.set(extVal);\r\n } else if (extVal !== undefined && extVal !== null) {\r\n // Tự động format Object -> String nếu là JSON\r\n if (lang === 'json') {\r\n try {\r\n this.textValue.set(JSON.stringify(extVal, null, 2));\r\n } catch {\r\n this.textValue.set('// Lỗi: Object có tham chiếu vòng (Circular Reference)');\r\n }\r\n } else {\r\n this.textValue.set(String(extVal));\r\n }\r\n } else {\r\n this.textValue.set('');\r\n }\r\n });\r\n });\r\n }\r\n\r\n // ==========================================\r\n // EFFECT 2: PrismJS render (TextValue -> HTML MÀU)\r\n // ==========================================\r\n highlightedCode = computed<SafeHtml>(() => {\r\n // Dùng khoảng trắng để giữ độ cao cho thẻ pre nếu rỗng\r\n const rawCode = this.textValue() || ' '; \r\n const langKey = this.prismLang();\r\n const grammar = Prism.languages[langKey] || Prism.languages['markup'];\r\n \r\n // Cộng thêm \\n ở cuối để chống lỗi con trỏ textarea ăn lẹm dòng cuối\r\n const highlightedString = Prism.highlight(rawCode, grammar, langKey) + '\\n';\r\n return this.#sanitizer.bypassSecurityTrustHtml(highlightedString);\r\n });\r\n\r\n // ==========================================\r\n // EVENTS\r\n // ==========================================\r\n \r\n // Khi người dùng gõ vào Textarea (TextValue -> Model)\r\n onTextChange(newText: string) {\r\n this.textValue.set(newText);\r\n \r\n let valToEmit: any = newText;\r\n \r\n // Nếu ngôn ngữ là JSON, cố gắng trả về Object thật\r\n if (this.language() === 'json') {\r\n try {\r\n valToEmit = JSON.parse(newText);\r\n } catch {\r\n // Nếu gõ dở ngoặc/sai cú pháp -> Trả về chuỗi String tạm\r\n valToEmit = newText; \r\n }\r\n }\r\n \r\n // Ghi sổ và bắn ra ngoài\r\n this._lastEmittedValue = valToEmit;\r\n this.valueModel.set(valToEmit);\r\n }\r\n\r\n copyToClipboard() {\r\n const rawCode = this.textValue();\r\n if (!rawCode) return;\r\n \r\n if (this.#clipboard.copy(rawCode)) {\r\n this.copied.set(true);\r\n setTimeout(() => this.copied.set(false), 2000);\r\n }\r\n }\r\n}","<div class=\"sd-code-wrapper\" [class.is-editable]=\"!viewed()\">\r\n \r\n <div class=\"sd-code-header\">\r\n <div class=\"mac-dots\">\r\n <span class=\"dot red\"></span>\r\n <span class=\"dot yellow\"></span>\r\n <span class=\"dot green\"></span>\r\n </div>\r\n \r\n <div class=\"lang-badge\">\r\n {{ language().toUpperCase() }} \r\n <span style=\"opacity: 0.6; margin-left: 4px; font-weight: normal;\">\r\n {{ viewed() ? '(READ ONLY)' : '(EDITING)' }}\r\n </span>\r\n </div>\r\n \r\n <button class=\"copy-btn\" [matTooltip]=\"copied() ? ('core.component.code-editor.copied' | translate) : 'Copy code'\" (click)=\"copyToClipboard()\">\r\n <mat-icon [class.text-success]=\"copied()\">{{ copied() ? 'check' : 'content_copy' }}</mat-icon>\r\n <span>{{ copied() ? 'Copied' : 'Copy' }}</span>\r\n </button>\r\n </div>\r\n\r\n <div class=\"sd-code-content\" [style.maxHeight]=\"maxHeight()\">\r\n <div class=\"editor-overlay-container\">\r\n \r\n @if (!viewed()) {\r\n <textarea\r\n class=\"code-textarea\"\r\n [value]=\"textValue()\"\r\n (input)=\"onTextChange($any($event.target).value)\"\r\n spellcheck=\"false\"\r\n autocomplete=\"off\"\r\n autocorrect=\"off\"\r\n autocapitalize=\"off\">\r\n </textarea>\r\n }\r\n \r\n <pre aria-hidden=\"true\" class=\"code-display\"><code [class]=\"'language-' + prismLang()\" [innerHTML]=\"highlightedCode()\"></code></pre>\r\n \r\n </div>\r\n </div>\r\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;MAsCa,YAAY,CAAA;AACvB,IAAA,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC;AAC9B,IAAA,UAAU,GAAG,MAAM,CAAC,YAAY,CAAC;;;;;IAMjC,UAAU,GAAG,KAAK,CAAM,SAAS,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC;AAEtD,IAAA,QAAQ,GAAG,KAAK,CAAe,YAAY,CAAC;AAC5C,IAAA,SAAS,GAAG,KAAK,CAAS,OAAO,CAAC;;IAGlC,MAAM,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;;;;AAKtD,IAAA,MAAM,GAAG,MAAM,CAAU,KAAK,CAAC;;AAG/B,IAAA,SAAS,GAAG,MAAM,CAAS,EAAE,CAAC;IAE9B,SAAS,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,QAAQ,EAAE,KAAK,MAAM,GAAG,QAAQ,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;;IAG3E,iBAAiB,GAAQ,SAAS;AAE1C,IAAA,WAAA,GAAA;;;;QAIE,MAAM,CAAC,MAAK;AACV,YAAA,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,EAAE;AAChC,YAAA,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,EAAE;YAE5B,SAAS,CAAC,MAAK;;AAEb,gBAAA,IAAI,MAAM,KAAK,IAAI,CAAC,iBAAiB;oBAAE;AAEvC,gBAAA,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE;AAC9B,oBAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC;gBAC5B;qBAAO,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,IAAI,EAAE;;AAElD,oBAAA,IAAI,IAAI,KAAK,MAAM,EAAE;AACnB,wBAAA,IAAI;AACF,4BAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;wBACrD;AAAE,wBAAA,MAAM;AACN,4BAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,wDAAwD,CAAC;wBAC9E;oBACF;yBAAO;wBACL,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;oBACpC;gBACF;qBAAO;AACL,oBAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC;gBACxB;AACF,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC,CAAC;IACJ;;;;AAKA,IAAA,eAAe,GAAG,QAAQ,CAAW,MAAK;;QAExC,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG;AACvC,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,EAAE;AAChC,QAAA,MAAM,OAAO,GAAG,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC;;AAGrE,QAAA,MAAM,iBAAiB,GAAG,KAAK,CAAC,SAAS,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,CAAC,GAAG,IAAI;QAC3E,OAAO,IAAI,CAAC,UAAU,CAAC,uBAAuB,CAAC,iBAAiB,CAAC;AACnE,IAAA,CAAC,CAAC;;;;;AAOF,IAAA,YAAY,CAAC,OAAe,EAAA;AAC1B,QAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,OAAO,CAAC;QAE3B,IAAI,SAAS,GAAQ,OAAO;;AAG5B,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,KAAK,MAAM,EAAE;AAC9B,YAAA,IAAI;AACF,gBAAA,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC;YACjC;AAAE,YAAA,MAAM;;gBAEN,SAAS,GAAG,OAAO;YACrB;QACF;;AAGA,QAAA,IAAI,CAAC,iBAAiB,GAAG,SAAS;AAClC,QAAA,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,SAAS,CAAC;IAChC;IAEA,eAAe,GAAA;AACb,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,EAAE;AAChC,QAAA,IAAI,CAAC,OAAO;YAAE;QAEd,IAAI,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE;AACjC,YAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;AACrB,YAAA,UAAU,CAAC,MAAM,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;QAChD;IACF;wGA5GW,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAZ,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,UAAA,EAAA,aAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECtCzB,mjDAyCM,EAAA,MAAA,EAAA,CAAA,8wHAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDTM,YAAY,8BAAE,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,gBAAgB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,oBAAA,EAAA,4BAAA,EAAA,oBAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,yBAAA,EAAA,YAAA,EAAA,iBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAE,aAAa,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;4FAM3D,YAAY,EAAA,UAAA,EAAA,CAAA;kBATxB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,gBAAgB,cACd,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,EAAE,aAAa,EAAE,gBAAgB,EAAE,aAAa,CAAC,mBACtD,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAGhC,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,mjDAAA,EAAA,MAAA,EAAA,CAAA,8wHAAA,CAAA,EAAA;;;AEpCvC;;AAEG;;;;"}
@@ -1092,7 +1092,6 @@ class TableCustom extends Plugin {
1092
1092
  view: 'data-column-widths',
1093
1093
  model: 'tableColumnWidth'
1094
1094
  });
1095
- console.log('[TableCustom] Registered data-column-widths upcast converter');
1096
1095
  // Xử lý border-style: none cho tableCell - phải explicit set 'none'
1097
1096
  dispatcher.on('element:td', (evt, data) => {
1098
1097
  if (!data.modelRange || !data.viewItem)