@ascentgl/ads-ui 20.22.0 → 20.23.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.
|
@@ -6153,8 +6153,8 @@ class AdsChipComponent {
|
|
|
6153
6153
|
this.registry = registry;
|
|
6154
6154
|
/** The unique id of the chip */
|
|
6155
6155
|
this.id = input.required(...(ngDevMode ? [{ debugName: "id" }] : []));
|
|
6156
|
-
/** The text of the chip */
|
|
6157
|
-
this.title = input
|
|
6156
|
+
/** The text of the chip - optional when using ng-content */
|
|
6157
|
+
this.title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
6158
6158
|
/** Show check icon before text */
|
|
6159
6159
|
this.showCheckedIcon = input(false, ...(ngDevMode ? [{ debugName: "showCheckedIcon" }] : []));
|
|
6160
6160
|
/** Disable chip */
|
|
@@ -6171,7 +6171,7 @@ class AdsChipComponent {
|
|
|
6171
6171
|
onSelected() {
|
|
6172
6172
|
this.selected.emit({
|
|
6173
6173
|
id: this.id(),
|
|
6174
|
-
title: this.title(),
|
|
6174
|
+
title: this.title() || '',
|
|
6175
6175
|
});
|
|
6176
6176
|
}
|
|
6177
6177
|
/** @ignore */
|
|
@@ -6181,12 +6181,12 @@ class AdsChipComponent {
|
|
|
6181
6181
|
}
|
|
6182
6182
|
}
|
|
6183
6183
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: AdsChipComponent, deps: [{ token: i1.AdsIconRegistry }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6184
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: AdsChipComponent, isStandalone: false, selector: "ads-chip", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired:
|
|
6184
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: AdsChipComponent, isStandalone: false, selector: "ads-chip", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, showCheckedIcon: { classPropertyName: "showCheckedIcon", publicName: "showCheckedIcon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, deletable: { classPropertyName: "deletable", publicName: "deletable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { deleted: "deleted", selected: "selected" }, ngImport: i0, template: "<div class=\"chip\" [class.disabled]=\"disabled()\" tabindex=\"0\">\n @if (showCheckedIcon()) {\n <ads-icon name=\"check\" />\n }\n @if (title()) {\n <span (click)=\"onSelected()\">{{ title() }}</span>\n } @else {\n <span (click)=\"onSelected()\">\n <ng-content></ng-content>\n </span>\n }\n @if (deletable()) {\n <ads-icon name=\"cross\" class=\"chip-delete\" (click)=\"onDelete()\" />\n }\n</div>\n", styles: [":host{display:flex}.chip{display:inline-flex;justify-content:space-between;align-items:center;padding:8px 16px;font-size:12px;line-height:16px;font-weight:400;color:var(--color-medium);background-color:var(--color-muted);border-radius:100px;gap:8px}.chip ads-icon{width:10px!important;height:10px!important;stroke:var(--color-medium)}.chip .chip-delete{cursor:pointer}.chip.disabled{background-color:var(--color-light-30);color:var(--color-medium-50)}.chip.disabled .chip-delete{cursor:default}.chip.disabled ads-icon{stroke:var(--color-medium-50)}.chip:not(.disabled):hover{background-color:var(--color-primary-hover);color:var(--color-white)}.chip:not(.disabled):hover ads-icon{stroke:var(--color-white)}.chip:not(.disabled):focus:active{background-color:var(--color-primary-pressed);color:var(--color-white)}.chip:not(.disabled):focus:active ads-icon{stroke:var(--color-white)}\n"], dependencies: [{ kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }] }); }
|
|
6185
6185
|
}
|
|
6186
6186
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: AdsChipComponent, decorators: [{
|
|
6187
6187
|
type: Component,
|
|
6188
|
-
args: [{ selector: 'ads-chip', standalone: false, template: "<div class=\"chip\" [class.disabled]=\"disabled()\" tabindex=\"0\">\n @if (showCheckedIcon()) {\n <ads-icon name=\"check\" />\n }\n <span (click)=\"onSelected()\">{{ title() }}</span>\n @if (deletable()) {\n <ads-icon name=\"cross\" class=\"chip-delete\" (click)=\"onDelete()\" />\n }\n</div>\n", styles: [":host{display:flex}.chip{display:inline-flex;justify-content:space-between;align-items:center;padding:8px 16px;font-size:12px;line-height:16px;font-weight:400;color:var(--color-medium);background-color:var(--color-muted);border-radius:100px;gap:8px}.chip ads-icon{width:10px!important;height:10px!important;stroke:var(--color-medium)}.chip .chip-delete{cursor:pointer}.chip.disabled{background-color:var(--color-light-30);color:var(--color-medium-50)}.chip.disabled .chip-delete{cursor:default}.chip.disabled ads-icon{stroke:var(--color-medium-50)}.chip:not(.disabled):hover{background-color:var(--color-primary-hover);color:var(--color-white)}.chip:not(.disabled):hover ads-icon{stroke:var(--color-white)}.chip:not(.disabled):focus:active{background-color:var(--color-primary-pressed);color:var(--color-white)}.chip:not(.disabled):focus:active ads-icon{stroke:var(--color-white)}\n"] }]
|
|
6189
|
-
}], ctorParameters: () => [{ type: i1.AdsIconRegistry }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required:
|
|
6188
|
+
args: [{ selector: 'ads-chip', standalone: false, template: "<div class=\"chip\" [class.disabled]=\"disabled()\" tabindex=\"0\">\n @if (showCheckedIcon()) {\n <ads-icon name=\"check\" />\n }\n @if (title()) {\n <span (click)=\"onSelected()\">{{ title() }}</span>\n } @else {\n <span (click)=\"onSelected()\">\n <ng-content></ng-content>\n </span>\n }\n @if (deletable()) {\n <ads-icon name=\"cross\" class=\"chip-delete\" (click)=\"onDelete()\" />\n }\n</div>\n", styles: [":host{display:flex}.chip{display:inline-flex;justify-content:space-between;align-items:center;padding:8px 16px;font-size:12px;line-height:16px;font-weight:400;color:var(--color-medium);background-color:var(--color-muted);border-radius:100px;gap:8px}.chip ads-icon{width:10px!important;height:10px!important;stroke:var(--color-medium)}.chip .chip-delete{cursor:pointer}.chip.disabled{background-color:var(--color-light-30);color:var(--color-medium-50)}.chip.disabled .chip-delete{cursor:default}.chip.disabled ads-icon{stroke:var(--color-medium-50)}.chip:not(.disabled):hover{background-color:var(--color-primary-hover);color:var(--color-white)}.chip:not(.disabled):hover ads-icon{stroke:var(--color-white)}.chip:not(.disabled):focus:active{background-color:var(--color-primary-pressed);color:var(--color-white)}.chip:not(.disabled):focus:active ads-icon{stroke:var(--color-white)}\n"] }]
|
|
6189
|
+
}], ctorParameters: () => [{ type: i1.AdsIconRegistry }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], showCheckedIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCheckedIcon", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], deletable: [{ type: i0.Input, args: [{ isSignal: true, alias: "deletable", required: false }] }], deleted: [{ type: i0.Output, args: ["deleted"] }], selected: [{ type: i0.Output, args: ["selected"] }] } });
|
|
6190
6190
|
|
|
6191
6191
|
class AdsChipModule {
|
|
6192
6192
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: AdsChipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|