@sd-angular/core 19.0.36 → 19.0.39

package/fesm2022/sd-angular-core-components-timeline.mjs

@@ -0,0 +1,49 @@
+import * as i0 from '@angular/core';
+import { Pipe, Injectable, input, Component } from '@angular/core';
+import { SdBadge } from '@sd-angular/core/components/badge';
+import { DateUtilities } from '@sd-angular/core/utilities';
+import { EMPTY_STR } from '@sdcorejs/utils/constants';
+import { TranslatePipe } from '@sd-angular/core/i18n';
+
+class ViewDateTimePipe {
+    transform(value) {
+        if (!value || !DateUtilities.isDate(value)) {
+            return EMPTY_STR;
+        }
+        return DateUtilities.toFormat(value, 'HH:mm dd/MM/yyyy');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: ViewDateTimePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.21", ngImport: i0, type: ViewDateTimePipe, isStandalone: true, name: "viewDateTime" });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: ViewDateTimePipe, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: ViewDateTimePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'viewDateTime',
+                    standalone: true,
+                }]
+        }, {
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class SdTimeline {
+    items = input.required({
+        transform: value => value ?? [],
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: SdTimeline, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: SdTimeline, isStandalone: true, selector: "sd-timeline", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"sd-timeline\">\n  <div class=\"timeline-container\">\n    <div class=\"timeline-line\"></div>\n    @for (item of items(); track $index) {\n      <div class=\"timeline-item\">\n        <div class=\"dot\"></div>\n        <div class=\"card\">\n          <div class=\"header\">\n            <div class=\"title-wrapper\">\n              <span class=\"title\">{{ item.title }}</span>\n              <span class=\"status\">\n                @if (item.status) {\n                  <sd-badge\n                    [icon]=\"item.status.icon\"\n                    [title]=\"item.status.title\"\n                    [color]=\"item.status.color\"></sd-badge>\n                }\n              </span>\n            </div>\n            <span class=\"date\">{{ item.date | viewDateTime }}</span>\n          </div>\n          <div class=\"meta\">\n            @if (item.actor) {\n              <span>{{ 'core.component.timeline.by' | translate }} <strong>&#64;{{ item.actor }}</strong></span>\n            }\n            @if (item.source) {\n              <span> &#183; {{ item.source }}</span>\n            }\n          </div>\n          <div class=\"description\">\n            {{ item.description }}\n          </div>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: [".sd-timeline{padding:16px}.timeline-container{position:relative;padding-left:20px;font-size:14px;line-height:20px;min-width:470px;max-width:100%}.timeline-line{position:absolute;left:8px;top:0;bottom:0;width:2px;background-color:#94b0ff}.timeline-item{position:relative;margin-bottom:16px;padding-left:10px}.timeline-item .dot{position:absolute;left:-16px;top:12px;width:12px;height:12px;background-color:#94b0ff;border-radius:50%}.timeline-item .card{background:#fff;border-radius:6px;box-shadow:0 2px 4px #0000001a;padding:8px 8px 8px 16px}.timeline-item .card .header{display:flex;justify-content:space-between;align-items:center}.timeline-item .card .header .title-wrapper{display:flex;align-items:flex-start;padding-right:8px}.timeline-item .card .header .title{margin-right:8px;color:#757575}.timeline-item .card .header .status{display:flex;align-items:center}.timeline-item .card .header .status mat-icon{margin-right:4px}.timeline-item .card .header .date{color:#757575;font-size:12px;line-height:16px}.timeline-item .card .meta{color:#757575;margin-top:4px}.timeline-item .card .meta strong{color:#000}.timeline-item .card .description{margin-top:4px;color:#000;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "component", type: SdBadge, selector: "sd-badge", inputs: ["type", "color", "primary", "secondary", "success", "info", "warning", "error", "fontSet", "title", "description", "tooltip", "icon", "size"], outputs: ["click"] }, { kind: "pipe", type: ViewDateTimePipe, name: "viewDateTime" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: SdTimeline, decorators: [{
+            type: Component,
+            args: [{ selector: 'sd-timeline', imports: [SdBadge, ViewDateTimePipe, TranslatePipe], template: "<div class=\"sd-timeline\">\n  <div class=\"timeline-container\">\n    <div class=\"timeline-line\"></div>\n    @for (item of items(); track $index) {\n      <div class=\"timeline-item\">\n        <div class=\"dot\"></div>\n        <div class=\"card\">\n          <div class=\"header\">\n            <div class=\"title-wrapper\">\n              <span class=\"title\">{{ item.title }}</span>\n              <span class=\"status\">\n                @if (item.status) {\n                  <sd-badge\n                    [icon]=\"item.status.icon\"\n                    [title]=\"item.status.title\"\n                    [color]=\"item.status.color\"></sd-badge>\n                }\n              </span>\n            </div>\n            <span class=\"date\">{{ item.date | viewDateTime }}</span>\n          </div>\n          <div class=\"meta\">\n            @if (item.actor) {\n              <span>{{ 'core.component.timeline.by' | translate }} <strong>&#64;{{ item.actor }}</strong></span>\n            }\n            @if (item.source) {\n              <span> &#183; {{ item.source }}</span>\n            }\n          </div>\n          <div class=\"description\">\n            {{ item.description }}\n          </div>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: [".sd-timeline{padding:16px}.timeline-container{position:relative;padding-left:20px;font-size:14px;line-height:20px;min-width:470px;max-width:100%}.timeline-line{position:absolute;left:8px;top:0;bottom:0;width:2px;background-color:#94b0ff}.timeline-item{position:relative;margin-bottom:16px;padding-left:10px}.timeline-item .dot{position:absolute;left:-16px;top:12px;width:12px;height:12px;background-color:#94b0ff;border-radius:50%}.timeline-item .card{background:#fff;border-radius:6px;box-shadow:0 2px 4px #0000001a;padding:8px 8px 8px 16px}.timeline-item .card .header{display:flex;justify-content:space-between;align-items:center}.timeline-item .card .header .title-wrapper{display:flex;align-items:flex-start;padding-right:8px}.timeline-item .card .header .title{margin-right:8px;color:#757575}.timeline-item .card .header .status{display:flex;align-items:center}.timeline-item .card .header .status mat-icon{margin-right:4px}.timeline-item .card .header .date{color:#757575;font-size:12px;line-height:16px}.timeline-item .card .meta{color:#757575;margin-top:4px}.timeline-item .card .meta strong{color:#000}.timeline-item .card .description{margin-top:4px;color:#000;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}\n"] }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SdTimeline };
+//# sourceMappingURL=sd-angular-core-components-timeline.mjs.map

package/fesm2022/sd-angular-core-components-timeline.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-angular-core-components-timeline.mjs","sources":["../../../projects/sd-angular/components/timeline/pipes/view-date.pipe.ts","../../../projects/sd-angular/components/timeline/src/timeline.component.ts","../../../projects/sd-angular/components/timeline/src/timeline.component.html","../../../projects/sd-angular/components/timeline/sd-angular-core-components-timeline.ts"],"sourcesContent":["import { Injectable, Pipe, PipeTransform } from '@angular/core';\nimport { DateUtilities } from '@sd-angular/core/utilities';\nimport { EMPTY_STR } from '@sdcorejs/utils/constants';\n\n@Pipe({\n  name: 'viewDateTime',\n  standalone: true,\n})\n@Injectable({\n  providedIn: 'root',\n})\nexport class ViewDateTimePipe implements PipeTransform {\n  transform(value: any): string {\n    if (!value || !DateUtilities.isDate(value)) {\n      return EMPTY_STR;\n    }\n    return DateUtilities.toFormat(value, 'HH:mm dd/MM/yyyy');\n  }\n}\n","import { Component, input } from '@angular/core';\nimport { SdBadge } from '@sd-angular/core/components/badge';\nimport { SdTimelineItem } from '../models/timeline.model';\nimport { ViewDateTimePipe } from '../pipes/view-date.pipe';\nimport { TranslatePipe } from '@sd-angular/core/i18n';\n\n@Component({\n  selector: 'sd-timeline',\n  imports: [SdBadge, ViewDateTimePipe, TranslatePipe],\n  templateUrl: './timeline.component.html',\n  styleUrl: './timeline.component.scss',\n})\nexport class SdTimeline {\n  readonly items = input.required<SdTimelineItem[], SdTimelineItem[] | null | undefined>({\n    transform: value => value ?? [],\n  });\n}\n","<div class=\"sd-timeline\">\n  <div class=\"timeline-container\">\n    <div class=\"timeline-line\"></div>\n    @for (item of items(); track $index) {\n      <div class=\"timeline-item\">\n        <div class=\"dot\"></div>\n        <div class=\"card\">\n          <div class=\"header\">\n            <div class=\"title-wrapper\">\n              <span class=\"title\">{{ item.title }}</span>\n              <span class=\"status\">\n                @if (item.status) {\n                  <sd-badge\n                    [icon]=\"item.status.icon\"\n                    [title]=\"item.status.title\"\n                    [color]=\"item.status.color\"></sd-badge>\n                }\n              </span>\n            </div>\n            <span class=\"date\">{{ item.date | viewDateTime }}</span>\n          </div>\n          <div class=\"meta\">\n            @if (item.actor) {\n              <span>{{ 'core.component.timeline.by' | translate }} <strong>&#64;{{ item.actor }}</strong></span>\n            }\n            @if (item.source) {\n              <span> &#183; {{ item.source }}</span>\n            }\n          </div>\n          <div class=\"description\">\n            {{ item.description }}\n          </div>\n        </div>\n      </div>\n    }\n  </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;MAWa,gBAAgB,CAAA;AAC3B,IAAA,SAAS,CAAC,KAAU,EAAA;QAClB,IAAI,CAAC,KAAK,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE;AAC1C,YAAA,OAAO,SAAS;QAClB;QACA,OAAO,aAAa,CAAC,QAAQ,CAAC,KAAK,EAAE,kBAAkB,CAAC;IAC1D;wGANW,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;sGAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,cAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,cAFf,MAAM,EAAA,CAAA;;4FAEP,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAP5B,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,cAAc;AACpB,oBAAA,UAAU,EAAE,IAAI;AACjB,iBAAA;;kBACA,UAAU;AAAC,YAAA,IAAA,EAAA,CAAA;AACV,oBAAA,UAAU,EAAE,MAAM;AACnB,iBAAA;;;MCEY,UAAU,CAAA;AACZ,IAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAwD;AACrF,QAAA,SAAS,EAAE,KAAK,IAAI,KAAK,IAAI,EAAE;AAChC,KAAA,CAAC;wGAHS,UAAU,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAV,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,UAAU,0MCZvB,2vCAqCA,EAAA,MAAA,EAAA,CAAA,owCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,ED7BY,OAAO,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,SAAA,EAAA,MAAA,EAAA,SAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,aAAA,EAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA,EAAA,OAAA,EAAA,CAAA,OAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAE,gBAAgB,gDAAE,aAAa,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,CAAA;;4FAIvC,UAAU,EAAA,UAAA,EAAA,CAAA;kBANtB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,WACd,CAAC,OAAO,EAAE,gBAAgB,EAAE,aAAa,CAAC,EAAA,QAAA,EAAA,2vCAAA,EAAA,MAAA,EAAA,CAAA,owCAAA,CAAA,EAAA;;;AERrD;;AAEG;;;;"}

package/fesm2022/sd-angular-core-components.mjs

@@ -26,6 +26,7 @@ export * from '@sd-angular/core/components/splitter';
 export * from '@sd-angular/core/components/preview';
 export * from '@sd-angular/core/components/autoid-inspector';
 export * from '@sd-angular/core/components/data-state';
+export * from '@sd-angular/core/components/timeline';
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/sd-angular-core-components.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"sd-angular-core-components.mjs","sources":["../../../projects/sd-angular/components/sd-angular-core-components.ts"],"sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEG"}
+{"version":3,"file":"sd-angular-core-components.mjs","sources":["../../../projects/sd-angular/components/sd-angular-core-components.ts"],"sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEG"}

package/fesm2022/sd-angular-core-configurations.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"sd-angular-core-configurations.mjs","sources":["../../../projects/sd-angular/configurations/src/sd-core.configuration.ts","../../../projects/sd-angular/configurations/sd-angular-core-configurations.ts"],"sourcesContent":["import { InjectionToken } from \"@angular/core\";\nimport type { Language } from \"@sd-angular/core/models\";\n\nexport interface ISdCoreConfiguration {\n  // License Key được cấp theo domain/sub domain, ví dụ: domain.com, sub.domain.com\n  // Domain localhost, 127.0.0.1 không cần key\n  // Các domain DEV/QC/UAT/PROD ... cần key tương ứng cho từng domain\n  licenseKey?: string | string[];\n  format?: {\n    number?: '1,234,567.89' | '1.234.567,89'; // Default: '1,234,567.89'\n  };\n  // Ngôn ngữ mặc định cho các message của Core UI.\n  // - Language enum ('vi' | 'en' | 'ja' | 'ko' | 'zh') — dùng catalog built-in.\n  // - Function () => Record<string, string> — custom catalog do portal tự định nghĩa.\n  // Có thể bị override bởi localStorage (chỉ Language enum). Default: 'vi'.\n  language?: Language | (() => Record<string, string>);\n}\n\nexport const SD_CORE_CONFIGURATION = new InjectionToken<ISdCoreConfiguration>('sd-core.configuration');\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;MAkBa,qBAAqB,GAAG,IAAI,cAAc,CAAuB,uBAAuB;;AClBrG;;AAEG;;;;"}
+{"version":3,"file":"sd-angular-core-configurations.mjs","sources":["../../../projects/sd-angular/configurations/src/sd-core.configuration.ts","../../../projects/sd-angular/configurations/sd-angular-core-configurations.ts"],"sourcesContent":["import { InjectionToken } from \"@angular/core\";\nimport type { Language } from \"@sd-angular/core/models\";\n\nexport interface ISdCoreConfiguration {\n  format?: {\n    number?: '1,234,567.89' | '1.234.567,89'; // Default: '1,234,567.89'\n  };\n  // Ngôn ngữ mặc định cho các message của Core UI.\n  // - Language enum ('vi' | 'en' | 'ja' | 'ko' | 'zh') — dùng catalog built-in.\n  // - Function () => Record<string, string> — custom catalog do portal tự định nghĩa.\n  // Có thể bị override bởi localStorage (chỉ Language enum). Default: 'vi'.\n  language?: Language | (() => Record<string, string>);\n}\n\nexport const SD_CORE_CONFIGURATION = new InjectionToken<ISdCoreConfiguration>('sd-core.configuration');\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;MAca,qBAAqB,GAAG,IAAI,cAAc,CAAuB,uBAAuB;;ACdrG;;AAEG;;;;"}

package/fesm2022/sd-angular-core-i18n.mjs

@@ -327,8 +327,8 @@ const EN_MESSAGES = {
     // ---- Component: code-editor ----
     'core.component.code-editor.copied': 'Copied!',
     'core.component.code-editor.copy': 'Copy code',
-    // ---- Component: history ----
-    'core.component.history.by': 'By',
+    // ---- Component: timeline ----
+    'core.component.timeline.by': 'By',
     // ---- Component: import-excel ----
     'core.component.import-excel.choose-hint': 'Choose an .xlsx template file with up to {limit} rows.',
     'core.component.import-excel.choose-file': 'Choose Excel file',
@@ -860,8 +860,8 @@ const JA_MESSAGES = {
     // ---- Component: code-editor ----
     'core.component.code-editor.copied': 'コピーしました！',
     'core.component.code-editor.copy': 'コードをコピー',
-    // ---- Component: history ----
-    'core.component.history.by': '実行者',
+    // ---- Component: timeline ----
+    'core.component.timeline.by': '実行者',
     // ---- Component: import-excel ----
     'core.component.import-excel.choose-hint': 'テンプレートに沿った .xlsx ファイルを選択してください（最大 {limit} 行）。',
     'core.component.import-excel.choose-file': 'Excel ファイルを選択',
@@ -1393,8 +1393,8 @@ const KO_MESSAGES = {
     // ---- Component: code-editor ----
     'core.component.code-editor.copied': '복사되었습니다!',
     'core.component.code-editor.copy': '코드 복사',
-    // ---- Component: history ----
-    'core.component.history.by': '작성자',
+    // ---- Component: timeline ----
+    'core.component.timeline.by': '작성자',
     // ---- Component: import-excel ----
     'core.component.import-excel.choose-hint': '양식에 맞는 .xlsx 파일을 선택하세요. 최대 {limit}행까지 가능합니다.',
     'core.component.import-excel.choose-file': 'Excel 파일 선택',
@@ -1926,8 +1926,8 @@ const VI_MESSAGES = {
     // ---- Component: code-editor ----
     'core.component.code-editor.copied': 'Đã copy!',
     'core.component.code-editor.copy': 'Copy code',
-    // ---- Component: history ----
-    'core.component.history.by': 'Bởi',
+    // ---- Component: timeline ----
+    'core.component.timeline.by': 'Bởi',
     // ---- Component: import-excel ----
     'core.component.import-excel.choose-hint': 'Chọn tệp .xlsx theo mẫu, tối đa {limit} dòng.',
     'core.component.import-excel.choose-file': 'Chọn tệp Excel',
@@ -2459,8 +2459,8 @@ const ZH_MESSAGES = {
     // ---- Component: code-editor ----
     'core.component.code-editor.copied': '已复制！',
     'core.component.code-editor.copy': '复制代码',
-    // ---- Component: history ----
-    'core.component.history.by': '操作人',
+    // ---- Component: timeline ----
+    'core.component.timeline.by': '操作人',
     // ---- Component: import-excel ----
     'core.component.import-excel.choose-hint': '请选择符合模板的 .xlsx 文件，最多 {limit} 行。',
     'core.component.import-excel.choose-file': '选择 Excel 文件',