@ascentgl/ads-ui 21.128.0 → 21.128.1
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.
|
@@ -256,11 +256,11 @@ class AdsBaselineWidgetComponent {
|
|
|
256
256
|
this.menuClick.emit();
|
|
257
257
|
}
|
|
258
258
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsBaselineWidgetComponent, deps: [{ token: i1.AdsIconRegistry }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
259
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsBaselineWidgetComponent, isStandalone: false, selector: "ads-baseline-widget", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { widgetClick: "widgetClick", menuClick: "menuClick" }, ngImport: i0, template: "<div\n class=\"baseline-widget\"\n [class.baseline-widget--active]=\"active()\"\n [class.baseline-widget--edit]=\"mode() === 'edit'\"\n role=\"button\"\n tabindex=\"0\"\n (click)=\"onWidgetClick()\"\n (keydown.enter)=\"onWidgetClick()\"\n (keydown.space)=\"onWidgetClick()\"\n>\n <div class=\"baseline-widget__left\">\n <ads-icon [name]=\"$any(icon())\" size=\"sm\" />\n <span class=\"baseline-widget__title\">{{ title() }}</span>\n </div>\n\n <div class=\"baseline-widget__right\">\n <span class=\"baseline-widget__badge\">{{ value() }}</span>\n\n @if (mode() === 'edit') {\n <button\n class=\"baseline-widget__menu\"\n type=\"button\"\n tabindex=\"0\"\n aria-label=\"More options\"\n (click)=\"onMenuClick($event)\"\n >\n <ads-icon name=\"menu_more_info\" [theme]=\"'iconPrimary'\" size=\"xxs_16\" />\n </button>\n }\n </div>\n</div>\n", styles: [":host{display:block}.baseline-widget{display:flex;align-items:center;justify-content:space-between;gap:8px;box-sizing:border-box;height:60px;padding:4px 12px;border:none;border-radius:10px;outline:1px solid var(--color-light);outline-offset:-1px;background-color:var(--color-white);color:var(--color-dark-90);cursor:pointer;transition:background-color .15s ease,outline .15s ease,color .15s ease}.baseline-widget:hover,.baseline-widget:focus-visible{outline:2px solid var(--color-secondary-hover);outline-offset:-2px;background-color:var(--color-secondary-hover);color:var(--color-white)}.baseline-widget:hover .baseline-widget__badge,.baseline-widget:focus-visible .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-secondary-hover);color:var(--color-white)}.baseline-widget:active{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-secondary-pressed);color:var(--color-white)}.baseline-widget:active .baseline-widget__badge{border-color:var(--color-medium);background-color:var(--color-medium-opacity-50);color:var(--color-white)}.baseline-widget--active{outline:2px solid var(--color-secondary);outline-offset:-2px;color:var(--color-secondary)}.baseline-widget--active .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-secondary-10);color:var(--color-secondary)}.baseline-widget--edit:hover,.baseline-widget--edit:focus-visible{outline:2px solid var(--color-secondary-hover);outline-offset:-2px;background-color:var(--color-light-80);color:var(--color-dark)}.baseline-widget--edit:hover .baseline-widget__left ads-icon,.baseline-widget--edit:focus-visible .baseline-widget__left ads-icon{color:var(--color-secondary-hover)}.baseline-widget--edit:hover .baseline-widget__badge,.baseline-widget--edit:focus-visible .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-light-80);color:var(--color-white)}.baseline-widget--edit:active{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-light);color:var(--color-dark)}.baseline-widget--edit:active .baseline-widget__left ads-icon{color:var(--color-secondary-pressed)}.baseline-widget--edit:active .baseline-widget__badge{border-color:var(--color-medium);background-color:var(--color-medium-opacity-50);color:var(--color-white)}.baseline-widget__left{display:flex;align-items:center
|
|
259
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsBaselineWidgetComponent, isStandalone: false, selector: "ads-baseline-widget", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { widgetClick: "widgetClick", menuClick: "menuClick" }, ngImport: i0, template: "<div\n class=\"baseline-widget\"\n [class.baseline-widget--active]=\"active()\"\n [class.baseline-widget--edit]=\"mode() === 'edit'\"\n role=\"button\"\n tabindex=\"0\"\n (click)=\"onWidgetClick()\"\n (keydown.enter)=\"onWidgetClick()\"\n (keydown.space)=\"onWidgetClick()\"\n>\n <div class=\"baseline-widget__left\">\n <ads-icon [name]=\"$any(icon())\" size=\"sm\" />\n <span class=\"baseline-widget__title\">{{ title() }}</span>\n </div>\n\n <div class=\"baseline-widget__right\">\n <span class=\"baseline-widget__badge\">{{ value() }}</span>\n\n @if (mode() === 'edit') {\n <button\n class=\"baseline-widget__menu\"\n type=\"button\"\n tabindex=\"0\"\n aria-label=\"More options\"\n (click)=\"onMenuClick($event)\"\n >\n <ads-icon name=\"menu_more_info\" [theme]=\"'iconPrimary'\" size=\"xxs_16\" />\n </button>\n }\n </div>\n</div>\n", styles: [":host{display:block}.baseline-widget{display:flex;align-items:center;justify-content:space-between;gap:8px;box-sizing:border-box;height:60px;padding:4px 12px;border:none;border-radius:10px;outline:1px solid var(--color-light);outline-offset:-1px;background-color:var(--color-white);color:var(--color-dark-90);cursor:pointer;transition:background-color .15s ease,outline .15s ease,color .15s ease}.baseline-widget:hover,.baseline-widget:focus-visible{outline:2px solid var(--color-secondary-hover);outline-offset:-2px;background-color:var(--color-secondary-hover);color:var(--color-white)}.baseline-widget:hover .baseline-widget__badge,.baseline-widget:focus-visible .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-secondary-hover);color:var(--color-white)}.baseline-widget:active{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-secondary-pressed);color:var(--color-white)}.baseline-widget:active .baseline-widget__badge{border-color:var(--color-medium);background-color:var(--color-medium-opacity-50);color:var(--color-white)}.baseline-widget--active{outline:2px solid var(--color-secondary);outline-offset:-2px;color:var(--color-secondary)}.baseline-widget--active .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-secondary-10);color:var(--color-secondary)}.baseline-widget--edit:hover,.baseline-widget--edit:focus-visible{outline:2px solid var(--color-secondary-hover);outline-offset:-2px;background-color:var(--color-light-80);color:var(--color-dark)}.baseline-widget--edit:hover .baseline-widget__left ads-icon,.baseline-widget--edit:focus-visible .baseline-widget__left ads-icon{color:var(--color-secondary-hover)}.baseline-widget--edit:hover .baseline-widget__badge,.baseline-widget--edit:focus-visible .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-light-80);color:var(--color-white)}.baseline-widget--edit:active{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-light);color:var(--color-dark)}.baseline-widget--edit:active .baseline-widget__left ads-icon{color:var(--color-secondary-pressed)}.baseline-widget--edit:active .baseline-widget__badge{border-color:var(--color-medium);background-color:var(--color-medium-opacity-50);color:var(--color-white)}.baseline-widget__left{display:flex;align-items:center}.baseline-widget__left ads-icon{stroke:currentColor}.baseline-widget__left{gap:12px;flex:1;min-width:0}.baseline-widget__title{font-size:18px;font-weight:600;line-height:23px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.baseline-widget__right{display:flex;align-items:center;gap:4px;flex-shrink:0}.baseline-widget__badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:34px;height:34px;border-radius:50%;border:1px solid var(--color-muted);background-color:var(--color-muted);font-size:18px;line-height:23px;font-weight:600;color:var(--color-dark);transition:border-color .15s ease,background-color .15s ease,color .15s ease}.baseline-widget__menu{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;background:none;border:none;border-radius:4px;cursor:pointer;color:inherit}.baseline-widget__menu:hover{background-color:var(--color-secondary-10);color:var(--color-secondary)}\n"], dependencies: [{ kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
260
260
|
}
|
|
261
261
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsBaselineWidgetComponent, decorators: [{
|
|
262
262
|
type: Component,
|
|
263
|
-
args: [{ selector: 'ads-baseline-widget', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div\n class=\"baseline-widget\"\n [class.baseline-widget--active]=\"active()\"\n [class.baseline-widget--edit]=\"mode() === 'edit'\"\n role=\"button\"\n tabindex=\"0\"\n (click)=\"onWidgetClick()\"\n (keydown.enter)=\"onWidgetClick()\"\n (keydown.space)=\"onWidgetClick()\"\n>\n <div class=\"baseline-widget__left\">\n <ads-icon [name]=\"$any(icon())\" size=\"sm\" />\n <span class=\"baseline-widget__title\">{{ title() }}</span>\n </div>\n\n <div class=\"baseline-widget__right\">\n <span class=\"baseline-widget__badge\">{{ value() }}</span>\n\n @if (mode() === 'edit') {\n <button\n class=\"baseline-widget__menu\"\n type=\"button\"\n tabindex=\"0\"\n aria-label=\"More options\"\n (click)=\"onMenuClick($event)\"\n >\n <ads-icon name=\"menu_more_info\" [theme]=\"'iconPrimary'\" size=\"xxs_16\" />\n </button>\n }\n </div>\n</div>\n", styles: [":host{display:block}.baseline-widget{display:flex;align-items:center;justify-content:space-between;gap:8px;box-sizing:border-box;height:60px;padding:4px 12px;border:none;border-radius:10px;outline:1px solid var(--color-light);outline-offset:-1px;background-color:var(--color-white);color:var(--color-dark-90);cursor:pointer;transition:background-color .15s ease,outline .15s ease,color .15s ease}.baseline-widget:hover,.baseline-widget:focus-visible{outline:2px solid var(--color-secondary-hover);outline-offset:-2px;background-color:var(--color-secondary-hover);color:var(--color-white)}.baseline-widget:hover .baseline-widget__badge,.baseline-widget:focus-visible .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-secondary-hover);color:var(--color-white)}.baseline-widget:active{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-secondary-pressed);color:var(--color-white)}.baseline-widget:active .baseline-widget__badge{border-color:var(--color-medium);background-color:var(--color-medium-opacity-50);color:var(--color-white)}.baseline-widget--active{outline:2px solid var(--color-secondary);outline-offset:-2px;color:var(--color-secondary)}.baseline-widget--active .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-secondary-10);color:var(--color-secondary)}.baseline-widget--edit:hover,.baseline-widget--edit:focus-visible{outline:2px solid var(--color-secondary-hover);outline-offset:-2px;background-color:var(--color-light-80);color:var(--color-dark)}.baseline-widget--edit:hover .baseline-widget__left ads-icon,.baseline-widget--edit:focus-visible .baseline-widget__left ads-icon{color:var(--color-secondary-hover)}.baseline-widget--edit:hover .baseline-widget__badge,.baseline-widget--edit:focus-visible .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-light-80);color:var(--color-white)}.baseline-widget--edit:active{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-light);color:var(--color-dark)}.baseline-widget--edit:active .baseline-widget__left ads-icon{color:var(--color-secondary-pressed)}.baseline-widget--edit:active .baseline-widget__badge{border-color:var(--color-medium);background-color:var(--color-medium-opacity-50);color:var(--color-white)}.baseline-widget__left{display:flex;align-items:center
|
|
263
|
+
args: [{ selector: 'ads-baseline-widget', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div\n class=\"baseline-widget\"\n [class.baseline-widget--active]=\"active()\"\n [class.baseline-widget--edit]=\"mode() === 'edit'\"\n role=\"button\"\n tabindex=\"0\"\n (click)=\"onWidgetClick()\"\n (keydown.enter)=\"onWidgetClick()\"\n (keydown.space)=\"onWidgetClick()\"\n>\n <div class=\"baseline-widget__left\">\n <ads-icon [name]=\"$any(icon())\" size=\"sm\" />\n <span class=\"baseline-widget__title\">{{ title() }}</span>\n </div>\n\n <div class=\"baseline-widget__right\">\n <span class=\"baseline-widget__badge\">{{ value() }}</span>\n\n @if (mode() === 'edit') {\n <button\n class=\"baseline-widget__menu\"\n type=\"button\"\n tabindex=\"0\"\n aria-label=\"More options\"\n (click)=\"onMenuClick($event)\"\n >\n <ads-icon name=\"menu_more_info\" [theme]=\"'iconPrimary'\" size=\"xxs_16\" />\n </button>\n }\n </div>\n</div>\n", styles: [":host{display:block}.baseline-widget{display:flex;align-items:center;justify-content:space-between;gap:8px;box-sizing:border-box;height:60px;padding:4px 12px;border:none;border-radius:10px;outline:1px solid var(--color-light);outline-offset:-1px;background-color:var(--color-white);color:var(--color-dark-90);cursor:pointer;transition:background-color .15s ease,outline .15s ease,color .15s ease}.baseline-widget:hover,.baseline-widget:focus-visible{outline:2px solid var(--color-secondary-hover);outline-offset:-2px;background-color:var(--color-secondary-hover);color:var(--color-white)}.baseline-widget:hover .baseline-widget__badge,.baseline-widget:focus-visible .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-secondary-hover);color:var(--color-white)}.baseline-widget:active{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-secondary-pressed);color:var(--color-white)}.baseline-widget:active .baseline-widget__badge{border-color:var(--color-medium);background-color:var(--color-medium-opacity-50);color:var(--color-white)}.baseline-widget--active{outline:2px solid var(--color-secondary);outline-offset:-2px;color:var(--color-secondary)}.baseline-widget--active .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-secondary-10);color:var(--color-secondary)}.baseline-widget--edit:hover,.baseline-widget--edit:focus-visible{outline:2px solid var(--color-secondary-hover);outline-offset:-2px;background-color:var(--color-light-80);color:var(--color-dark)}.baseline-widget--edit:hover .baseline-widget__left ads-icon,.baseline-widget--edit:focus-visible .baseline-widget__left ads-icon{color:var(--color-secondary-hover)}.baseline-widget--edit:hover .baseline-widget__badge,.baseline-widget--edit:focus-visible .baseline-widget__badge{border-color:var(--color-muted);background-color:var(--color-light-80);color:var(--color-white)}.baseline-widget--edit:active{outline:2px solid var(--color-secondary-pressed);outline-offset:-2px;background-color:var(--color-light);color:var(--color-dark)}.baseline-widget--edit:active .baseline-widget__left ads-icon{color:var(--color-secondary-pressed)}.baseline-widget--edit:active .baseline-widget__badge{border-color:var(--color-medium);background-color:var(--color-medium-opacity-50);color:var(--color-white)}.baseline-widget__left{display:flex;align-items:center}.baseline-widget__left ads-icon{stroke:currentColor}.baseline-widget__left{gap:12px;flex:1;min-width:0}.baseline-widget__title{font-size:18px;font-weight:600;line-height:23px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.baseline-widget__right{display:flex;align-items:center;gap:4px;flex-shrink:0}.baseline-widget__badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:34px;height:34px;border-radius:50%;border:1px solid var(--color-muted);background-color:var(--color-muted);font-size:18px;line-height:23px;font-weight:600;color:var(--color-dark);transition:border-color .15s ease,background-color .15s ease,color .15s ease}.baseline-widget__menu{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;background:none;border:none;border-radius:4px;cursor:pointer;color:inherit}.baseline-widget__menu:hover{background-color:var(--color-secondary-10);color:var(--color-secondary)}\n"] }]
|
|
264
264
|
}], ctorParameters: () => [{ type: i1.AdsIconRegistry }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], widgetClick: [{ type: i0.Output, args: ["widgetClick"] }], menuClick: [{ type: i0.Output, args: ["menuClick"] }] } });
|
|
265
265
|
|
|
266
266
|
class AdsBaselineWidgetModule {
|