@libs-ui/components-process-bar-steps 0.2.263 → 0.2.264
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/esm2022/process-bar-step.interface.mjs +1 -1
- package/esm2022/process-bar-steps.component.mjs +18 -4
- package/fesm2022/libs-ui-components-process-bar-steps.mjs +17 -3
- package/fesm2022/libs-ui-components-process-bar-steps.mjs.map +1 -1
- package/package.json +1 -1
- package/process-bar-step.interface.d.ts +9 -4
- package/process-bar-steps.component.d.ts +3 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export {};
|
|
2
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvY2Vzcy1iYXItc3RlcC5pbnRlcmZhY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvcHJvY2Vzcy1iYXIvc3RlcHMvc3JjL3Byb2Nlc3MtYmFyLXN0ZXAuaW50ZXJmYWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBXcml0YWJsZVNpZ25hbCB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgSVByb2Nlc3NCYXJTdGVwQ29uZmlnSW50ZXJmYWNlIHtcbiAgcG9zaXRpb25MYWJlbD86ICd0b3AnIHwgJ2JvdHRvbScgfCAnaW5uZXInO1xuICBqdXN0aWZ5TGFiZWw/OiAnc3RhcnQnIHwgJ2NlbnRlcicgfCAnZW5kJztcbiAgd2lkdGhTdGVwPzogc3RyaW5nO1xuICBoZWlnaHRTdGVwPzogc3RyaW5nO1xuICBjbGFzc0luY2x1ZGU/OiBzdHJpbmc7XG4gIGJhY2tncm91bmRDb2xvclN0ZXA/OiBzdHJpbmc7XG4gIHJhZGl1c1N0ZXA/
|
|
2
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvY2Vzcy1iYXItc3RlcC5pbnRlcmZhY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvcHJvY2Vzcy1iYXIvc3RlcHMvc3JjL3Byb2Nlc3MtYmFyLXN0ZXAuaW50ZXJmYWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBXcml0YWJsZVNpZ25hbCB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgSVByb2Nlc3NCYXJTdGVwQ29uZmlnSW50ZXJmYWNlIHtcbiAgcG9zaXRpb25MYWJlbD86ICd0b3AnIHwgJ2JvdHRvbScgfCAnaW5uZXInO1xuICBqdXN0aWZ5TGFiZWw/OiAnc3RhcnQnIHwgJ2NlbnRlcicgfCAnZW5kJztcbiAgd2lkdGhTdGVwPzogc3RyaW5nO1xuICBoZWlnaHRTdGVwPzogc3RyaW5nO1xuICBjbGFzc0luY2x1ZGU/OiBzdHJpbmc7XG4gIGJhY2tncm91bmRDb2xvclN0ZXA/OiBzdHJpbmc7XG4gIHJhZGl1c1N0ZXA/OiBudW1iZXI7XG4gIHNpbXBsZUNvbmZpZz86IFdyaXRhYmxlU2lnbmFsPElQcm9jZXNzQmFyU3RlcFNpbXBsZUNvbmZpZ0ludGVyZmFjZT47XG4gIGFkdmFuY2VkQ29uZmlnPzogV3JpdGFibGVTaWduYWw8QXJyYXk8V3JpdGFibGVTaWduYWw8SVByb2Nlc3NCYXJTdGVwQWR2YW5jZWRDb25maWdJbnRlcmZhY2U+Pj47XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgSVByb2Nlc3NCYXJTdGVwQWR2YW5jZWRDb25maWdJbnRlcmZhY2Uge1xuICBjbGFzc0luY2x1ZGVDb250YWluZXI/OiBzdHJpbmc7XG4gIGNsYXNzSW5jbHVkZVN0ZXA/OiBzdHJpbmc7XG4gIHByb2Nlc3NDb21wbGV0ZWQ/OiBib29sZWFuO1xuICBwcm9jZXNzQ29tcGxldGVkQ29sb3I/OiBzdHJpbmc7XG4gIGlzQ3VycmVudFByb2Nlc3M/OiBib29sZWFuO1xuICBjdXJyZW50UHJvY2Vzc0NvbG9yPzogc3RyaW5nO1xuICBsYWJlbD86IHN0cmluZztcbiAgY2xhc3NMYWJlbD86IHN0cmluZztcbn1cblxuZXhwb3J0IGludGVyZmFjZSBJUHJvY2Vzc0JhclN0ZXBTaW1wbGVDb25maWdJbnRlcmZhY2Uge1xuICB0b3RhbFN0ZXA6IG51bWJlcjtcbiAgY3VycmVudFN0ZXA6IG51bWJlcjtcbiAgY3VycmVudFN0ZXBDb2xvcjogc3RyaW5nO1xuICBzdGVwQ29tcGxldGVkQ29sb3I6IHN0cmluZztcbn0iXX0=
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';
|
|
1
|
+
import { ChangeDetectionStrategy, Component, computed, inject, input, signal } from '@angular/core';
|
|
2
2
|
import { PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT } from '@libs-ui/utils';
|
|
3
3
|
import * as i0 from "@angular/core";
|
|
4
4
|
export class LibsUiComponentsProcessBarStepsComponent {
|
|
@@ -6,13 +6,27 @@ export class LibsUiComponentsProcessBarStepsComponent {
|
|
|
6
6
|
height = computed(() => this.config().heightStep ?? this.processBarConfigDefault?.heightStep ?? '12px');
|
|
7
7
|
backgroundColor = computed(() => this.config().backgroundColorStep ?? this.processBarConfigDefault?.backgroundColorStep ?? '#F8F9FA');
|
|
8
8
|
radius = computed(() => `${this.config().radiusStep ?? this.processBarConfigDefault?.radiusStep ?? 20}px`);
|
|
9
|
+
simpleSteps = computed(() => {
|
|
10
|
+
const simpleConfig = this.config().simpleConfig?.();
|
|
11
|
+
if (!simpleConfig) {
|
|
12
|
+
return [];
|
|
13
|
+
}
|
|
14
|
+
return Array.from({ length: simpleConfig.totalStep }, (_, index) => {
|
|
15
|
+
return signal({
|
|
16
|
+
isCurrentProcess: index === simpleConfig.currentStep,
|
|
17
|
+
processCompleted: index < simpleConfig.currentStep,
|
|
18
|
+
currentProcessColor: simpleConfig.currentStepColor,
|
|
19
|
+
stepCompletedColor: simpleConfig.stepCompletedColor,
|
|
20
|
+
});
|
|
21
|
+
});
|
|
22
|
+
});
|
|
9
23
|
config = input.required();
|
|
10
24
|
processBarConfigDefault = inject(PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT, { optional: true });
|
|
11
25
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsProcessBarStepsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
12
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsProcessBarStepsComponent, isStandalone: true, selector: "libs_ui-components-process_bar-steps", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@let constHtmlPositionLabel = config().positionLabel || 'top';\n@let constHtmlJustifyLabel = config().justifyLabel || 'center';\n<div [class]=\"(config().classInclude || '') + ' libs-ui-process-bar-steps'\">\n @for (step of
|
|
26
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsProcessBarStepsComponent, isStandalone: true, selector: "libs_ui-components-process_bar-steps", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@let constHtmlPositionLabel = config().positionLabel || 'top';\n@let constHtmlJustifyLabel = config().justifyLabel || 'center';\n@let constHtmlSteps= config().advancedConfig?.() || simpleSteps();\n<div [class]=\"(config().classInclude || '') + ' libs-ui-process-bar-steps'\">\n @if (constHtmlSteps) {\n @for (step of constHtmlSteps; track step();) {\n @let constHtmlActiveBackground = step().processCompleted ? (step().processCompletedColor || '#33DA8A'): backgroundColor();\n @let constHtmlCurrentProcessBackground = step().isCurrentProcess ? (step().currentProcessColor || '#4E8CF7') : '';\n <div [class]=\"(step().classIncludeContainer || '') + ' flex'\"\n [class.flex-col]=\"constHtmlPositionLabel === 'top' || constHtmlPositionLabel === 'bottom'\"\n [style.alignItems]=\"constHtmlJustifyLabel\">\n @if (step().label && constHtmlPositionLabel === 'top') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex mb-[4px]'\">\n {{ step().label }}\n </div>\n }\n <div [class]=\"(step().classIncludeStep || '') + ' process-bar-step flex items-center libs-ui-border-general'\"\n [class.mr-[4px]]=\"!$last\" [style.width]=\"width()\" [style.height]=\"height()\"\n [style.backgroundColor]=\"constHtmlCurrentProcessBackground || constHtmlActiveBackground\"\n [style.borderRadius]=\"radius()\" [style.justifyContent]=\"constHtmlJustifyLabel\">\n @if (step().label && constHtmlPositionLabel === 'inner') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex'\">\n {{ step().label }}\n </div>\n }\n </div>\n @if (step().label && constHtmlPositionLabel === 'bottom') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex mt-[4px]'\">\n {{ step().label }}\n </div>\n }\n </div>\n }\n}\n</div>\n", styles: [".libs-ui-process-bar-steps{display:flex;flex-shrink:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
13
27
|
}
|
|
14
28
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsProcessBarStepsComponent, decorators: [{
|
|
15
29
|
type: Component,
|
|
16
|
-
args: [{ selector: 'libs_ui-components-process_bar-steps', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@let constHtmlPositionLabel = config().positionLabel || 'top';\n@let constHtmlJustifyLabel = config().justifyLabel || 'center';\n<div [class]=\"(config().classInclude || '') + ' libs-ui-process-bar-steps'\">\n @for (step of
|
|
30
|
+
args: [{ selector: 'libs_ui-components-process_bar-steps', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@let constHtmlPositionLabel = config().positionLabel || 'top';\n@let constHtmlJustifyLabel = config().justifyLabel || 'center';\n@let constHtmlSteps= config().advancedConfig?.() || simpleSteps();\n<div [class]=\"(config().classInclude || '') + ' libs-ui-process-bar-steps'\">\n @if (constHtmlSteps) {\n @for (step of constHtmlSteps; track step();) {\n @let constHtmlActiveBackground = step().processCompleted ? (step().processCompletedColor || '#33DA8A'): backgroundColor();\n @let constHtmlCurrentProcessBackground = step().isCurrentProcess ? (step().currentProcessColor || '#4E8CF7') : '';\n <div [class]=\"(step().classIncludeContainer || '') + ' flex'\"\n [class.flex-col]=\"constHtmlPositionLabel === 'top' || constHtmlPositionLabel === 'bottom'\"\n [style.alignItems]=\"constHtmlJustifyLabel\">\n @if (step().label && constHtmlPositionLabel === 'top') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex mb-[4px]'\">\n {{ step().label }}\n </div>\n }\n <div [class]=\"(step().classIncludeStep || '') + ' process-bar-step flex items-center libs-ui-border-general'\"\n [class.mr-[4px]]=\"!$last\" [style.width]=\"width()\" [style.height]=\"height()\"\n [style.backgroundColor]=\"constHtmlCurrentProcessBackground || constHtmlActiveBackground\"\n [style.borderRadius]=\"radius()\" [style.justifyContent]=\"constHtmlJustifyLabel\">\n @if (step().label && constHtmlPositionLabel === 'inner') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex'\">\n {{ step().label }}\n </div>\n }\n </div>\n @if (step().label && constHtmlPositionLabel === 'bottom') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex mt-[4px]'\">\n {{ step().label }}\n </div>\n }\n </div>\n }\n}\n</div>\n", styles: [".libs-ui-process-bar-steps{display:flex;flex-shrink:0}\n"] }]
|
|
17
31
|
}] });
|
|
18
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
32
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvY2Vzcy1iYXItc3RlcHMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL3Byb2Nlc3MtYmFyL3N0ZXBzL3NyYy9wcm9jZXNzLWJhci1zdGVwcy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvcHJvY2Vzcy1iYXIvc3RlcHMvc3JjL3Byb2Nlc3MtYmFyLXN0ZXBzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFrQixNQUFNLGVBQWUsQ0FBQztBQUVwSCxPQUFPLEVBQUUsNkNBQTZDLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQzs7QUFTL0UsTUFBTSxPQUFPLHdDQUF3QztJQUN6QyxLQUFLLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQyxTQUFTLElBQUksSUFBSSxDQUFDLHVCQUF1QixFQUFFLFNBQVMsSUFBSSxNQUFNLENBQUMsQ0FBQztJQUNyRyxNQUFNLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQyxVQUFVLElBQUksSUFBSSxDQUFDLHVCQUF1QixFQUFFLFVBQVUsSUFBSSxNQUFNLENBQUMsQ0FBQztJQUN4RyxlQUFlLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQyxtQkFBbUIsSUFBSSxJQUFJLENBQUMsdUJBQXVCLEVBQUUsbUJBQW1CLElBQUksU0FBUyxDQUFDLENBQUM7SUFDdEksTUFBTSxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxHQUFHLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQyxVQUFVLElBQUksSUFBSSxDQUFDLHVCQUF1QixFQUFFLFVBQVUsSUFBSSxFQUFFLElBQUksQ0FBQyxDQUFDO0lBQzNHLFdBQVcsR0FBRyxRQUFRLENBQWdFLEdBQUcsRUFBRTtRQUNuRyxNQUFNLFlBQVksR0FBRyxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUMsWUFBWSxFQUFFLEVBQUUsQ0FBQztRQUNwRCxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUM7WUFDbEIsT0FBTyxFQUFFLENBQUM7UUFDWixDQUFDO1FBQ0QsT0FBTyxLQUFLLENBQUMsSUFBSSxDQUFDLEVBQUUsTUFBTSxFQUFFLFlBQVksQ0FBQyxTQUFTLEVBQUUsRUFBRSxDQUFDLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRTtZQUNqRSxPQUFPLE1BQU0sQ0FBQztnQkFDWixnQkFBZ0IsRUFBRSxLQUFLLEtBQUssWUFBWSxDQUFDLFdBQVc7Z0JBQ3BELGdCQUFnQixFQUFFLEtBQUssR0FBRyxZQUFZLENBQUMsV0FBVztnQkFDbEQsbUJBQW1CLEVBQUUsWUFBWSxDQUFDLGdCQUFnQjtnQkFDbEQsa0JBQWtCLEVBQUUsWUFBWSxDQUFDLGtCQUFrQjthQUNwRCxDQUFDLENBQUM7UUFDTCxDQUFDLENBQUMsQ0FBQztJQUNMLENBQUMsQ0FBQyxDQUFDO0lBRU0sTUFBTSxHQUFHLEtBQUssQ0FBQyxRQUFRLEVBQWtDLENBQUM7SUFFbEQsdUJBQXVCLEdBQUcsTUFBTSxDQUFpQyw2Q0FBNkMsRUFBRSxFQUFFLFFBQVEsRUFBRSxJQUFJLEVBQUUsQ0FBQyxDQUFDO3dHQXRCMUksd0NBQXdDOzRGQUF4Qyx3Q0FBd0Msc09DWHJELHU4REFtQ0E7OzRGRHhCYSx3Q0FBd0M7a0JBUnBELFNBQVM7K0JBRUUsc0NBQXNDLGNBQ3BDLElBQUksbUJBR0MsdUJBQXVCLENBQUMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGNvbXB1dGVkLCBpbmplY3QsIGlucHV0LCBzaWduYWwsIFdyaXRhYmxlU2lnbmFsIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBJUHJvY2Vzc0JhclN0ZXBBZHZhbmNlZENvbmZpZ0ludGVyZmFjZSwgSVByb2Nlc3NCYXJTdGVwQ29uZmlnSW50ZXJmYWNlIH0gZnJvbSAnLi9wcm9jZXNzLWJhci1zdGVwLmludGVyZmFjZSc7XG5pbXBvcnQgeyBQUk9DRVNTX0JBUl9TVEVQU19DT05GSUdfREVGQVVMVF9UT0tFTl9JTkpFQ1QgfSBmcm9tICdAbGlicy11aS91dGlscyc7XG5AQ29tcG9uZW50KHtcbiAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEBhbmd1bGFyLWVzbGludC9jb21wb25lbnQtc2VsZWN0b3JcbiAgc2VsZWN0b3I6ICdsaWJzX3VpLWNvbXBvbmVudHMtcHJvY2Vzc19iYXItc3RlcHMnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICB0ZW1wbGF0ZVVybDogJy4vcHJvY2Vzcy1iYXItc3RlcHMuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vcHJvY2Vzcy1iYXItc3RlcHMuY29tcG9uZW50LmNzcycsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoXG59KVxuZXhwb3J0IGNsYXNzIExpYnNVaUNvbXBvbmVudHNQcm9jZXNzQmFyU3RlcHNDb21wb25lbnQge1xuICBwcm90ZWN0ZWQgd2lkdGggPSBjb21wdXRlZCgoKSA9PiB0aGlzLmNvbmZpZygpLndpZHRoU3RlcCA/PyB0aGlzLnByb2Nlc3NCYXJDb25maWdEZWZhdWx0Py53aWR0aFN0ZXAgPz8gJzgwcHgnKTtcbiAgcHJvdGVjdGVkIGhlaWdodCA9IGNvbXB1dGVkKCgpID0+IHRoaXMuY29uZmlnKCkuaGVpZ2h0U3RlcCA/PyB0aGlzLnByb2Nlc3NCYXJDb25maWdEZWZhdWx0Py5oZWlnaHRTdGVwID8/ICcxMnB4Jyk7XG4gIHByb3RlY3RlZCBiYWNrZ3JvdW5kQ29sb3IgPSBjb21wdXRlZCgoKSA9PiB0aGlzLmNvbmZpZygpLmJhY2tncm91bmRDb2xvclN0ZXAgPz8gdGhpcy5wcm9jZXNzQmFyQ29uZmlnRGVmYXVsdD8uYmFja2dyb3VuZENvbG9yU3RlcCA/PyAnI0Y4RjlGQScpO1xuICBwcm90ZWN0ZWQgcmFkaXVzID0gY29tcHV0ZWQoKCkgPT4gYCR7dGhpcy5jb25maWcoKS5yYWRpdXNTdGVwID8/IHRoaXMucHJvY2Vzc0JhckNvbmZpZ0RlZmF1bHQ/LnJhZGl1c1N0ZXAgPz8gMjB9cHhgKTtcbiAgcHJvdGVjdGVkIHNpbXBsZVN0ZXBzID0gY29tcHV0ZWQ8QXJyYXk8V3JpdGFibGVTaWduYWw8SVByb2Nlc3NCYXJTdGVwQWR2YW5jZWRDb25maWdJbnRlcmZhY2U+Pj4oKCkgPT4ge1xuICAgIGNvbnN0IHNpbXBsZUNvbmZpZyA9IHRoaXMuY29uZmlnKCkuc2ltcGxlQ29uZmlnPy4oKTtcbiAgICBpZiAoIXNpbXBsZUNvbmZpZykge1xuICAgICAgcmV0dXJuIFtdO1xuICAgIH1cbiAgICByZXR1cm4gQXJyYXkuZnJvbSh7IGxlbmd0aDogc2ltcGxlQ29uZmlnLnRvdGFsU3RlcCB9LCAoXywgaW5kZXgpID0+IHtcbiAgICAgIHJldHVybiBzaWduYWwoe1xuICAgICAgICBpc0N1cnJlbnRQcm9jZXNzOiBpbmRleCA9PT0gc2ltcGxlQ29uZmlnLmN1cnJlbnRTdGVwLFxuICAgICAgICBwcm9jZXNzQ29tcGxldGVkOiBpbmRleCA8IHNpbXBsZUNvbmZpZy5jdXJyZW50U3RlcCxcbiAgICAgICAgY3VycmVudFByb2Nlc3NDb2xvcjogc2ltcGxlQ29uZmlnLmN1cnJlbnRTdGVwQ29sb3IsXG4gICAgICAgIHN0ZXBDb21wbGV0ZWRDb2xvcjogc2ltcGxlQ29uZmlnLnN0ZXBDb21wbGV0ZWRDb2xvcixcbiAgICAgIH0pO1xuICAgIH0pO1xuICB9KTtcblxuICByZWFkb25seSBjb25maWcgPSBpbnB1dC5yZXF1aXJlZDxJUHJvY2Vzc0JhclN0ZXBDb25maWdJbnRlcmZhY2U+KCk7XG5cbiAgcHJpdmF0ZSByZWFkb25seSBwcm9jZXNzQmFyQ29uZmlnRGVmYXVsdCA9IGluamVjdDxJUHJvY2Vzc0JhclN0ZXBDb25maWdJbnRlcmZhY2U+KFBST0NFU1NfQkFSX1NURVBTX0NPTkZJR19ERUZBVUxUX1RPS0VOX0lOSkVDVCwgeyBvcHRpb25hbDogdHJ1ZSB9KTtcbn1cbiIsIkBsZXQgY29uc3RIdG1sUG9zaXRpb25MYWJlbCA9IGNvbmZpZygpLnBvc2l0aW9uTGFiZWwgfHwgJ3RvcCc7XG5AbGV0IGNvbnN0SHRtbEp1c3RpZnlMYWJlbCA9IGNvbmZpZygpLmp1c3RpZnlMYWJlbCB8fCAnY2VudGVyJztcbkBsZXQgY29uc3RIdG1sU3RlcHM9IGNvbmZpZygpLmFkdmFuY2VkQ29uZmlnPy4oKSB8fCBzaW1wbGVTdGVwcygpO1xuPGRpdiBbY2xhc3NdPVwiKGNvbmZpZygpLmNsYXNzSW5jbHVkZSB8fCAnJykgKyAnIGxpYnMtdWktcHJvY2Vzcy1iYXItc3RlcHMnXCI+XG4gIEBpZiAoY29uc3RIdG1sU3RlcHMpIHtcbiAgICBAZm9yIChzdGVwIG9mIGNvbnN0SHRtbFN0ZXBzOyB0cmFjayBzdGVwKCk7KSB7XG4gICAgICAgIEBsZXQgY29uc3RIdG1sQWN0aXZlQmFja2dyb3VuZCA9IHN0ZXAoKS5wcm9jZXNzQ29tcGxldGVkID8gKHN0ZXAoKS5wcm9jZXNzQ29tcGxldGVkQ29sb3IgfHwgJyMzM0RBOEEnKTogYmFja2dyb3VuZENvbG9yKCk7XG4gICAgIEBsZXQgY29uc3RIdG1sQ3VycmVudFByb2Nlc3NCYWNrZ3JvdW5kID0gc3RlcCgpLmlzQ3VycmVudFByb2Nlc3MgPyAoc3RlcCgpLmN1cnJlbnRQcm9jZXNzQ29sb3IgfHwgJyM0RThDRjcnKSA6ICcnO1xuICAgICA8ZGl2IFtjbGFzc109XCIoc3RlcCgpLmNsYXNzSW5jbHVkZUNvbnRhaW5lciB8fCAnJykgKyAnIGZsZXgnXCJcbiAgICAgW2NsYXNzLmZsZXgtY29sXT1cImNvbnN0SHRtbFBvc2l0aW9uTGFiZWwgPT09ICd0b3AnIHx8IGNvbnN0SHRtbFBvc2l0aW9uTGFiZWwgPT09ICdib3R0b20nXCJcbiAgICAgW3N0eWxlLmFsaWduSXRlbXNdPVwiY29uc3RIdG1sSnVzdGlmeUxhYmVsXCI+XG4gICAgICAgQGlmIChzdGVwKCkubGFiZWwgJiYgY29uc3RIdG1sUG9zaXRpb25MYWJlbCA9PT0gJ3RvcCcpIHtcbiAgICAgICAgICAgIDxkaXYgW2NsYXNzXT1cIihzdGVwKCkuY2xhc3NMYWJlbCB8fCAnJykgKyAnIGxpYnMtdWktZm9udC1oNXIgZmxleCBtYi1bNHB4XSdcIj5cbiAgICAgICAgICAgICAgICB7eyBzdGVwKCkubGFiZWwgfX1cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICB9XG4gICAgICAgIDxkaXYgW2NsYXNzXT1cIihzdGVwKCkuY2xhc3NJbmNsdWRlU3RlcCB8fCAnJykgKyAnIHByb2Nlc3MtYmFyLXN0ZXAgZmxleCBpdGVtcy1jZW50ZXIgbGlicy11aS1ib3JkZXItZ2VuZXJhbCdcIlxuICAgICAgICAgICAgW2NsYXNzLm1yLVs0cHhdXT1cIiEkbGFzdFwiIFtzdHlsZS53aWR0aF09XCJ3aWR0aCgpXCIgW3N0eWxlLmhlaWdodF09XCJoZWlnaHQoKVwiXG4gICAgICAgICAgICBbc3R5bGUuYmFja2dyb3VuZENvbG9yXT1cImNvbnN0SHRtbEN1cnJlbnRQcm9jZXNzQmFja2dyb3VuZCB8fCBjb25zdEh0bWxBY3RpdmVCYWNrZ3JvdW5kXCJcbiAgICAgICAgICAgIFtzdHlsZS5ib3JkZXJSYWRpdXNdPVwicmFkaXVzKClcIiBbc3R5bGUuanVzdGlmeUNvbnRlbnRdPVwiY29uc3RIdG1sSnVzdGlmeUxhYmVsXCI+XG4gICAgICAgICAgICBAaWYgKHN0ZXAoKS5sYWJlbCAmJiBjb25zdEh0bWxQb3NpdGlvbkxhYmVsID09PSAnaW5uZXInKSB7XG4gICAgICAgICAgICAgICAgPGRpdiBbY2xhc3NdPVwiKHN0ZXAoKS5jbGFzc0xhYmVsIHx8ICcnKSArICcgbGlicy11aS1mb250LWg1ciBmbGV4J1wiPlxuICAgICAgICAgICAgICAgICAgICB7eyBzdGVwKCkubGFiZWwgfX1cbiAgICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIH1cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIEBpZiAoc3RlcCgpLmxhYmVsICYmIGNvbnN0SHRtbFBvc2l0aW9uTGFiZWwgPT09ICdib3R0b20nKSB7XG4gICAgICAgICAgICA8ZGl2IFtjbGFzc109XCIoc3RlcCgpLmNsYXNzTGFiZWwgfHwgJycpICsgJyBsaWJzLXVpLWZvbnQtaDVyIGZsZXggbXQtWzRweF0nXCI+XG4gICAgICAgICAgICAgICAge3sgc3RlcCgpLmxhYmVsIH19XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgfVxuICAgICAgICA8L2Rpdj5cbiAgICB9XG59XG48L2Rpdj5cbiJdfQ==
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { computed, input, inject, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
2
|
+
import { computed, signal, input, inject, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
3
|
import { PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT } from '@libs-ui/utils';
|
|
4
4
|
|
|
5
5
|
class LibsUiComponentsProcessBarStepsComponent {
|
|
@@ -7,14 +7,28 @@ class LibsUiComponentsProcessBarStepsComponent {
|
|
|
7
7
|
height = computed(() => this.config().heightStep ?? this.processBarConfigDefault?.heightStep ?? '12px');
|
|
8
8
|
backgroundColor = computed(() => this.config().backgroundColorStep ?? this.processBarConfigDefault?.backgroundColorStep ?? '#F8F9FA');
|
|
9
9
|
radius = computed(() => `${this.config().radiusStep ?? this.processBarConfigDefault?.radiusStep ?? 20}px`);
|
|
10
|
+
simpleSteps = computed(() => {
|
|
11
|
+
const simpleConfig = this.config().simpleConfig?.();
|
|
12
|
+
if (!simpleConfig) {
|
|
13
|
+
return [];
|
|
14
|
+
}
|
|
15
|
+
return Array.from({ length: simpleConfig.totalStep }, (_, index) => {
|
|
16
|
+
return signal({
|
|
17
|
+
isCurrentProcess: index === simpleConfig.currentStep,
|
|
18
|
+
processCompleted: index < simpleConfig.currentStep,
|
|
19
|
+
currentProcessColor: simpleConfig.currentStepColor,
|
|
20
|
+
stepCompletedColor: simpleConfig.stepCompletedColor,
|
|
21
|
+
});
|
|
22
|
+
});
|
|
23
|
+
});
|
|
10
24
|
config = input.required();
|
|
11
25
|
processBarConfigDefault = inject(PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT, { optional: true });
|
|
12
26
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsProcessBarStepsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsProcessBarStepsComponent, isStandalone: true, selector: "libs_ui-components-process_bar-steps", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@let constHtmlPositionLabel = config().positionLabel || 'top';\n@let constHtmlJustifyLabel = config().justifyLabel || 'center';\n<div [class]=\"(config().classInclude || '') + ' libs-ui-process-bar-steps'\">\n @for (step of
|
|
27
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsProcessBarStepsComponent, isStandalone: true, selector: "libs_ui-components-process_bar-steps", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@let constHtmlPositionLabel = config().positionLabel || 'top';\n@let constHtmlJustifyLabel = config().justifyLabel || 'center';\n@let constHtmlSteps= config().advancedConfig?.() || simpleSteps();\n<div [class]=\"(config().classInclude || '') + ' libs-ui-process-bar-steps'\">\n @if (constHtmlSteps) {\n @for (step of constHtmlSteps; track step();) {\n @let constHtmlActiveBackground = step().processCompleted ? (step().processCompletedColor || '#33DA8A'): backgroundColor();\n @let constHtmlCurrentProcessBackground = step().isCurrentProcess ? (step().currentProcessColor || '#4E8CF7') : '';\n <div [class]=\"(step().classIncludeContainer || '') + ' flex'\"\n [class.flex-col]=\"constHtmlPositionLabel === 'top' || constHtmlPositionLabel === 'bottom'\"\n [style.alignItems]=\"constHtmlJustifyLabel\">\n @if (step().label && constHtmlPositionLabel === 'top') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex mb-[4px]'\">\n {{ step().label }}\n </div>\n }\n <div [class]=\"(step().classIncludeStep || '') + ' process-bar-step flex items-center libs-ui-border-general'\"\n [class.mr-[4px]]=\"!$last\" [style.width]=\"width()\" [style.height]=\"height()\"\n [style.backgroundColor]=\"constHtmlCurrentProcessBackground || constHtmlActiveBackground\"\n [style.borderRadius]=\"radius()\" [style.justifyContent]=\"constHtmlJustifyLabel\">\n @if (step().label && constHtmlPositionLabel === 'inner') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex'\">\n {{ step().label }}\n </div>\n }\n </div>\n @if (step().label && constHtmlPositionLabel === 'bottom') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex mt-[4px]'\">\n {{ step().label }}\n </div>\n }\n </div>\n }\n}\n</div>\n", styles: [".libs-ui-process-bar-steps{display:flex;flex-shrink:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
14
28
|
}
|
|
15
29
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsProcessBarStepsComponent, decorators: [{
|
|
16
30
|
type: Component,
|
|
17
|
-
args: [{ selector: 'libs_ui-components-process_bar-steps', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@let constHtmlPositionLabel = config().positionLabel || 'top';\n@let constHtmlJustifyLabel = config().justifyLabel || 'center';\n<div [class]=\"(config().classInclude || '') + ' libs-ui-process-bar-steps'\">\n @for (step of
|
|
31
|
+
args: [{ selector: 'libs_ui-components-process_bar-steps', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@let constHtmlPositionLabel = config().positionLabel || 'top';\n@let constHtmlJustifyLabel = config().justifyLabel || 'center';\n@let constHtmlSteps= config().advancedConfig?.() || simpleSteps();\n<div [class]=\"(config().classInclude || '') + ' libs-ui-process-bar-steps'\">\n @if (constHtmlSteps) {\n @for (step of constHtmlSteps; track step();) {\n @let constHtmlActiveBackground = step().processCompleted ? (step().processCompletedColor || '#33DA8A'): backgroundColor();\n @let constHtmlCurrentProcessBackground = step().isCurrentProcess ? (step().currentProcessColor || '#4E8CF7') : '';\n <div [class]=\"(step().classIncludeContainer || '') + ' flex'\"\n [class.flex-col]=\"constHtmlPositionLabel === 'top' || constHtmlPositionLabel === 'bottom'\"\n [style.alignItems]=\"constHtmlJustifyLabel\">\n @if (step().label && constHtmlPositionLabel === 'top') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex mb-[4px]'\">\n {{ step().label }}\n </div>\n }\n <div [class]=\"(step().classIncludeStep || '') + ' process-bar-step flex items-center libs-ui-border-general'\"\n [class.mr-[4px]]=\"!$last\" [style.width]=\"width()\" [style.height]=\"height()\"\n [style.backgroundColor]=\"constHtmlCurrentProcessBackground || constHtmlActiveBackground\"\n [style.borderRadius]=\"radius()\" [style.justifyContent]=\"constHtmlJustifyLabel\">\n @if (step().label && constHtmlPositionLabel === 'inner') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex'\">\n {{ step().label }}\n </div>\n }\n </div>\n @if (step().label && constHtmlPositionLabel === 'bottom') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex mt-[4px]'\">\n {{ step().label }}\n </div>\n }\n </div>\n }\n}\n</div>\n", styles: [".libs-ui-process-bar-steps{display:flex;flex-shrink:0}\n"] }]
|
|
18
32
|
}] });
|
|
19
33
|
|
|
20
34
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"libs-ui-components-process-bar-steps.mjs","sources":["../../../../../../libs-ui/components/process-bar/steps/src/process-bar-steps.component.ts","../../../../../../libs-ui/components/process-bar/steps/src/process-bar-steps.component.html","../../../../../../libs-ui/components/process-bar/steps/src/libs-ui-components-process-bar-steps.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';\nimport { IProcessBarStepConfigInterface } from './process-bar-step.interface';\nimport { PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT } from '@libs-ui/utils';\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'libs_ui-components-process_bar-steps',\n standalone: true,\n templateUrl: './process-bar-steps.component.html',\n styleUrl: './process-bar-steps.component.css',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class LibsUiComponentsProcessBarStepsComponent {\n protected width = computed(() => this.config().widthStep ?? this.processBarConfigDefault?.widthStep ?? '80px');\n protected height = computed(() => this.config().heightStep ?? this.processBarConfigDefault?.heightStep ?? '12px');\n protected backgroundColor = computed(() => this.config().backgroundColorStep ?? this.processBarConfigDefault?.backgroundColorStep ?? '#F8F9FA');\n protected radius = computed(() => `${this.config().radiusStep ?? this.processBarConfigDefault?.radiusStep ?? 20}px`);\n\n readonly config = input.required<IProcessBarStepConfigInterface>();\n\n private readonly processBarConfigDefault = inject<IProcessBarStepConfigInterface>(PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT, { optional: true });\n}\n","@let constHtmlPositionLabel = config().positionLabel || 'top';\n@let constHtmlJustifyLabel = config().justifyLabel || 'center';\n<div [class]=\"(config().classInclude || '') + ' libs-ui-process-bar-steps'\">\n @for (step of
|
|
1
|
+
{"version":3,"file":"libs-ui-components-process-bar-steps.mjs","sources":["../../../../../../libs-ui/components/process-bar/steps/src/process-bar-steps.component.ts","../../../../../../libs-ui/components/process-bar/steps/src/process-bar-steps.component.html","../../../../../../libs-ui/components/process-bar/steps/src/libs-ui-components-process-bar-steps.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, inject, input, signal, WritableSignal } from '@angular/core';\nimport { IProcessBarStepAdvancedConfigInterface, IProcessBarStepConfigInterface } from './process-bar-step.interface';\nimport { PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT } from '@libs-ui/utils';\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'libs_ui-components-process_bar-steps',\n standalone: true,\n templateUrl: './process-bar-steps.component.html',\n styleUrl: './process-bar-steps.component.css',\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class LibsUiComponentsProcessBarStepsComponent {\n protected width = computed(() => this.config().widthStep ?? this.processBarConfigDefault?.widthStep ?? '80px');\n protected height = computed(() => this.config().heightStep ?? this.processBarConfigDefault?.heightStep ?? '12px');\n protected backgroundColor = computed(() => this.config().backgroundColorStep ?? this.processBarConfigDefault?.backgroundColorStep ?? '#F8F9FA');\n protected radius = computed(() => `${this.config().radiusStep ?? this.processBarConfigDefault?.radiusStep ?? 20}px`);\n protected simpleSteps = computed<Array<WritableSignal<IProcessBarStepAdvancedConfigInterface>>>(() => {\n const simpleConfig = this.config().simpleConfig?.();\n if (!simpleConfig) {\n return [];\n }\n return Array.from({ length: simpleConfig.totalStep }, (_, index) => {\n return signal({\n isCurrentProcess: index === simpleConfig.currentStep,\n processCompleted: index < simpleConfig.currentStep,\n currentProcessColor: simpleConfig.currentStepColor,\n stepCompletedColor: simpleConfig.stepCompletedColor,\n });\n });\n });\n\n readonly config = input.required<IProcessBarStepConfigInterface>();\n\n private readonly processBarConfigDefault = inject<IProcessBarStepConfigInterface>(PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT, { optional: true });\n}\n","@let constHtmlPositionLabel = config().positionLabel || 'top';\n@let constHtmlJustifyLabel = config().justifyLabel || 'center';\n@let constHtmlSteps= config().advancedConfig?.() || simpleSteps();\n<div [class]=\"(config().classInclude || '') + ' libs-ui-process-bar-steps'\">\n @if (constHtmlSteps) {\n @for (step of constHtmlSteps; track step();) {\n @let constHtmlActiveBackground = step().processCompleted ? (step().processCompletedColor || '#33DA8A'): backgroundColor();\n @let constHtmlCurrentProcessBackground = step().isCurrentProcess ? (step().currentProcessColor || '#4E8CF7') : '';\n <div [class]=\"(step().classIncludeContainer || '') + ' flex'\"\n [class.flex-col]=\"constHtmlPositionLabel === 'top' || constHtmlPositionLabel === 'bottom'\"\n [style.alignItems]=\"constHtmlJustifyLabel\">\n @if (step().label && constHtmlPositionLabel === 'top') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex mb-[4px]'\">\n {{ step().label }}\n </div>\n }\n <div [class]=\"(step().classIncludeStep || '') + ' process-bar-step flex items-center libs-ui-border-general'\"\n [class.mr-[4px]]=\"!$last\" [style.width]=\"width()\" [style.height]=\"height()\"\n [style.backgroundColor]=\"constHtmlCurrentProcessBackground || constHtmlActiveBackground\"\n [style.borderRadius]=\"radius()\" [style.justifyContent]=\"constHtmlJustifyLabel\">\n @if (step().label && constHtmlPositionLabel === 'inner') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex'\">\n {{ step().label }}\n </div>\n }\n </div>\n @if (step().label && constHtmlPositionLabel === 'bottom') {\n <div [class]=\"(step().classLabel || '') + ' libs-ui-font-h5r flex mt-[4px]'\">\n {{ step().label }}\n </div>\n }\n </div>\n }\n}\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;MAWa,wCAAwC,CAAA;IACzC,KAAK,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,MAAM,EAAE,CAAC,SAAS,IAAI,IAAI,CAAC,uBAAuB,EAAE,SAAS,IAAI,MAAM,CAAC;IACpG,MAAM,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,MAAM,EAAE,CAAC,UAAU,IAAI,IAAI,CAAC,uBAAuB,EAAE,UAAU,IAAI,MAAM,CAAC;IACvG,eAAe,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,MAAM,EAAE,CAAC,mBAAmB,IAAI,IAAI,CAAC,uBAAuB,EAAE,mBAAmB,IAAI,SAAS,CAAC;IACrI,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAA,EAAG,IAAI,CAAC,MAAM,EAAE,CAAC,UAAU,IAAI,IAAI,CAAC,uBAAuB,EAAE,UAAU,IAAI,EAAE,CAAI,EAAA,CAAA,CAAC;AAC1G,IAAA,WAAW,GAAG,QAAQ,CAAgE,MAAK;QACnG,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,YAAY,IAAI;QACnD,IAAI,CAAC,YAAY,EAAE;AACjB,YAAA,OAAO,EAAE;;AAEX,QAAA,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,YAAY,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,KAAI;AACjE,YAAA,OAAO,MAAM,CAAC;AACZ,gBAAA,gBAAgB,EAAE,KAAK,KAAK,YAAY,CAAC,WAAW;AACpD,gBAAA,gBAAgB,EAAE,KAAK,GAAG,YAAY,CAAC,WAAW;gBAClD,mBAAmB,EAAE,YAAY,CAAC,gBAAgB;gBAClD,kBAAkB,EAAE,YAAY,CAAC,kBAAkB;AACpD,aAAA,CAAC;AACJ,SAAC,CAAC;AACJ,KAAC,CAAC;AAEO,IAAA,MAAM,GAAG,KAAK,CAAC,QAAQ,EAAkC;IAEjD,uBAAuB,GAAG,MAAM,CAAiC,6CAA6C,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;wGAtBzI,wCAAwC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAxC,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,wCAAwC,sOCXrD,u8DAmCA,EAAA,MAAA,EAAA,CAAA,0DAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;4FDxBa,wCAAwC,EAAA,UAAA,EAAA,CAAA;kBARpD,SAAS;AAEE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,sCAAsC,EACpC,UAAA,EAAA,IAAI,EAGC,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,u8DAAA,EAAA,MAAA,EAAA,CAAA,0DAAA,CAAA,EAAA;;;AETjD;;AAEG;;;;"}
|
package/package.json
CHANGED
|
@@ -7,10 +7,10 @@ export interface IProcessBarStepConfigInterface {
|
|
|
7
7
|
classInclude?: string;
|
|
8
8
|
backgroundColorStep?: string;
|
|
9
9
|
radiusStep?: number;
|
|
10
|
-
|
|
11
|
-
|
|
10
|
+
simpleConfig?: WritableSignal<IProcessBarStepSimpleConfigInterface>;
|
|
11
|
+
advancedConfig?: WritableSignal<Array<WritableSignal<IProcessBarStepAdvancedConfigInterface>>>;
|
|
12
12
|
}
|
|
13
|
-
export interface
|
|
13
|
+
export interface IProcessBarStepAdvancedConfigInterface {
|
|
14
14
|
classIncludeContainer?: string;
|
|
15
15
|
classIncludeStep?: string;
|
|
16
16
|
processCompleted?: boolean;
|
|
@@ -19,5 +19,10 @@ export interface IProcessBarStepInterface {
|
|
|
19
19
|
currentProcessColor?: string;
|
|
20
20
|
label?: string;
|
|
21
21
|
classLabel?: string;
|
|
22
|
-
|
|
22
|
+
}
|
|
23
|
+
export interface IProcessBarStepSimpleConfigInterface {
|
|
24
|
+
totalStep: number;
|
|
25
|
+
currentStep: number;
|
|
26
|
+
currentStepColor: string;
|
|
27
|
+
stepCompletedColor: string;
|
|
23
28
|
}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { WritableSignal } from '@angular/core';
|
|
2
|
+
import { IProcessBarStepAdvancedConfigInterface, IProcessBarStepConfigInterface } from './process-bar-step.interface';
|
|
2
3
|
import * as i0 from "@angular/core";
|
|
3
4
|
export declare class LibsUiComponentsProcessBarStepsComponent {
|
|
4
5
|
protected width: import("@angular/core").Signal<string>;
|
|
5
6
|
protected height: import("@angular/core").Signal<string>;
|
|
6
7
|
protected backgroundColor: import("@angular/core").Signal<string>;
|
|
7
8
|
protected radius: import("@angular/core").Signal<string>;
|
|
9
|
+
protected simpleSteps: import("@angular/core").Signal<WritableSignal<IProcessBarStepAdvancedConfigInterface>[]>;
|
|
8
10
|
readonly config: import("@angular/core").InputSignal<IProcessBarStepConfigInterface>;
|
|
9
11
|
private readonly processBarConfigDefault;
|
|
10
12
|
static ɵfac: i0.ɵɵFactoryDeclaration<LibsUiComponentsProcessBarStepsComponent, never>;
|