@sd-angular/core 19.0.34 → 19.0.35
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.
- package/components/upload-file/src/upload-file.component.d.ts +1 -2
- package/fesm2022/sd-angular-core-components-data-state.mjs +2 -2
- package/fesm2022/sd-angular-core-components-data-state.mjs.map +1 -1
- package/fesm2022/sd-angular-core-components-form-generic.mjs +2 -2
- package/fesm2022/sd-angular-core-components-form-generic.mjs.map +1 -1
- package/fesm2022/sd-angular-core-components-upload-file.mjs +2 -3
- package/fesm2022/sd-angular-core-components-upload-file.mjs.map +1 -1
- package/package.json +5 -5
|
@@ -28,7 +28,6 @@ export declare class SdUploadFile<TArgs = any> {
|
|
|
28
28
|
readonly label: import("@angular/core").InputSignal<string | undefined>;
|
|
29
29
|
readonly key: import("@angular/core").InputSignal<string | undefined>;
|
|
30
30
|
readonly description: import("@angular/core").InputSignal<string | undefined>;
|
|
31
|
-
readonly appearance: import("@angular/core").InputSignal<"dropzone" | "compact">;
|
|
32
31
|
readonly previewWidth: import("@angular/core").InputSignal<string>;
|
|
33
32
|
readonly previewHeight: import("@angular/core").InputSignal<string>;
|
|
34
33
|
readonly align: import("@angular/core").InputSignal<"left" | "center">;
|
|
@@ -90,5 +89,5 @@ export declare class SdUploadFile<TArgs = any> {
|
|
|
90
89
|
onDownload: (previewFile: PreviewFile) => void;
|
|
91
90
|
isLastVisibleOverlay(fileIndex: number): boolean;
|
|
92
91
|
static ɵfac: i0.ɵɵFactoryDeclaration<SdUploadFile<any>, never>;
|
|
93
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SdUploadFile<any>, "sd-upload-file", never, { "autoIdInput": { "alias": "autoId"; "required": false; "isSignal": true; }; "args": { "alias": "args"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "key": { "alias": "key"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "
|
|
92
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SdUploadFile<any>, "sd-upload-file", never, { "autoIdInput": { "alias": "autoId"; "required": false; "isSignal": true; }; "args": { "alias": "args"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "key": { "alias": "key"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "previewWidth": { "alias": "previewWidth"; "required": false; "isSignal": true; }; "previewHeight": { "alias": "previewHeight"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "uploadInput": { "alias": "upload"; "required": false; "isSignal": true; }; "details": { "alias": "details"; "required": false; "isSignal": true; }; "downloadInput": { "alias": "download"; "required": false; "isSignal": true; }; "imageValidator": { "alias": "imageValidator"; "required": false; "isSignal": true; }; "maxSize": { "alias": "maxSize"; "required": false; "isSignal": true; }; "maxWidth": { "alias": "maxWidth"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "scaleToPixel": { "alias": "scaleToPixel"; "required": false; "isSignal": true; }; "form": { "alias": "form"; "required": false; "isSignal": true; }; "nameInput": { "alias": "name"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "helperText": { "alias": "helperText"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "maxOfImage": { "alias": "maxOfImage"; "required": false; "isSignal": true; }; "extensions": { "alias": "extensions"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "model": { "alias": "model"; "required": false; "isSignal": true; }; }, { "loaded": "loaded"; "filesChanged": "filesChanged"; "model": "modelChange"; }, ["sdLabelDef"], never, true, never>;
|
|
94
93
|
}
|
|
@@ -57,11 +57,11 @@ class SdDataState {
|
|
|
57
57
|
action: this.action,
|
|
58
58
|
}));
|
|
59
59
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: SdDataState, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
60
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: SdDataState, isStandalone: true, selector: "sd-data-state", inputs: { state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, fontSet: { classPropertyName: "fontSet", publicName: "fontSet", isSignal: true, isRequired: false, transformFunction: null }, retryable: { classPropertyName: "retryable", publicName: "retryable", isSignal: true, isRequired: false, transformFunction: null }, retryLabel: { classPropertyName: "retryLabel", publicName: "retryLabel", isSignal: true, isRequired: false, transformFunction: null }, actionLabel: { classPropertyName: "actionLabel", publicName: "actionLabel", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, fullPage: { classPropertyName: "fullPage", publicName: "fullPage", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sdRetry: "sdRetry", sdAction: "sdAction" }, queries: [{ propertyName: "customTemplate", first: true, predicate: SdDataStateTemplateDirective, descendants: true, isSignal: true }], ngImport: i0, template: "@let currentState = state();\n@let template = customTemplate();\n@let _role = role();\n@let _retryable = retryable();\n@let _actionLabel = actionLabel();\n@let currentIcon = effectiveIcon();\n\n@if (currentState === 'success') {\n @if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n } @else {\n <ng-content></ng-content>\n }\n} @else if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n} @else {\n <section\n class=\"sd-data-state\"\n [class.sd-data-state--compact]=\"compact()\"\n [class.sd-data-state--full-page]=\"fullPage()\"\n [class.sd-data-state--with-icon]=\"!!currentIcon\"\n [attr.data-state]=\"currentState\"\n [attr.role]=\"_role\"\n [attr.aria-busy]=\"currentState === 'loading' ? 'true' : null\"\n [attr.aria-live]=\"_role === 'alert' ? 'assertive' : 'polite'\">\n @if (currentIcon) {\n <span class=\"sd-data-state__symbol\" aria-hidden=\"true\">\n <mat-icon class=\"sd-data-state__icon\" [fontSet]=\"effectiveFontSet()\">{{ currentIcon }}</mat-icon>\n </span>\n }\n\n <div class=\"sd-data-state__title\">{{ title() ?? (titleKey() | translate) }}</div>\n <div class=\"sd-data-state__message\">{{ message() ?? (messageKey() | translate) }}</div>\n\n @if (_retryable || _actionLabel) {\n <div class=\"sd-data-state__actions\">\n @if (_retryable) {\n <sd-button\n data-state-retry\n type=\"light\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n prefixIcon=\"refresh\"\n fontSet=\"material-icons-outlined\"\n [title]=\"retryLabel() || ('core.component.data-state.retry' | translate)\"\n (click)=\"retry()\"></sd-button>\n }\n @if (_actionLabel; as label) {\n <sd-button\n data-state-action\n type=\"fill\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n [title]=\"label\"\n (click)=\"action()\"></sd-button>\n }\n </div>\n }\n </section>\n}\n", styles: [":host{display:contents}.sd-data-state{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:0;min-height:240px;padding:32px;text-align:center;color:var(--sd-black500)}.sd-data-state__symbol{display:grid;place-items:center;flex-shrink:0;width:56px;height:56px;margin-bottom:16px;border-radius:8px;background:var(--sd-black100)}.sd-data-state__icon{width:32px;height:32px;font-size:32px;line-height:1;color:var(--sd-black400)}.sd-data-state[data-state=error] .sd-data-state__symbol,.sd-data-state[data-state=forbidden] .sd-data-state__symbol{background:color-mix(in srgb,var(--sd-error-light) 40%,transparent)}.sd-data-state[data-state=error] .sd-data-state__icon,.sd-data-state[data-state=forbidden] .sd-data-state__icon{color:var(--sd-error)}.sd-data-state[data-state=loading] .sd-data-state__icon{color:var(--sd-primary);animation:sd-data-state-spin 1s linear infinite}.sd-data-state[data-state=loading] .sd-data-state__symbol{background:var(--sd-primary-light)}.sd-data-
|
|
60
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: SdDataState, isStandalone: true, selector: "sd-data-state", inputs: { state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, fontSet: { classPropertyName: "fontSet", publicName: "fontSet", isSignal: true, isRequired: false, transformFunction: null }, retryable: { classPropertyName: "retryable", publicName: "retryable", isSignal: true, isRequired: false, transformFunction: null }, retryLabel: { classPropertyName: "retryLabel", publicName: "retryLabel", isSignal: true, isRequired: false, transformFunction: null }, actionLabel: { classPropertyName: "actionLabel", publicName: "actionLabel", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, fullPage: { classPropertyName: "fullPage", publicName: "fullPage", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sdRetry: "sdRetry", sdAction: "sdAction" }, queries: [{ propertyName: "customTemplate", first: true, predicate: SdDataStateTemplateDirective, descendants: true, isSignal: true }], ngImport: i0, template: "@let currentState = state();\n@let template = customTemplate();\n@let _role = role();\n@let _retryable = retryable();\n@let _actionLabel = actionLabel();\n@let currentIcon = effectiveIcon();\n\n@if (currentState === 'success') {\n @if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n } @else {\n <ng-content></ng-content>\n }\n} @else if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n} @else {\n <section\n class=\"sd-data-state\"\n [class.sd-data-state--compact]=\"compact()\"\n [class.sd-data-state--full-page]=\"fullPage()\"\n [class.sd-data-state--with-icon]=\"!!currentIcon\"\n [attr.data-state]=\"currentState\"\n [attr.role]=\"_role\"\n [attr.aria-busy]=\"currentState === 'loading' ? 'true' : null\"\n [attr.aria-live]=\"_role === 'alert' ? 'assertive' : 'polite'\">\n @if (currentIcon) {\n <span class=\"sd-data-state__symbol\" aria-hidden=\"true\">\n <mat-icon class=\"sd-data-state__icon\" [fontSet]=\"effectiveFontSet()\">{{ currentIcon }}</mat-icon>\n </span>\n }\n\n <div class=\"sd-data-state__title\">{{ title() ?? (titleKey() | translate) }}</div>\n <div class=\"sd-data-state__message\">{{ message() ?? (messageKey() | translate) }}</div>\n\n @if (_retryable || _actionLabel) {\n <div class=\"sd-data-state__actions\">\n @if (_retryable) {\n <sd-button\n data-state-retry\n type=\"light\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n prefixIcon=\"refresh\"\n fontSet=\"material-icons-outlined\"\n [title]=\"retryLabel() || ('core.component.data-state.retry' | translate)\"\n (click)=\"retry()\"></sd-button>\n }\n @if (_actionLabel; as label) {\n <sd-button\n data-state-action\n type=\"fill\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n [title]=\"label\"\n (click)=\"action()\"></sd-button>\n }\n </div>\n }\n </section>\n}\n", styles: [":host{display:contents}.sd-data-state{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:0;min-height:240px;padding:32px;text-align:center;color:var(--sd-black500)}.sd-data-state__symbol{display:grid;place-items:center;flex-shrink:0;width:56px;height:56px;margin-bottom:16px;border-radius:8px;background:var(--sd-black100)}.sd-data-state__icon{width:32px;height:32px;font-size:32px;line-height:1;color:var(--sd-black400)}.sd-data-state[data-state=error] .sd-data-state__symbol,.sd-data-state[data-state=forbidden] .sd-data-state__symbol{background:color-mix(in srgb,var(--sd-error-light) 40%,transparent)}.sd-data-state[data-state=error] .sd-data-state__icon,.sd-data-state[data-state=forbidden] .sd-data-state__icon{color:var(--sd-error)}.sd-data-state[data-state=loading] .sd-data-state__icon{color:var(--sd-primary);animation:sd-data-state-spin 1s linear infinite}.sd-data-state[data-state=loading] .sd-data-state__symbol{background:var(--sd-primary-light)}.sd-data-state__title{max-width:100%;font-size:16px;font-weight:600;line-height:24px;overflow-wrap:anywhere}.sd-data-state__message{max-width:440px;margin-top:4px;color:var(--sd-black400);font-size:14px;line-height:22px;overflow-wrap:anywhere}.sd-data-state__message:empty,.sd-data-state__title:empty{display:none}.sd-data-state__actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;max-width:100%;margin-top:16px}.sd-data-state__actions sd-button{min-width:0;max-width:100%}.sd-data-state--compact{display:grid;grid-template-columns:minmax(0,1fr);align-content:center;align-items:start;column-gap:12px;min-height:120px;padding:16px;text-align:start}.sd-data-state--compact.sd-data-state--with-icon{grid-template-columns:32px minmax(0,1fr)}.sd-data-state--compact .sd-data-state__symbol{grid-column:1;grid-row:1/span 2;width:32px;height:32px;margin:0;border-radius:6px}.sd-data-state--compact .sd-data-state__icon{width:22px;height:22px;font-size:22px}.sd-data-state--compact .sd-data-state__title,.sd-data-state--compact .sd-data-state__message,.sd-data-state--compact .sd-data-state__actions{grid-column:-2}.sd-data-state--compact .sd-data-state__title{font-size:14px;line-height:20px}.sd-data-state--compact .sd-data-state__message{margin-top:2px;font-size:13px;line-height:20px}.sd-data-state--compact .sd-data-state__actions{justify-content:flex-start;margin-top:10px}.sd-data-state--full-page{min-height:100dvh}@keyframes sd-data-state-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.sd-data-state[data-state=loading] .sd-data-state__icon{animation:none}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: SdButton, selector: "sd-button", inputs: ["autoId", "type", "color", "size", "fontSet", "title", "width", "tooltip", "prefixIcon", "suffixIcon", "disabled", "loading", "block", "htmlType"], outputs: ["click"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
61
61
|
}
|
|
62
62
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: SdDataState, decorators: [{
|
|
63
63
|
type: Component,
|
|
64
|
-
args: [{ selector: 'sd-data-state', standalone: true, imports: [NgTemplateOutlet, TranslatePipe, MatIconModule, SdButton], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let currentState = state();\n@let template = customTemplate();\n@let _role = role();\n@let _retryable = retryable();\n@let _actionLabel = actionLabel();\n@let currentIcon = effectiveIcon();\n\n@if (currentState === 'success') {\n @if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n } @else {\n <ng-content></ng-content>\n }\n} @else if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n} @else {\n <section\n class=\"sd-data-state\"\n [class.sd-data-state--compact]=\"compact()\"\n [class.sd-data-state--full-page]=\"fullPage()\"\n [class.sd-data-state--with-icon]=\"!!currentIcon\"\n [attr.data-state]=\"currentState\"\n [attr.role]=\"_role\"\n [attr.aria-busy]=\"currentState === 'loading' ? 'true' : null\"\n [attr.aria-live]=\"_role === 'alert' ? 'assertive' : 'polite'\">\n @if (currentIcon) {\n <span class=\"sd-data-state__symbol\" aria-hidden=\"true\">\n <mat-icon class=\"sd-data-state__icon\" [fontSet]=\"effectiveFontSet()\">{{ currentIcon }}</mat-icon>\n </span>\n }\n\n <div class=\"sd-data-state__title\">{{ title() ?? (titleKey() | translate) }}</div>\n <div class=\"sd-data-state__message\">{{ message() ?? (messageKey() | translate) }}</div>\n\n @if (_retryable || _actionLabel) {\n <div class=\"sd-data-state__actions\">\n @if (_retryable) {\n <sd-button\n data-state-retry\n type=\"light\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n prefixIcon=\"refresh\"\n fontSet=\"material-icons-outlined\"\n [title]=\"retryLabel() || ('core.component.data-state.retry' | translate)\"\n (click)=\"retry()\"></sd-button>\n }\n @if (_actionLabel; as label) {\n <sd-button\n data-state-action\n type=\"fill\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n [title]=\"label\"\n (click)=\"action()\"></sd-button>\n }\n </div>\n }\n </section>\n}\n", styles: [":host{display:contents}.sd-data-state{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:0;min-height:240px;padding:32px;text-align:center;color:var(--sd-black500)}.sd-data-state__symbol{display:grid;place-items:center;flex-shrink:0;width:56px;height:56px;margin-bottom:16px;border-radius:8px;background:var(--sd-black100)}.sd-data-state__icon{width:32px;height:32px;font-size:32px;line-height:1;color:var(--sd-black400)}.sd-data-state[data-state=error] .sd-data-state__symbol,.sd-data-state[data-state=forbidden] .sd-data-state__symbol{background:color-mix(in srgb,var(--sd-error-light) 40%,transparent)}.sd-data-state[data-state=error] .sd-data-state__icon,.sd-data-state[data-state=forbidden] .sd-data-state__icon{color:var(--sd-error)}.sd-data-state[data-state=loading] .sd-data-state__icon{color:var(--sd-primary);animation:sd-data-state-spin 1s linear infinite}.sd-data-state[data-state=loading] .sd-data-state__symbol{background:var(--sd-primary-light)}.sd-data-
|
|
64
|
+
args: [{ selector: 'sd-data-state', standalone: true, imports: [NgTemplateOutlet, TranslatePipe, MatIconModule, SdButton], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let currentState = state();\n@let template = customTemplate();\n@let _role = role();\n@let _retryable = retryable();\n@let _actionLabel = actionLabel();\n@let currentIcon = effectiveIcon();\n\n@if (currentState === 'success') {\n @if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n } @else {\n <ng-content></ng-content>\n }\n} @else if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n} @else {\n <section\n class=\"sd-data-state\"\n [class.sd-data-state--compact]=\"compact()\"\n [class.sd-data-state--full-page]=\"fullPage()\"\n [class.sd-data-state--with-icon]=\"!!currentIcon\"\n [attr.data-state]=\"currentState\"\n [attr.role]=\"_role\"\n [attr.aria-busy]=\"currentState === 'loading' ? 'true' : null\"\n [attr.aria-live]=\"_role === 'alert' ? 'assertive' : 'polite'\">\n @if (currentIcon) {\n <span class=\"sd-data-state__symbol\" aria-hidden=\"true\">\n <mat-icon class=\"sd-data-state__icon\" [fontSet]=\"effectiveFontSet()\">{{ currentIcon }}</mat-icon>\n </span>\n }\n\n <div class=\"sd-data-state__title\">{{ title() ?? (titleKey() | translate) }}</div>\n <div class=\"sd-data-state__message\">{{ message() ?? (messageKey() | translate) }}</div>\n\n @if (_retryable || _actionLabel) {\n <div class=\"sd-data-state__actions\">\n @if (_retryable) {\n <sd-button\n data-state-retry\n type=\"light\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n prefixIcon=\"refresh\"\n fontSet=\"material-icons-outlined\"\n [title]=\"retryLabel() || ('core.component.data-state.retry' | translate)\"\n (click)=\"retry()\"></sd-button>\n }\n @if (_actionLabel; as label) {\n <sd-button\n data-state-action\n type=\"fill\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n [title]=\"label\"\n (click)=\"action()\"></sd-button>\n }\n </div>\n }\n </section>\n}\n", styles: [":host{display:contents}.sd-data-state{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:0;min-height:240px;padding:32px;text-align:center;color:var(--sd-black500)}.sd-data-state__symbol{display:grid;place-items:center;flex-shrink:0;width:56px;height:56px;margin-bottom:16px;border-radius:8px;background:var(--sd-black100)}.sd-data-state__icon{width:32px;height:32px;font-size:32px;line-height:1;color:var(--sd-black400)}.sd-data-state[data-state=error] .sd-data-state__symbol,.sd-data-state[data-state=forbidden] .sd-data-state__symbol{background:color-mix(in srgb,var(--sd-error-light) 40%,transparent)}.sd-data-state[data-state=error] .sd-data-state__icon,.sd-data-state[data-state=forbidden] .sd-data-state__icon{color:var(--sd-error)}.sd-data-state[data-state=loading] .sd-data-state__icon{color:var(--sd-primary);animation:sd-data-state-spin 1s linear infinite}.sd-data-state[data-state=loading] .sd-data-state__symbol{background:var(--sd-primary-light)}.sd-data-state__title{max-width:100%;font-size:16px;font-weight:600;line-height:24px;overflow-wrap:anywhere}.sd-data-state__message{max-width:440px;margin-top:4px;color:var(--sd-black400);font-size:14px;line-height:22px;overflow-wrap:anywhere}.sd-data-state__message:empty,.sd-data-state__title:empty{display:none}.sd-data-state__actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;max-width:100%;margin-top:16px}.sd-data-state__actions sd-button{min-width:0;max-width:100%}.sd-data-state--compact{display:grid;grid-template-columns:minmax(0,1fr);align-content:center;align-items:start;column-gap:12px;min-height:120px;padding:16px;text-align:start}.sd-data-state--compact.sd-data-state--with-icon{grid-template-columns:32px minmax(0,1fr)}.sd-data-state--compact .sd-data-state__symbol{grid-column:1;grid-row:1/span 2;width:32px;height:32px;margin:0;border-radius:6px}.sd-data-state--compact .sd-data-state__icon{width:22px;height:22px;font-size:22px}.sd-data-state--compact .sd-data-state__title,.sd-data-state--compact .sd-data-state__message,.sd-data-state--compact .sd-data-state__actions{grid-column:-2}.sd-data-state--compact .sd-data-state__title{font-size:14px;line-height:20px}.sd-data-state--compact .sd-data-state__message{margin-top:2px;font-size:13px;line-height:20px}.sd-data-state--compact .sd-data-state__actions{justify-content:flex-start;margin-top:10px}.sd-data-state--full-page{min-height:100dvh}@keyframes sd-data-state-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.sd-data-state[data-state=loading] .sd-data-state__icon{animation:none}}\n"] }]
|
|
65
65
|
}] });
|
|
66
66
|
|
|
67
67
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-angular-core-components-data-state.mjs","sources":["../../../projects/sd-angular/components/data-state/src/data-state.component.ts","../../../projects/sd-angular/components/data-state/src/data-state.component.html","../../../projects/sd-angular/components/data-state/sd-angular-core-components-data-state.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n Directive,\n TemplateRef,\n booleanAttribute,\n computed,\n contentChild,\n inject,\n input,\n output,\n} from '@angular/core';\nimport { TranslatePipe } from '@sd-angular/core/i18n';\nimport { MatIconModule } from '@angular/material/icon';\nimport { SdButton } from '@sd-angular/core/components/button';\n\nexport type SdIconSet = 'material-icons' | 'material-icons-outlined' | 'material-icons-round' | 'material-icons-sharp' | 'lucide';\n\nexport type SdDataStateKind = 'loading' | 'empty' | 'error' | 'forbidden' | 'success';\n\nexport interface SdDataStateTemplateContext {\n readonly $implicit: SdDataStateKind;\n readonly state: SdDataStateKind;\n readonly retry: () => void;\n readonly action: () => void;\n}\n\n@Directive({\n selector: 'ng-template[sdDataStateTemplate]',\n standalone: true,\n})\nexport class SdDataStateTemplateDirective {\n readonly template = inject<TemplateRef<SdDataStateTemplateContext>>(TemplateRef);\n\n static ngTemplateContextGuard(_directive: SdDataStateTemplateDirective, _context: unknown): _context is SdDataStateTemplateContext {\n return true;\n }\n}\n\nconst DEFAULT_ICON: Readonly<Record<SdDataStateKind, string | null>> = {\n loading: 'autorenew',\n empty: 'inbox',\n error: 'error_outline',\n forbidden: 'lock',\n success: null,\n};\n\n@Component({\n selector: 'sd-data-state',\n standalone: true,\n imports: [NgTemplateOutlet, TranslatePipe, MatIconModule, SdButton],\n templateUrl: './data-state.component.html',\n styleUrl: './data-state.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SdDataState {\n readonly state = input<SdDataStateKind>('success');\n readonly title = input<string | null | undefined>();\n readonly message = input<string | null | undefined>();\n readonly icon = input<string | null | undefined>();\n readonly fontSet = input<SdIconSet | undefined>();\n readonly retryable = input(false, { transform: booleanAttribute });\n readonly retryLabel = input<string | null | undefined>();\n readonly actionLabel = input<string | null | undefined>();\n readonly compact = input(false, { transform: booleanAttribute });\n readonly fullPage = input(false, { transform: booleanAttribute });\n readonly sdRetry = output<void>();\n readonly sdAction = output<void>();\n\n protected readonly customTemplate = contentChild(SdDataStateTemplateDirective);\n // why: core dùng Material; giữ kiểu API nguồn và fallback Lucide về bộ font có sẵn.\n protected readonly effectiveFontSet = computed(() =>\n this.fontSet() === 'lucide' ? 'material-icons-outlined' : (this.fontSet() ?? 'material-icons-outlined')\n );\n protected readonly effectiveIcon = computed(() => this.icon() ?? DEFAULT_ICON[this.state()]);\n protected readonly titleKey = computed(() => `core.component.data-state.${this.state()}.title`);\n protected readonly messageKey = computed(() => `core.component.data-state.${this.state()}.message`);\n protected readonly role = computed<'alert' | 'status'>(() =>\n this.state() === 'error' || this.state() === 'forbidden' ? 'alert' : 'status'\n );\n\n protected readonly retry = (): void => this.sdRetry.emit();\n protected readonly action = (): void => this.sdAction.emit();\n protected readonly templateContext = computed<SdDataStateTemplateContext>(() => ({\n $implicit: this.state(),\n state: this.state(),\n retry: this.retry,\n action: this.action,\n }));\n}\n","@let currentState = state();\n@let template = customTemplate();\n@let _role = role();\n@let _retryable = retryable();\n@let _actionLabel = actionLabel();\n@let currentIcon = effectiveIcon();\n\n@if (currentState === 'success') {\n @if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n } @else {\n <ng-content></ng-content>\n }\n} @else if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n} @else {\n <section\n class=\"sd-data-state\"\n [class.sd-data-state--compact]=\"compact()\"\n [class.sd-data-state--full-page]=\"fullPage()\"\n [class.sd-data-state--with-icon]=\"!!currentIcon\"\n [attr.data-state]=\"currentState\"\n [attr.role]=\"_role\"\n [attr.aria-busy]=\"currentState === 'loading' ? 'true' : null\"\n [attr.aria-live]=\"_role === 'alert' ? 'assertive' : 'polite'\">\n @if (currentIcon) {\n <span class=\"sd-data-state__symbol\" aria-hidden=\"true\">\n <mat-icon class=\"sd-data-state__icon\" [fontSet]=\"effectiveFontSet()\">{{ currentIcon }}</mat-icon>\n </span>\n }\n\n <div class=\"sd-data-state__title\">{{ title() ?? (titleKey() | translate) }}</div>\n <div class=\"sd-data-state__message\">{{ message() ?? (messageKey() | translate) }}</div>\n\n @if (_retryable || _actionLabel) {\n <div class=\"sd-data-state__actions\">\n @if (_retryable) {\n <sd-button\n data-state-retry\n type=\"light\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n prefixIcon=\"refresh\"\n fontSet=\"material-icons-outlined\"\n [title]=\"retryLabel() || ('core.component.data-state.retry' | translate)\"\n (click)=\"retry()\"></sd-button>\n }\n @if (_actionLabel; as label) {\n <sd-button\n data-state-action\n type=\"fill\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n [title]=\"label\"\n (click)=\"action()\"></sd-button>\n }\n </div>\n }\n </section>\n}\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-data-state.mjs","sources":["../../../projects/sd-angular/components/data-state/src/data-state.component.ts","../../../projects/sd-angular/components/data-state/src/data-state.component.html","../../../projects/sd-angular/components/data-state/sd-angular-core-components-data-state.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n Directive,\n TemplateRef,\n booleanAttribute,\n computed,\n contentChild,\n inject,\n input,\n output,\n} from '@angular/core';\nimport { TranslatePipe } from '@sd-angular/core/i18n';\nimport { MatIconModule } from '@angular/material/icon';\nimport { SdButton } from '@sd-angular/core/components/button';\n\nexport type SdIconSet = 'material-icons' | 'material-icons-outlined' | 'material-icons-round' | 'material-icons-sharp' | 'lucide';\n\nexport type SdDataStateKind = 'loading' | 'empty' | 'error' | 'forbidden' | 'success';\n\nexport interface SdDataStateTemplateContext {\n readonly $implicit: SdDataStateKind;\n readonly state: SdDataStateKind;\n readonly retry: () => void;\n readonly action: () => void;\n}\n\n@Directive({\n selector: 'ng-template[sdDataStateTemplate]',\n standalone: true,\n})\nexport class SdDataStateTemplateDirective {\n readonly template = inject<TemplateRef<SdDataStateTemplateContext>>(TemplateRef);\n\n static ngTemplateContextGuard(_directive: SdDataStateTemplateDirective, _context: unknown): _context is SdDataStateTemplateContext {\n return true;\n }\n}\n\nconst DEFAULT_ICON: Readonly<Record<SdDataStateKind, string | null>> = {\n loading: 'autorenew',\n empty: 'inbox',\n error: 'error_outline',\n forbidden: 'lock',\n success: null,\n};\n\n@Component({\n selector: 'sd-data-state',\n standalone: true,\n imports: [NgTemplateOutlet, TranslatePipe, MatIconModule, SdButton],\n templateUrl: './data-state.component.html',\n styleUrl: './data-state.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SdDataState {\n readonly state = input<SdDataStateKind>('success');\n readonly title = input<string | null | undefined>();\n readonly message = input<string | null | undefined>();\n readonly icon = input<string | null | undefined>();\n readonly fontSet = input<SdIconSet | undefined>();\n readonly retryable = input(false, { transform: booleanAttribute });\n readonly retryLabel = input<string | null | undefined>();\n readonly actionLabel = input<string | null | undefined>();\n readonly compact = input(false, { transform: booleanAttribute });\n readonly fullPage = input(false, { transform: booleanAttribute });\n readonly sdRetry = output<void>();\n readonly sdAction = output<void>();\n\n protected readonly customTemplate = contentChild(SdDataStateTemplateDirective);\n // why: core dùng Material; giữ kiểu API nguồn và fallback Lucide về bộ font có sẵn.\n protected readonly effectiveFontSet = computed(() =>\n this.fontSet() === 'lucide' ? 'material-icons-outlined' : (this.fontSet() ?? 'material-icons-outlined')\n );\n protected readonly effectiveIcon = computed(() => this.icon() ?? DEFAULT_ICON[this.state()]);\n protected readonly titleKey = computed(() => `core.component.data-state.${this.state()}.title`);\n protected readonly messageKey = computed(() => `core.component.data-state.${this.state()}.message`);\n protected readonly role = computed<'alert' | 'status'>(() =>\n this.state() === 'error' || this.state() === 'forbidden' ? 'alert' : 'status'\n );\n\n protected readonly retry = (): void => this.sdRetry.emit();\n protected readonly action = (): void => this.sdAction.emit();\n protected readonly templateContext = computed<SdDataStateTemplateContext>(() => ({\n $implicit: this.state(),\n state: this.state(),\n retry: this.retry,\n action: this.action,\n }));\n}\n","@let currentState = state();\n@let template = customTemplate();\n@let _role = role();\n@let _retryable = retryable();\n@let _actionLabel = actionLabel();\n@let currentIcon = effectiveIcon();\n\n@if (currentState === 'success') {\n @if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n } @else {\n <ng-content></ng-content>\n }\n} @else if (template) {\n <ng-container [ngTemplateOutlet]=\"template.template\" [ngTemplateOutletContext]=\"templateContext()\"></ng-container>\n} @else {\n <section\n class=\"sd-data-state\"\n [class.sd-data-state--compact]=\"compact()\"\n [class.sd-data-state--full-page]=\"fullPage()\"\n [class.sd-data-state--with-icon]=\"!!currentIcon\"\n [attr.data-state]=\"currentState\"\n [attr.role]=\"_role\"\n [attr.aria-busy]=\"currentState === 'loading' ? 'true' : null\"\n [attr.aria-live]=\"_role === 'alert' ? 'assertive' : 'polite'\">\n @if (currentIcon) {\n <span class=\"sd-data-state__symbol\" aria-hidden=\"true\">\n <mat-icon class=\"sd-data-state__icon\" [fontSet]=\"effectiveFontSet()\">{{ currentIcon }}</mat-icon>\n </span>\n }\n\n <div class=\"sd-data-state__title\">{{ title() ?? (titleKey() | translate) }}</div>\n <div class=\"sd-data-state__message\">{{ message() ?? (messageKey() | translate) }}</div>\n\n @if (_retryable || _actionLabel) {\n <div class=\"sd-data-state__actions\">\n @if (_retryable) {\n <sd-button\n data-state-retry\n type=\"light\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n prefixIcon=\"refresh\"\n fontSet=\"material-icons-outlined\"\n [title]=\"retryLabel() || ('core.component.data-state.retry' | translate)\"\n (click)=\"retry()\"></sd-button>\n }\n @if (_actionLabel; as label) {\n <sd-button\n data-state-action\n type=\"fill\"\n color=\"primary\"\n size=\"sm\"\n htmlType=\"button\"\n width=\"100%\"\n [title]=\"label\"\n (click)=\"action()\"></sd-button>\n }\n </div>\n }\n </section>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -2180,7 +2180,7 @@ class UploadComponent {
|
|
|
2180
2180
|
return await this.sdUploadFile?.upload();
|
|
2181
2181
|
};
|
|
2182
2182
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: UploadComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2183
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: UploadComponent, isStandalone: true, selector: "lib-upload", inputs: { setVariables: "setVariables", form: "form", _entity: ["entity", "_entity"], _component: ["component", "_component"], _disabled: ["disabled", "_disabled"], _required: ["required", "_required"], _viewed: ["viewed", "_viewed"], _validator: ["validator", "_validator"] }, viewQueries: [{ propertyName: "sdUploadFile", first: true, predicate: SdUploadFile, descendants: true }], ngImport: i0, template: "@if (component && entity) {\n @if (viewed || component.properties?.viewed) {\n <div class=\"text-secondary\">{{ component.label || component.key }}</div>\n <sd-upload-file\n [type]=\"component.properties?.type\"\n [form]=\"form\"\n [model]=\"entity[component.key!]\"\n align=\"left\"\n [args]=\"component.properties?.args\"\n disabled\n previewWidth=\"50px\"\n previewHeight=\"50px\"></sd-upload-file>\n } @else {\n <sd-upload-file\n [type]=\"component.properties?.type\"\n [form]=\"form\"\n [label]=\"component.label || component.key\"\n [(model)]=\"entity[component.key!]\"\n [max]=\"component.properties?.max\"\n [maxSize]=\"component.properties?.maxSize\"\n [extensions]=\"component.properties?.extensions\"\n [args]=\"component.properties?.args\"\n align=\"left\"\n [required]=\"component.validate?.required || required\"\n [disabled]=\"disabled\"\n previewWidth=\"50px\"\n previewHeight=\"50px\"></sd-upload-file>\n }\n}\n", styles: [":host{display:contents;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: SdUploadFile, selector: "sd-upload-file", inputs: ["autoId", "args", "label", "key", "description", "
|
|
2183
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: UploadComponent, isStandalone: true, selector: "lib-upload", inputs: { setVariables: "setVariables", form: "form", _entity: ["entity", "_entity"], _component: ["component", "_component"], _disabled: ["disabled", "_disabled"], _required: ["required", "_required"], _viewed: ["viewed", "_viewed"], _validator: ["validator", "_validator"] }, viewQueries: [{ propertyName: "sdUploadFile", first: true, predicate: SdUploadFile, descendants: true }], ngImport: i0, template: "@if (component && entity) {\n @if (viewed || component.properties?.viewed) {\n <div class=\"text-secondary\">{{ component.label || component.key }}</div>\n <sd-upload-file\n [type]=\"component.properties?.type\"\n [form]=\"form\"\n [model]=\"entity[component.key!]\"\n align=\"left\"\n [args]=\"component.properties?.args\"\n disabled\n previewWidth=\"50px\"\n previewHeight=\"50px\"></sd-upload-file>\n } @else {\n <sd-upload-file\n [type]=\"component.properties?.type\"\n [form]=\"form\"\n [label]=\"component.label || component.key\"\n [(model)]=\"entity[component.key!]\"\n [max]=\"component.properties?.max\"\n [maxSize]=\"component.properties?.maxSize\"\n [extensions]=\"component.properties?.extensions\"\n [args]=\"component.properties?.args\"\n align=\"left\"\n [required]=\"component.validate?.required || required\"\n [disabled]=\"disabled\"\n previewWidth=\"50px\"\n previewHeight=\"50px\"></sd-upload-file>\n }\n}\n", styles: [":host{display:contents;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: SdUploadFile, selector: "sd-upload-file", inputs: ["autoId", "args", "label", "key", "description", "previewWidth", "previewHeight", "align", "upload", "details", "download", "imageValidator", "maxSize", "maxWidth", "maxHeight", "scaleToPixel", "form", "name", "required", "type", "helperText", "max", "maxOfImage", "extensions", "disabled", "model"], outputs: ["loaded", "filesChanged", "modelChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2184
2184
|
}
|
|
2185
2185
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: UploadComponent, decorators: [{
|
|
2186
2186
|
type: Component,
|
|
@@ -2559,7 +2559,7 @@ class TableComponent {
|
|
|
2559
2559
|
}
|
|
2560
2560
|
};
|
|
2561
2561
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: FormGenericService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2562
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: TableComponent, isStandalone: true, selector: "lib-table", inputs: { setVariables: "setVariables", form: "form", _component: ["component", "_component"], _required: ["required", "_required"], _viewed: ["viewed", "_viewed"], _model: ["model", "_model"] }, outputs: { modelChange: "modelChange" }, viewQueries: [{ propertyName: "table", first: true, predicate: SdTable, descendants: true }, { propertyName: "sideDrawer", first: true, predicate: SdSideDrawer, descendants: true }, { propertyName: "uploadFiles", predicate: SdUploadFile, descendants: true }], ngImport: i0, template: "@if(component && tableOption) {\n <div style=\"width: 100%\">\n <sd-table [option]=\"tableOption\">\n @for(key of imageKeys; track key) {\n <ng-template [sdTableCellDef]=\"key\" let-item=\"item\">\n <sd-upload-file\n type=\"image\"\n [model]=\"item[key]\"\n [args]=\"getArgs(key)\"\n (modelChange)=\"onFileUploadChange(item, key, $event)\"\n align=\"left\"\n disabled\n previewWidth=\"50px\"\n previewHeight=\"50px\"></sd-upload-file>\n </ng-template>\n }\n @for(key of fileKeys; track key) {\n <ng-template [sdTableCellDef]=\"key\" let-item=\"item\">\n <sd-upload-file\n [model]=\"item[key]\"\n [args]=\"getArgs(key)\"\n (modelChange)=\"onFileUploadChange(item, key, $event)\"\n align=\"left\"\n disabled\n previewWidth=\"50px\"\n previewHeight=\"50px\"></sd-upload-file>\n </ng-template>\n }\n </sd-table>\n @if(!viewed && !component.properties?.viewed) {\n <sd-button\n prefixIcon=\"add\"\n color=\"primary\"\n (click)=\"onDetail()\"\n [title]=\"component.properties?.titleButtonCreate || ('core.component.form-builder.add-new' | translate)\"></sd-button>\n }\n @if(!viewed && !component.properties?.viewed) {\n <sd-side-drawer [title]=\"'core.component.form-builder.detail' | translate\" width=\"500px\">\n <div sdTitle>\n <span>{{ 'core.component.form-builder.create-update' | translate }}</span>\n </div>\n <div sdBody class=\"c-table-create-update\">\n @if(!!component.columns?.length) {\n <div class=\"row mx-0\">\n @for(column of component.columns;track column.key) {\n @let validate = formRenderColumn[column.key].validate;\n <div class=\"col-12 px-0 mt-16\">\n @if(column.type === 'string') {\n <sd-input\n [form]=\"form\"\n [label]=\"column.label\"\n [(model)]=\"row[column.key]\"\n [required]=\"validate?.required\"\n [pattern]=\"column.validate?.pattern\"\n [patternErrorMessage]=\"column.validate?.patternErrorMessage\"></sd-input>\n }@else if(column.type === 'number') {\n <sd-input-number\n [form]=\"form\"\n [label]=\"column.label\"\n [(model)]=\"row[column.key]\"\n [required]=\"validate?.required\"\n [min]=\"column.validate?.min\"></sd-input-number>\n }@else if(column.type === 'radio') {\n <sd-radio\n [form]=\"form\"\n [label]=\"column.label\"\n [name]=\"column.key\"\n [items]=\"column.values\"\n valueField=\"value\"\n displayField=\"display\"\n [required]=\"validate?.required\"></sd-radio>\n }@else if(column.type === 'values') {\n <sd-autocomplete\n [form]=\"form\"\n [label]=\"column.label\"\n [(model)]=\"row[column.key]\"\n [items]=\"columnValues[column.key]\"\n valueField=\"value\"\n displayField=\"display\"\n [required]=\"validate?.required\"></sd-autocomplete>\n }@else if(column.type === 'date') {\n <sd-date\n [form]=\"form\"\n [label]=\"column.label\"\n [(model)]=\"row[column.key]\"\n [required]=\"validate?.required\"></sd-date>\n }@else if(column.type === 'datetime') {\n <sd-datetime\n [form]=\"form\"\n [label]=\"column.label\"\n [(model)]=\"row[column.key]\"\n [required]=\"validate?.required\"></sd-datetime>\n }@else if(column.type === 'image') {\n <sd-upload-file\n [label]=\"column.label\"\n type=\"image\"\n [(model)]=\"row[column.key]\"\n [args]=\"column.args\"\n previewWidth=\"50px\"\n previewHeight=\"50px\"\n align=\"left\"></sd-upload-file>\n }@else if (column.type === 'file') {\n <sd-upload-file\n [label]=\"column.label\"\n type=\"file\"\n [(model)]=\"row[column.key]\"\n [args]=\"column.args\"\n previewWidth=\"50px\"\n previewHeight=\"50px\"\n align=\"left\"></sd-upload-file>\n }\n </div>\n }\n </div>\n }\n \n </div>\n <div sdFooter class=\"text-right pr-16\">\n <sd-button [title]=\"'core.component.form-builder.save' | translate\" prefixIcon=\"save\" color=\"primary\" type=\"fill\" (click)=\"onAccept()\"></sd-button>\n </div>\n </sd-side-drawer>\n }\n </div>\n}\n\n", styles: [":host{display:contents}.c-table-create-update{background:#fff;margin:-16px;padding:16px;height:calc(100vh - 97px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: SdInput, selector: "sd-input", inputs: ["autoId", "name", "appearance", "floatLabel", "size", "form", "label", "helperText", "placeholder", "type", "hideInlineError", "blurOnEnter", "clearable", "required", "readonly", "disabled", "viewed", "minlength", "maxlength", "pattern", "patternErrorMessage", "validator", "inlineError", "hyperlink", "model"], outputs: ["modelChange", "sdChange", "sdFocus", "sdBlur", "keyupEnter", "cleared", "sdFocusForceBlur"] }, { kind: "component", type: SdInputNumber$1, selector: "sd-input-number", inputs: ["autoId", "name", "size", "form", "label", "helperText", "placeholder", "hideInlineError", "blurOnEnter", "clearable", "required", "readonly", "disabled", "viewed", "type", "precision", "format", "min", "max", "validator", "inlineError", "hyperlink", "appearance", "floatLabel", "model"], outputs: ["modelChange", "sdChange", "sdFocus", "sdBlur", "keyupEnter", "cleared", "sdFocusForceBlur"] }, { kind: "component", type: SdAutocomplete, selector: "sd-autocomplete", inputs: ["autoId", "name", "size", "form", "label", "helperText", "placeholder", "valueField", "displayField", "disabledField", "limit", "cacheChecksum", "hyperlink", "items", "hideInlineError", "hideReadError", "addable", "required", "disabled", "viewed", "clearable", "validator", "inlineError", "appearance", "model"], outputs: ["sdReadStateChange", "modelChange", "sdChange", "sdSelection", "sdAdd"] }, { kind: "component", type: SdUploadFile, selector: "sd-upload-file", inputs: ["autoId", "args", "label", "key", "description", "
|
|
2562
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: TableComponent, isStandalone: true, selector: "lib-table", inputs: { setVariables: "setVariables", form: "form", _component: ["component", "_component"], _required: ["required", "_required"], _viewed: ["viewed", "_viewed"], _model: ["model", "_model"] }, outputs: { modelChange: "modelChange" }, viewQueries: [{ propertyName: "table", first: true, predicate: SdTable, descendants: true }, { propertyName: "sideDrawer", first: true, predicate: SdSideDrawer, descendants: true }, { propertyName: "uploadFiles", predicate: SdUploadFile, descendants: true }], ngImport: i0, template: "@if(component && tableOption) {\n <div style=\"width: 100%\">\n <sd-table [option]=\"tableOption\">\n @for(key of imageKeys; track key) {\n <ng-template [sdTableCellDef]=\"key\" let-item=\"item\">\n <sd-upload-file\n type=\"image\"\n [model]=\"item[key]\"\n [args]=\"getArgs(key)\"\n (modelChange)=\"onFileUploadChange(item, key, $event)\"\n align=\"left\"\n disabled\n previewWidth=\"50px\"\n previewHeight=\"50px\"></sd-upload-file>\n </ng-template>\n }\n @for(key of fileKeys; track key) {\n <ng-template [sdTableCellDef]=\"key\" let-item=\"item\">\n <sd-upload-file\n [model]=\"item[key]\"\n [args]=\"getArgs(key)\"\n (modelChange)=\"onFileUploadChange(item, key, $event)\"\n align=\"left\"\n disabled\n previewWidth=\"50px\"\n previewHeight=\"50px\"></sd-upload-file>\n </ng-template>\n }\n </sd-table>\n @if(!viewed && !component.properties?.viewed) {\n <sd-button\n prefixIcon=\"add\"\n color=\"primary\"\n (click)=\"onDetail()\"\n [title]=\"component.properties?.titleButtonCreate || ('core.component.form-builder.add-new' | translate)\"></sd-button>\n }\n @if(!viewed && !component.properties?.viewed) {\n <sd-side-drawer [title]=\"'core.component.form-builder.detail' | translate\" width=\"500px\">\n <div sdTitle>\n <span>{{ 'core.component.form-builder.create-update' | translate }}</span>\n </div>\n <div sdBody class=\"c-table-create-update\">\n @if(!!component.columns?.length) {\n <div class=\"row mx-0\">\n @for(column of component.columns;track column.key) {\n @let validate = formRenderColumn[column.key].validate;\n <div class=\"col-12 px-0 mt-16\">\n @if(column.type === 'string') {\n <sd-input\n [form]=\"form\"\n [label]=\"column.label\"\n [(model)]=\"row[column.key]\"\n [required]=\"validate?.required\"\n [pattern]=\"column.validate?.pattern\"\n [patternErrorMessage]=\"column.validate?.patternErrorMessage\"></sd-input>\n }@else if(column.type === 'number') {\n <sd-input-number\n [form]=\"form\"\n [label]=\"column.label\"\n [(model)]=\"row[column.key]\"\n [required]=\"validate?.required\"\n [min]=\"column.validate?.min\"></sd-input-number>\n }@else if(column.type === 'radio') {\n <sd-radio\n [form]=\"form\"\n [label]=\"column.label\"\n [name]=\"column.key\"\n [items]=\"column.values\"\n valueField=\"value\"\n displayField=\"display\"\n [required]=\"validate?.required\"></sd-radio>\n }@else if(column.type === 'values') {\n <sd-autocomplete\n [form]=\"form\"\n [label]=\"column.label\"\n [(model)]=\"row[column.key]\"\n [items]=\"columnValues[column.key]\"\n valueField=\"value\"\n displayField=\"display\"\n [required]=\"validate?.required\"></sd-autocomplete>\n }@else if(column.type === 'date') {\n <sd-date\n [form]=\"form\"\n [label]=\"column.label\"\n [(model)]=\"row[column.key]\"\n [required]=\"validate?.required\"></sd-date>\n }@else if(column.type === 'datetime') {\n <sd-datetime\n [form]=\"form\"\n [label]=\"column.label\"\n [(model)]=\"row[column.key]\"\n [required]=\"validate?.required\"></sd-datetime>\n }@else if(column.type === 'image') {\n <sd-upload-file\n [label]=\"column.label\"\n type=\"image\"\n [(model)]=\"row[column.key]\"\n [args]=\"column.args\"\n previewWidth=\"50px\"\n previewHeight=\"50px\"\n align=\"left\"></sd-upload-file>\n }@else if (column.type === 'file') {\n <sd-upload-file\n [label]=\"column.label\"\n type=\"file\"\n [(model)]=\"row[column.key]\"\n [args]=\"column.args\"\n previewWidth=\"50px\"\n previewHeight=\"50px\"\n align=\"left\"></sd-upload-file>\n }\n </div>\n }\n </div>\n }\n \n </div>\n <div sdFooter class=\"text-right pr-16\">\n <sd-button [title]=\"'core.component.form-builder.save' | translate\" prefixIcon=\"save\" color=\"primary\" type=\"fill\" (click)=\"onAccept()\"></sd-button>\n </div>\n </sd-side-drawer>\n }\n </div>\n}\n\n", styles: [":host{display:contents}.c-table-create-update{background:#fff;margin:-16px;padding:16px;height:calc(100vh - 97px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: SdInput, selector: "sd-input", inputs: ["autoId", "name", "appearance", "floatLabel", "size", "form", "label", "helperText", "placeholder", "type", "hideInlineError", "blurOnEnter", "clearable", "required", "readonly", "disabled", "viewed", "minlength", "maxlength", "pattern", "patternErrorMessage", "validator", "inlineError", "hyperlink", "model"], outputs: ["modelChange", "sdChange", "sdFocus", "sdBlur", "keyupEnter", "cleared", "sdFocusForceBlur"] }, { kind: "component", type: SdInputNumber$1, selector: "sd-input-number", inputs: ["autoId", "name", "size", "form", "label", "helperText", "placeholder", "hideInlineError", "blurOnEnter", "clearable", "required", "readonly", "disabled", "viewed", "type", "precision", "format", "min", "max", "validator", "inlineError", "hyperlink", "appearance", "floatLabel", "model"], outputs: ["modelChange", "sdChange", "sdFocus", "sdBlur", "keyupEnter", "cleared", "sdFocusForceBlur"] }, { kind: "component", type: SdAutocomplete, selector: "sd-autocomplete", inputs: ["autoId", "name", "size", "form", "label", "helperText", "placeholder", "valueField", "displayField", "disabledField", "limit", "cacheChecksum", "hyperlink", "items", "hideInlineError", "hideReadError", "addable", "required", "disabled", "viewed", "clearable", "validator", "inlineError", "appearance", "model"], outputs: ["sdReadStateChange", "modelChange", "sdChange", "sdSelection", "sdAdd"] }, { kind: "component", type: SdUploadFile, selector: "sd-upload-file", inputs: ["autoId", "args", "label", "key", "description", "previewWidth", "previewHeight", "align", "upload", "details", "download", "imageValidator", "maxSize", "maxWidth", "maxHeight", "scaleToPixel", "form", "name", "required", "type", "helperText", "max", "maxOfImage", "extensions", "disabled", "model"], outputs: ["loaded", "filesChanged", "modelChange"] }, { kind: "component", type: SdTable, selector: "sd-table", inputs: ["autoId", "option", "hideReadError"], outputs: ["sdReadStateChange"] }, { kind: "directive", type: SdTableCellDefDirective, selector: "[sdTableCellDef]", inputs: ["sdTableCellDef"] }, { kind: "component", type: SdSideDrawer, selector: "sd-side-drawer", inputs: ["title", "width", "hideClose", "disableBackdropClose", "drawerClass", "autoId"], outputs: ["sdClosed"] }, { kind: "component", type: SdButton, selector: "sd-button", inputs: ["autoId", "type", "color", "size", "fontSet", "title", "width", "tooltip", "prefixIcon", "suffixIcon", "disabled", "loading", "block", "htmlType"], outputs: ["click"] }, { kind: "component", type: SdRadio, selector: "sd-radio", inputs: ["autoId", "name", "form", "label", "placeholder", "display", "items", "valueField", "displayField", "required", "inlineError", "disabled", "viewed", "color", "hyperlink", "model"], outputs: ["modelChange", "sdChange", "sdSelection"] }, { kind: "component", type: SdDate, selector: "sd-date", inputs: ["autoId", "name", "size", "form", "label", "helperText", "placeholder", "hideInlineError", "required", "disabled", "viewed", "clearable", "inlineError", "hyperlink", "appearance", "floatLabel", "min", "minDate", "max", "maxDate", "model"], outputs: ["modelChange", "sdChange", "sdFocus"] }, { kind: "component", type: SdDatetime, selector: "sd-datetime", inputs: ["autoId", "name", "size", "form", "label", "helperText", "placeholder", "hideInlineError", "required", "disabled", "viewed", "showSeconds", "clearable", "inlineError", "hyperlink", "appearance", "floatLabel", "min", "minDate", "max", "maxDate", "model"], outputs: ["modelChange", "sdChange", "sdFocus"] }, { kind: "pipe", type:
|
|
2563
2563
|
// Pipe cho phần viewed
|
|
2564
2564
|
TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2565
2565
|
}
|