@ascentgl/ads-ui 21.131.0 → 21.133.0
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.
|
@@ -11614,7 +11614,7 @@ class AdsShipmentHistoryStepperComponent {
|
|
|
11614
11614
|
}
|
|
11615
11615
|
return items;
|
|
11616
11616
|
}, ...(ngDevMode ? [{ debugName: "listItems" }] : []));
|
|
11617
|
-
this.registry.register([adsIconPencil, adsIconFileAdd,
|
|
11617
|
+
this.registry.register([adsIconPencil, adsIconFileAdd, adsIconCanceledShipment]);
|
|
11618
11618
|
}
|
|
11619
11619
|
/** @ignore */
|
|
11620
11620
|
trackItem(_index, item) {
|
|
@@ -11630,9 +11630,8 @@ class AdsShipmentHistoryStepperComponent {
|
|
|
11630
11630
|
case ShipmentHistoryAction.Created:
|
|
11631
11631
|
case ShipmentHistoryAction.Added:
|
|
11632
11632
|
return 'file_add';
|
|
11633
|
-
case ShipmentHistoryAction.Removed:
|
|
11634
|
-
return 'cross';
|
|
11635
11633
|
case ShipmentHistoryAction.Cancelled:
|
|
11634
|
+
case ShipmentHistoryAction.Removed:
|
|
11636
11635
|
return 'canceled_shipment';
|
|
11637
11636
|
case ShipmentHistoryAction.Edited:
|
|
11638
11637
|
default:
|
|
@@ -11640,11 +11639,11 @@ class AdsShipmentHistoryStepperComponent {
|
|
|
11640
11639
|
}
|
|
11641
11640
|
}
|
|
11642
11641
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsShipmentHistoryStepperComponent, deps: [{ token: i1.AdsIconRegistry }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11643
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsShipmentHistoryStepperComponent, isStandalone: false, selector: "ads-shipment-history-stepper", inputs: { groups: { classPropertyName: "groups", publicName: "groups", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<cdk-virtual-scroll-viewport [itemSize]=\"ITEM_HEIGHT\" class=\"stepper-viewport\">\n <div *cdkVirtualFor=\"let item of listItems(); trackBy: trackItem\" class=\"list-item\">\n @if (item.dateHeader) {\n <div class=\"date-separator\" role=\"separator\" [attr.aria-label]=\"item.dateHeader\">\n <span class=\"date-label\">{{ item.dateHeader }}</span>\n </div>\n }\n\n <div class=\"history-event\">\n <div class=\"event-indicator-column\" aria-hidden=\"true\">\n <div class=\"event-indicator\">\n <div class=\"indicator-bubble\">\n <ads-icon [name]=\"resolveIconName(item.event.action)\" theme=\"light\" stroke=\"light\" size=\"xxxs\" />\n </div>\n </div>\n @if (!item.isLast) {\n <div class=\"event-connector\"></div>\n }\n </div>\n\n <div class=\"event-content\">\n <div class=\"event-header\">\n <span class=\"event-action\">{{ item.event.action }}</span>\n @if (item.event.contextTag) {\n <ads-tag\n [id]=\"'history-tag-' + item.event.contextTag.label\"\n [tag]=\"item.event.contextTag.label\"\n [color]=\"resolveTagColor(item.event.contextTag.color)\"\n [textColor]=\"'white'\"\n [removable]=\"false\"\n />\n }\n @if (item.event.fieldName) {\n <span class=\"event-field-name\">{{ item.event.fieldName }}</span>\n }\n </div>\n\n @if (item.event.oldValue || item.event.newValue) {\n <div class=\"event-value\">\n @if (item.event.oldValue) {\n <span class=\"old-value\">{{ item.event.oldValue }}</span>\n @if (item.event.action !== ShipmentHistoryAction.Removed) {\n <span class=\"value-arrow\" aria-hidden=\"true\">\u2192</span>\n }\n }\n @if (item.event.newValue) {\n <span class=\"new-value\">{{ item.event.newValue }}</span>\n }\n </div>\n }\n\n <div class=\"event-meta\">\n <span class=\"meta-time\">{{ item.event.time }}</span>\n @if (item.event.user) {\n <div class=\"meta-separator\" aria-hidden=\"true\"></div>\n <span class=\"meta-user\">{{ item.event.user }}</span>\n }\n </div>\n </div>\n </div>\n </div>\n</cdk-virtual-scroll-viewport>\n", styles: [":host{display:block;height:100%}.stepper-viewport{height:100%;width:100%}.list-item{display:flex;flex-direction:column;width:100%}.date-separator{display:flex;align-items:center;gap:16px;padding:8px 0;color:var(--color-medium);font-size:14px;line-height:18px}.date-separator:before,.date-separator:after{content:\"\";flex:1;height:1px;background-color:var(--color-muted)}.history-event{display:flex;gap:8px;align-items:stretch;min-width:0}.event-indicator-column{display:flex;flex-direction:column;align-items:center;flex-shrink:0;width:20px}.event-indicator{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:22px;height:22px}.indicator-bubble{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;border:3px solid var(--color-light);background-color:
|
|
11642
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsShipmentHistoryStepperComponent, isStandalone: false, selector: "ads-shipment-history-stepper", inputs: { groups: { classPropertyName: "groups", publicName: "groups", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<cdk-virtual-scroll-viewport [itemSize]=\"ITEM_HEIGHT\" class=\"stepper-viewport\">\n <div *cdkVirtualFor=\"let item of listItems(); trackBy: trackItem\" class=\"list-item\">\n @if (item.dateHeader) {\n <div class=\"date-separator\" role=\"separator\" [attr.aria-label]=\"item.dateHeader\">\n <span class=\"date-label\">{{ item.dateHeader }}</span>\n </div>\n }\n\n <div class=\"history-event\">\n <div class=\"event-indicator-column\" aria-hidden=\"true\">\n <div class=\"event-indicator\">\n <div class=\"indicator-bubble\">\n <ads-icon [name]=\"resolveIconName(item.event.action)\" theme=\"light\" stroke=\"light\" size=\"xxxs\" />\n </div>\n </div>\n @if (!item.isLast) {\n <div class=\"event-connector\"></div>\n }\n </div>\n\n <div class=\"event-content\">\n <div class=\"event-header\">\n <span class=\"event-action\">{{ item.event.actionLabel ?? item.event.action }}</span>\n @if (item.event.contextTag) {\n <ads-tag\n [id]=\"'history-tag-' + item.event.contextTag.label\"\n [tag]=\"item.event.contextTag.label\"\n [color]=\"resolveTagColor(item.event.contextTag.color)\"\n [textColor]=\"'white'\"\n [removable]=\"false\"\n />\n }\n @if (item.event.fieldName) {\n <span class=\"event-field-name\">{{ item.event.fieldName }}</span>\n }\n </div>\n\n @if (item.event.oldValue || item.event.newValue) {\n <div class=\"event-value\">\n @if (item.event.oldValue) {\n <span class=\"old-value\">{{ item.event.oldValue }}</span>\n @if (item.event.action !== ShipmentHistoryAction.Removed) {\n <span class=\"value-arrow\" aria-hidden=\"true\">\u2192</span>\n }\n }\n @if (item.event.newValue) {\n <span class=\"new-value\">{{ item.event.newValue }}</span>\n }\n </div>\n }\n\n <div class=\"event-meta\">\n <span class=\"meta-time\">{{ item.event.time }}</span>\n @if (item.event.user) {\n <div class=\"meta-separator\" aria-hidden=\"true\"></div>\n <span class=\"meta-user\">{{ item.event.user }}</span>\n }\n </div>\n </div>\n </div>\n </div>\n</cdk-virtual-scroll-viewport>\n", styles: [":host{display:block;height:100%}.stepper-viewport{height:100%;width:100%}.list-item{display:flex;flex-direction:column;width:100%}.date-separator{display:flex;align-items:center;gap:16px;padding:8px 0;color:var(--color-medium);font-size:14px;line-height:18px}.date-separator:before,.date-separator:after{content:\"\";flex:1;height:1px;background-color:var(--color-muted)}.history-event{display:flex;gap:8px;align-items:stretch;min-width:0}.event-indicator-column{display:flex;flex-direction:column;align-items:center;flex-shrink:0;width:20px}.event-indicator{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:22px;height:22px}.indicator-bubble{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;border:3px solid var(--color-light);background-color:transparent;box-sizing:border-box;flex-shrink:0}.indicator-bubble ::ng-deep ads-icon{width:10px!important;height:10px!important}.indicator-bubble ::ng-deep ads-icon svg{width:10px!important;height:10px!important}.event-connector{flex:1;width:4px;background-color:var(--color-light);min-height:86px;margin:4px 0;border-radius:80px}.event-content{display:flex;flex-direction:column;gap:8px;min-width:0;flex:1;padding-bottom:16px}.event-header{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.event-action{color:var(--color-dark);font-size:16px;font-weight:600;line-height:21px}.event-field-name{color:var(--color-dark);font-size:16px;font-weight:400;line-height:21px}.event-value{display:flex;align-items:center;flex-wrap:wrap;gap:4px;font-size:16px;line-height:21px}.old-value{color:var(--color-medium);text-decoration:line-through}.value-arrow{color:var(--color-medium)}.new-value{color:var(--color-dark)}.event-meta{display:flex;align-items:center;gap:6px;color:var(--color-medium);font-size:14px;line-height:18px}.meta-separator{width:3px;height:3px;border-radius:50%;background-color:var(--color-medium);flex-shrink:0}\n"], dependencies: [{ kind: "directive", type: i2$1.ɵɵCdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2$1.ɵɵCdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2$1.ɵɵCdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: AdsTagComponent, selector: "ads-tag", inputs: ["color", "borderColor", "borderWidth", "width", "id", "removable", "textColor", "clickable", "tag"], outputs: ["remove", "selected"] }] }); }
|
|
11644
11643
|
}
|
|
11645
11644
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsShipmentHistoryStepperComponent, decorators: [{
|
|
11646
11645
|
type: Component,
|
|
11647
|
-
args: [{ selector: 'ads-shipment-history-stepper', standalone: false, template: "<cdk-virtual-scroll-viewport [itemSize]=\"ITEM_HEIGHT\" class=\"stepper-viewport\">\n <div *cdkVirtualFor=\"let item of listItems(); trackBy: trackItem\" class=\"list-item\">\n @if (item.dateHeader) {\n <div class=\"date-separator\" role=\"separator\" [attr.aria-label]=\"item.dateHeader\">\n <span class=\"date-label\">{{ item.dateHeader }}</span>\n </div>\n }\n\n <div class=\"history-event\">\n <div class=\"event-indicator-column\" aria-hidden=\"true\">\n <div class=\"event-indicator\">\n <div class=\"indicator-bubble\">\n <ads-icon [name]=\"resolveIconName(item.event.action)\" theme=\"light\" stroke=\"light\" size=\"xxxs\" />\n </div>\n </div>\n @if (!item.isLast) {\n <div class=\"event-connector\"></div>\n }\n </div>\n\n <div class=\"event-content\">\n <div class=\"event-header\">\n <span class=\"event-action\">{{ item.event.action }}</span>\n @if (item.event.contextTag) {\n <ads-tag\n [id]=\"'history-tag-' + item.event.contextTag.label\"\n [tag]=\"item.event.contextTag.label\"\n [color]=\"resolveTagColor(item.event.contextTag.color)\"\n [textColor]=\"'white'\"\n [removable]=\"false\"\n />\n }\n @if (item.event.fieldName) {\n <span class=\"event-field-name\">{{ item.event.fieldName }}</span>\n }\n </div>\n\n @if (item.event.oldValue || item.event.newValue) {\n <div class=\"event-value\">\n @if (item.event.oldValue) {\n <span class=\"old-value\">{{ item.event.oldValue }}</span>\n @if (item.event.action !== ShipmentHistoryAction.Removed) {\n <span class=\"value-arrow\" aria-hidden=\"true\">\u2192</span>\n }\n }\n @if (item.event.newValue) {\n <span class=\"new-value\">{{ item.event.newValue }}</span>\n }\n </div>\n }\n\n <div class=\"event-meta\">\n <span class=\"meta-time\">{{ item.event.time }}</span>\n @if (item.event.user) {\n <div class=\"meta-separator\" aria-hidden=\"true\"></div>\n <span class=\"meta-user\">{{ item.event.user }}</span>\n }\n </div>\n </div>\n </div>\n </div>\n</cdk-virtual-scroll-viewport>\n", styles: [":host{display:block;height:100%}.stepper-viewport{height:100%;width:100%}.list-item{display:flex;flex-direction:column;width:100%}.date-separator{display:flex;align-items:center;gap:16px;padding:8px 0;color:var(--color-medium);font-size:14px;line-height:18px}.date-separator:before,.date-separator:after{content:\"\";flex:1;height:1px;background-color:var(--color-muted)}.history-event{display:flex;gap:8px;align-items:stretch;min-width:0}.event-indicator-column{display:flex;flex-direction:column;align-items:center;flex-shrink:0;width:20px}.event-indicator{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:22px;height:22px}.indicator-bubble{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;border:3px solid var(--color-light);background-color:
|
|
11646
|
+
args: [{ selector: 'ads-shipment-history-stepper', standalone: false, template: "<cdk-virtual-scroll-viewport [itemSize]=\"ITEM_HEIGHT\" class=\"stepper-viewport\">\n <div *cdkVirtualFor=\"let item of listItems(); trackBy: trackItem\" class=\"list-item\">\n @if (item.dateHeader) {\n <div class=\"date-separator\" role=\"separator\" [attr.aria-label]=\"item.dateHeader\">\n <span class=\"date-label\">{{ item.dateHeader }}</span>\n </div>\n }\n\n <div class=\"history-event\">\n <div class=\"event-indicator-column\" aria-hidden=\"true\">\n <div class=\"event-indicator\">\n <div class=\"indicator-bubble\">\n <ads-icon [name]=\"resolveIconName(item.event.action)\" theme=\"light\" stroke=\"light\" size=\"xxxs\" />\n </div>\n </div>\n @if (!item.isLast) {\n <div class=\"event-connector\"></div>\n }\n </div>\n\n <div class=\"event-content\">\n <div class=\"event-header\">\n <span class=\"event-action\">{{ item.event.actionLabel ?? item.event.action }}</span>\n @if (item.event.contextTag) {\n <ads-tag\n [id]=\"'history-tag-' + item.event.contextTag.label\"\n [tag]=\"item.event.contextTag.label\"\n [color]=\"resolveTagColor(item.event.contextTag.color)\"\n [textColor]=\"'white'\"\n [removable]=\"false\"\n />\n }\n @if (item.event.fieldName) {\n <span class=\"event-field-name\">{{ item.event.fieldName }}</span>\n }\n </div>\n\n @if (item.event.oldValue || item.event.newValue) {\n <div class=\"event-value\">\n @if (item.event.oldValue) {\n <span class=\"old-value\">{{ item.event.oldValue }}</span>\n @if (item.event.action !== ShipmentHistoryAction.Removed) {\n <span class=\"value-arrow\" aria-hidden=\"true\">\u2192</span>\n }\n }\n @if (item.event.newValue) {\n <span class=\"new-value\">{{ item.event.newValue }}</span>\n }\n </div>\n }\n\n <div class=\"event-meta\">\n <span class=\"meta-time\">{{ item.event.time }}</span>\n @if (item.event.user) {\n <div class=\"meta-separator\" aria-hidden=\"true\"></div>\n <span class=\"meta-user\">{{ item.event.user }}</span>\n }\n </div>\n </div>\n </div>\n </div>\n</cdk-virtual-scroll-viewport>\n", styles: [":host{display:block;height:100%}.stepper-viewport{height:100%;width:100%}.list-item{display:flex;flex-direction:column;width:100%}.date-separator{display:flex;align-items:center;gap:16px;padding:8px 0;color:var(--color-medium);font-size:14px;line-height:18px}.date-separator:before,.date-separator:after{content:\"\";flex:1;height:1px;background-color:var(--color-muted)}.history-event{display:flex;gap:8px;align-items:stretch;min-width:0}.event-indicator-column{display:flex;flex-direction:column;align-items:center;flex-shrink:0;width:20px}.event-indicator{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:22px;height:22px}.indicator-bubble{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;border:3px solid var(--color-light);background-color:transparent;box-sizing:border-box;flex-shrink:0}.indicator-bubble ::ng-deep ads-icon{width:10px!important;height:10px!important}.indicator-bubble ::ng-deep ads-icon svg{width:10px!important;height:10px!important}.event-connector{flex:1;width:4px;background-color:var(--color-light);min-height:86px;margin:4px 0;border-radius:80px}.event-content{display:flex;flex-direction:column;gap:8px;min-width:0;flex:1;padding-bottom:16px}.event-header{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.event-action{color:var(--color-dark);font-size:16px;font-weight:600;line-height:21px}.event-field-name{color:var(--color-dark);font-size:16px;font-weight:400;line-height:21px}.event-value{display:flex;align-items:center;flex-wrap:wrap;gap:4px;font-size:16px;line-height:21px}.old-value{color:var(--color-medium);text-decoration:line-through}.value-arrow{color:var(--color-medium)}.new-value{color:var(--color-dark)}.event-meta{display:flex;align-items:center;gap:6px;color:var(--color-medium);font-size:14px;line-height:18px}.meta-separator{width:3px;height:3px;border-radius:50%;background-color:var(--color-medium);flex-shrink:0}\n"] }]
|
|
11648
11647
|
}], ctorParameters: () => [{ type: i1.AdsIconRegistry }], propDecorators: { groups: [{ type: i0.Input, args: [{ isSignal: true, alias: "groups", required: true }] }] } });
|
|
11649
11648
|
|
|
11650
11649
|
class AdsShipmentHistoryStepperModule {
|