@yuuvis/client-framework 2.5.2 → 2.6.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.
- package/actions/lib/components/contextmenu/contextmenu.component.d.ts +2 -0
- package/common/index.d.ts +1 -0
- package/common/lib/components/halo-focus/halo-focus.component.d.ts +5 -0
- package/datepicker/lib/calendar/calendar.component.d.ts +1 -2
- package/fesm2022/yuuvis-client-framework-actions.mjs +6 -4
- package/fesm2022/yuuvis-client-framework-actions.mjs.map +1 -1
- package/fesm2022/yuuvis-client-framework-autocomplete.mjs +3 -2
- package/fesm2022/yuuvis-client-framework-autocomplete.mjs.map +1 -1
- package/fesm2022/yuuvis-client-framework-common.mjs +10 -1
- package/fesm2022/yuuvis-client-framework-common.mjs.map +1 -1
- package/fesm2022/yuuvis-client-framework-datepicker.mjs +10 -19
- package/fesm2022/yuuvis-client-framework-datepicker.mjs.map +1 -1
- package/fesm2022/yuuvis-client-framework-forms.mjs +33 -15
- package/fesm2022/yuuvis-client-framework-forms.mjs.map +1 -1
- package/fesm2022/yuuvis-client-framework-list.mjs +12 -0
- package/fesm2022/yuuvis-client-framework-list.mjs.map +1 -1
- package/fesm2022/yuuvis-client-framework-object-flavor.mjs +1 -1
- package/fesm2022/yuuvis-client-framework-object-flavor.mjs.map +1 -1
- package/fesm2022/yuuvis-client-framework-object-relationship.mjs +198 -198
- package/fesm2022/yuuvis-client-framework-object-relationship.mjs.map +1 -1
- package/fesm2022/yuuvis-client-framework-simple-search.mjs +92 -58
- package/fesm2022/yuuvis-client-framework-simple-search.mjs.map +1 -1
- package/fesm2022/yuuvis-client-framework-split-view.mjs +55 -4
- package/fesm2022/yuuvis-client-framework-split-view.mjs.map +1 -1
- package/fesm2022/yuuvis-client-framework-tile-list.mjs +4 -4
- package/fesm2022/yuuvis-client-framework-tile-list.mjs.map +1 -1
- package/fesm2022/yuuvis-client-framework.mjs +231 -2
- package/fesm2022/yuuvis-client-framework.mjs.map +1 -1
- package/forms/lib/elements/datetime/datetime.component.d.ts +1 -0
- package/index.d.ts +2 -2
- package/lib/providers/halo-focus/provide-halo-focus.d.ts +10 -0
- package/lib/providers/index.d.ts +1 -0
- package/lib/services/halo-focus/halo-focus.service.d.ts +7 -0
- package/lib/services/index.d.ts +3 -0
- package/list/lib/list-item.directive.d.ts +7 -1
- package/package.json +9 -9
- package/simple-search/lib/models/index.d.ts +1 -0
- package/simple-search/lib/models/object-type-aggregation.model.d.ts +14 -0
- package/simple-search/lib/simple-search/simple-search.component.d.ts +13 -23
- package/split-view/lib/split-area-cover.directive.d.ts +15 -0
|
@@ -772,12 +772,12 @@ class PropertySelectComponent {
|
|
|
772
772
|
return this.system.getLocalizedLabel(otf.id) || otf.id;
|
|
773
773
|
}
|
|
774
774
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: PropertySelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
775
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: PropertySelectComponent, isStandalone: true, selector: "yuv-tile-property-select", inputs: { objectType: { classPropertyName: "objectType", publicName: "objectType", isSignal: true, isRequired: false, transformFunction: null }, selectedProperty: { classPropertyName: "selectedProperty", publicName: "selectedProperty", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { propertySelect: "propertySelect" }, ngImport: i0, template: "<!-- TODO: enable once filtering of properties makes sense -->\n<!-- <form class=\"filter\">\n <div class=\"filter-input\">\n <input type=\"text\" [placeholder]=\"'yuv.tile-config.property-select.filter.placeholder' | translate\" name=\"query\" [(ngModel)]=\"query\" />\n @if (query()) {\n <button class=\"icn\" (click)=\"query.set(null)\">\n <yuv-icon [svg]=\"clearIcon\"></yuv-icon>\n </button>\n }\n </div>\n</form> -->\n\n<ul class=\"properties\">\n @for (p of filteredObjectTypeFields(); track $index) {\n <li
|
|
775
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: PropertySelectComponent, isStandalone: true, selector: "yuv-tile-property-select", inputs: { objectType: { classPropertyName: "objectType", publicName: "objectType", isSignal: true, isRequired: false, transformFunction: null }, selectedProperty: { classPropertyName: "selectedProperty", publicName: "selectedProperty", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { propertySelect: "propertySelect" }, ngImport: i0, template: "<!-- TODO: enable once filtering of properties makes sense -->\n<!-- <form class=\"filter\">\n <div class=\"filter-input\">\n <input type=\"text\" [placeholder]=\"'yuv.tile-config.property-select.filter.placeholder' | translate\" name=\"query\" [(ngModel)]=\"query\" />\n @if (query()) {\n <button class=\"icn\" (click)=\"query.set(null)\">\n <yuv-icon [svg]=\"clearIcon\"></yuv-icon>\n </button>\n }\n </div>\n</form> -->\n\n<ul class=\"properties\">\n @for (p of filteredObjectTypeFields(); track $index) {\n <li\n tabindex=\"0\"\n [ngClass]=\"{ baseProperty: p.baseProperty, selected: p.id === selectedProperty()?.propertyName }\"\n (click)=\"selectProperty(p)\"\n (keydown.enter)=\"selectProperty(p)\"\n (keydown.space)=\"selectProperty(p); $event.preventDefault()\"\n >\n <div class=\"label\">{{ p.label }}</div>\n <button\n mat-icon-button\n (click)=\"removeProperty($event)\"\n (keydown.enter)=\"$any($event).stopPropagation(); removeProperty($any($event))\"\n (keydown.space)=\"$any($event).stopPropagation(); $event.preventDefault(); removeProperty($any($event))\"\n >\n <mat-icon aria-hidden=\"true\" [attr.inert]=\"true\">close</mat-icon>\n </button>\n </li>\n }\n</ul>\n", styles: [":host{display:flex;flex-flow:column;max-height:100%}:host .filter{flex:0 0 auto}:host .filter .filter-input{background-color:var(--ymt-surface-panel);border:1px solid var(--ymt-outline-variant);display:flex;padding:.25em;align-items:center}:host .filter .filter-input input{background-color:transparent;border:0;outline:0;flex:1;color:var(--ymt-text-color)}:host .properties{flex:1;column-count:3;column-width:30ch;column-rule:1px dotted var(--ymt-outline);column-gap:2em;margin-block-start:var(--ymt-spacing-m)}:host .properties li{border:1px solid var(--ymt-outline-variant);border-radius:0;margin-block-end:1px;display:flex;align-items:center;justify-content:space-between;cursor:default}:host .properties li:hover{background-color:var(--ymt-hover-background)}:host .properties li.baseProperty{font-style:italic}:host .properties li.selected{background-color:var(--ymt-primary-container);color:var(--ymt-on-primary-container)}:host .properties li:not(.selected) button{display:none}:host .properties li .label{padding:var(--ymt-spacing-xs) var(--ymt-spacing-m)}:host .properties li button{color:currentColor}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
|
|
776
776
|
}
|
|
777
777
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: PropertySelectComponent, decorators: [{
|
|
778
778
|
type: Component,
|
|
779
779
|
args: [{ selector: 'yuv-tile-property-select', standalone: true, imports: [NgClass, FormsModule, TranslateModule,
|
|
780
|
-
MatButtonModule, MatIconModule], template: "<!-- TODO: enable once filtering of properties makes sense -->\n<!-- <form class=\"filter\">\n <div class=\"filter-input\">\n <input type=\"text\" [placeholder]=\"'yuv.tile-config.property-select.filter.placeholder' | translate\" name=\"query\" [(ngModel)]=\"query\" />\n @if (query()) {\n <button class=\"icn\" (click)=\"query.set(null)\">\n <yuv-icon [svg]=\"clearIcon\"></yuv-icon>\n </button>\n }\n </div>\n</form> -->\n\n<ul class=\"properties\">\n @for (p of filteredObjectTypeFields(); track $index) {\n <li
|
|
780
|
+
MatButtonModule, MatIconModule], template: "<!-- TODO: enable once filtering of properties makes sense -->\n<!-- <form class=\"filter\">\n <div class=\"filter-input\">\n <input type=\"text\" [placeholder]=\"'yuv.tile-config.property-select.filter.placeholder' | translate\" name=\"query\" [(ngModel)]=\"query\" />\n @if (query()) {\n <button class=\"icn\" (click)=\"query.set(null)\">\n <yuv-icon [svg]=\"clearIcon\"></yuv-icon>\n </button>\n }\n </div>\n</form> -->\n\n<ul class=\"properties\">\n @for (p of filteredObjectTypeFields(); track $index) {\n <li\n tabindex=\"0\"\n [ngClass]=\"{ baseProperty: p.baseProperty, selected: p.id === selectedProperty()?.propertyName }\"\n (click)=\"selectProperty(p)\"\n (keydown.enter)=\"selectProperty(p)\"\n (keydown.space)=\"selectProperty(p); $event.preventDefault()\"\n >\n <div class=\"label\">{{ p.label }}</div>\n <button\n mat-icon-button\n (click)=\"removeProperty($event)\"\n (keydown.enter)=\"$any($event).stopPropagation(); removeProperty($any($event))\"\n (keydown.space)=\"$any($event).stopPropagation(); $event.preventDefault(); removeProperty($any($event))\"\n >\n <mat-icon aria-hidden=\"true\" [attr.inert]=\"true\">close</mat-icon>\n </button>\n </li>\n }\n</ul>\n", styles: [":host{display:flex;flex-flow:column;max-height:100%}:host .filter{flex:0 0 auto}:host .filter .filter-input{background-color:var(--ymt-surface-panel);border:1px solid var(--ymt-outline-variant);display:flex;padding:.25em;align-items:center}:host .filter .filter-input input{background-color:transparent;border:0;outline:0;flex:1;color:var(--ymt-text-color)}:host .properties{flex:1;column-count:3;column-width:30ch;column-rule:1px dotted var(--ymt-outline);column-gap:2em;margin-block-start:var(--ymt-spacing-m)}:host .properties li{border:1px solid var(--ymt-outline-variant);border-radius:0;margin-block-end:1px;display:flex;align-items:center;justify-content:space-between;cursor:default}:host .properties li:hover{background-color:var(--ymt-hover-background)}:host .properties li.baseProperty{font-style:italic}:host .properties li.selected{background-color:var(--ymt-primary-container);color:var(--ymt-on-primary-container)}:host .properties li:not(.selected) button{display:none}:host .properties li .label{padding:var(--ymt-spacing-xs) var(--ymt-spacing-m)}:host .properties li button{color:currentColor}\n"] }]
|
|
781
781
|
}] });
|
|
782
782
|
|
|
783
783
|
/**
|
|
@@ -831,13 +831,13 @@ class TileConfigTileComponent {
|
|
|
831
831
|
});
|
|
832
832
|
}
|
|
833
833
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TileConfigTileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
834
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TileConfigTileComponent, isStandalone: true, selector: "yuv-tile-config-tile", inputs: { disableIconSlot: { classPropertyName: "disableIconSlot", publicName: "disableIconSlot", isSignal: true, isRequired: false, transformFunction: null }, disableBadgesSlot: { classPropertyName: "disableBadgesSlot", publicName: "disableBadgesSlot", isSignal: true, isRequired: false, transformFunction: null }, objectConfig: { classPropertyName: "objectConfig", publicName: "objectConfig", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { slotSelect: "slotSelect" }, ngImport: i0, template: "@let oc = _objectConfig();\n\n<div
|
|
834
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TileConfigTileComponent, isStandalone: true, selector: "yuv-tile-config-tile", inputs: { disableIconSlot: { classPropertyName: "disableIconSlot", publicName: "disableIconSlot", isSignal: true, isRequired: false, transformFunction: null }, disableBadgesSlot: { classPropertyName: "disableBadgesSlot", publicName: "disableBadgesSlot", isSignal: true, isRequired: false, transformFunction: null }, objectConfig: { classPropertyName: "objectConfig", publicName: "objectConfig", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { slotSelect: "slotSelect" }, ngImport: i0, template: "@let oc = _objectConfig();\n\n<div\n data-slot=\"icon\"\n [attr.disabled]=\"disableIconSlot()\"\n tabindex=\"0\"\n (click)=\"selectSlot('icon')\"\n (keydown.enter)=\"selectSlot('icon')\"\n (keydown.space)=\"selectSlot('icon'); $event.preventDefault()\"\n>\n @if (oc && oc.icon) {\n <mat-icon aria-hidden=\"true\" [attr.inert]=\"true\">{{ oc.icon.svg }}</mat-icon>\n } @else if (oc && oc.objectTypeId) {\n <yuv-object-type-icon [objectTypeId]=\"oc.objectTypeId\"></yuv-object-type-icon>\n }\n</div>\n<div\n data-slot=\"title\"\n tabindex=\"0\"\n (click)=\"selectSlot('title')\"\n (keydown.enter)=\"selectSlot('title')\"\n (keydown.space)=\"selectSlot('title'); $event.preventDefault()\"\n>\n {{ oc?.title?.label }}\n</div>\n<div\n data-slot=\"actions\"\n tabindex=\"0\"\n (click)=\"selectSlot('actions')\"\n (keydown.enter)=\"selectSlot('actions')\"\n (keydown.space)=\"selectSlot('actions'); $event.preventDefault()\"\n>\n @for (a of actions(); track a.id) {\n <button mat-icon-button [matTooltip]=\"a.label\" [attr.inert]=\"true\" aria-hidden=\"true\">\n <mat-icon inert=\"true\" aria-hidden=\"true\">{{ a.icon }}</mat-icon>\n </button>\n }\n</div>\n<div\n data-slot=\"description\"\n tabindex=\"0\"\n (click)=\"selectSlot('description')\"\n (keydown.enter)=\"selectSlot('description')\"\n (keydown.space)=\"selectSlot('description'); $event.preventDefault()\"\n>\n {{ oc?.description?.label }}\n</div>\n<div\n data-slot=\"aside\"\n tabindex=\"0\"\n (click)=\"selectSlot('aside')\"\n (keydown.enter)=\"selectSlot('aside')\"\n (keydown.space)=\"selectSlot('aside'); $event.preventDefault()\"\n>\n {{ oc?.aside?.label }}\n</div>\n<div\n data-slot=\"meta\"\n tabindex=\"0\"\n (click)=\"selectSlot('meta')\"\n (keydown.enter)=\"selectSlot('meta')\"\n (keydown.space)=\"selectSlot('meta'); $event.preventDefault()\"\n>\n {{ oc?.meta?.label }}\n</div>\n@if (!disableBadgesSlot()) {\n <div\n data-slot=\"badges\"\n tabindex=\"0\"\n (click)=\"selectSlot('badges')\"\n (keydown.enter)=\"selectSlot('badges')\"\n (keydown.space)=\"selectSlot('badges'); $event.preventDefault()\"\n >\n {{ oc?.badges }}\n </div>\n}\n", styles: [":host{--tile-item-gap: .5em;--tile-background: transparent;--tile-icon-fill: currentColor;display:grid;grid-template-rows:auto auto auto auto;grid-template-columns:3rem 1fr auto;grid-template-areas:\"icon title title actions\" \"icon description aside aside\" \"icon meta meta badges\";gap:var(--tile-item-gap);padding:var(--ymt-spacing-m);background-color:var(--tile-background)}:host:hover [data-slot=actions]{opacity:1}:host [data-slot=icon]{grid-area:icon;display:flex;align-items:center;justify-content:center}:host [data-slot=title]{grid-area:title;font-weight:700}:host [data-slot=description]{grid-area:description}:host [data-slot=meta]{grid-area:meta}:host [data-slot=aside]{flex:0 0 auto;grid-area:aside}:host [data-slot=actions]{flex:0 0 auto;display:flex;justify-self:end;grid-area:actions}:host [data-slot=actions] button{padding:0;gap:2px}:host [data-slot=badges]{grid-area:badges;justify-self:end;flex:0 0 auto}:host :where([data-slot=badges],[data-slot=actions],[data-slot=aside],[data-slot=icon],[data-slot=title],[data-slot=description],[data-slot=meta]){display:flex;align-items:center;background-color:var(--ymt-surface-panel);border:1px solid var(--ymt-outline);padding:.25em .5em;box-sizing:border-box;min-height:2.2em;border-radius:var(--ymt-corner-xs)}:host :where([data-slot=badges],[data-slot=actions],[data-slot=aside],[data-slot=icon],[data-slot=title],[data-slot=description],[data-slot=meta]):not([disabled]){cursor:pointer}:host :where([data-slot=badges],[data-slot=actions],[data-slot=aside],[data-slot=icon],[data-slot=title],[data-slot=description],[data-slot=meta]):not([disabled]):hover{background-color:var(--ymt-focus-background);color:var(--ymt-on-focus-background)}:host :where([data-slot=badges],[data-slot=actions],[data-slot=aside],[data-slot=icon],[data-slot=title],[data-slot=description],[data-slot=meta]):not([disabled]).active{background-color:var(--ymt-primary-container);color:var(--ymt-on-primary-container)}:host :where([data-slot=badges],[data-slot=actions],[data-slot=aside],[data-slot=icon],[data-slot=title],[data-slot=description],[data-slot=meta])[disabled]{border:none;background-color:transparent}:host :where([data-slot=badges],[data-slot=actions]){min-width:3em}:host :where([data-slot=badges],[data-slot=actions]) button{width:24px;height:24px;pointer-events:none;color:currentColor}:host [data-slot=aside]{min-width:4em}:host [data-slot=icon]{height:3em;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: CommonModule }, { kind: "component", type: ObjectTypeIconComponent, selector: "yuv-object-type-icon", inputs: ["objectTypeId"] }] }); }
|
|
835
835
|
}
|
|
836
836
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TileConfigTileComponent, decorators: [{
|
|
837
837
|
type: Component,
|
|
838
838
|
args: [{ selector: 'yuv-tile-config-tile', standalone: true, imports: [MatButtonModule,
|
|
839
839
|
MatTooltipModule,
|
|
840
|
-
MatIconModule, CommonModule, ObjectTypeIconComponent], template: "@let oc = _objectConfig();\n\n<div
|
|
840
|
+
MatIconModule, CommonModule, ObjectTypeIconComponent], template: "@let oc = _objectConfig();\n\n<div\n data-slot=\"icon\"\n [attr.disabled]=\"disableIconSlot()\"\n tabindex=\"0\"\n (click)=\"selectSlot('icon')\"\n (keydown.enter)=\"selectSlot('icon')\"\n (keydown.space)=\"selectSlot('icon'); $event.preventDefault()\"\n>\n @if (oc && oc.icon) {\n <mat-icon aria-hidden=\"true\" [attr.inert]=\"true\">{{ oc.icon.svg }}</mat-icon>\n } @else if (oc && oc.objectTypeId) {\n <yuv-object-type-icon [objectTypeId]=\"oc.objectTypeId\"></yuv-object-type-icon>\n }\n</div>\n<div\n data-slot=\"title\"\n tabindex=\"0\"\n (click)=\"selectSlot('title')\"\n (keydown.enter)=\"selectSlot('title')\"\n (keydown.space)=\"selectSlot('title'); $event.preventDefault()\"\n>\n {{ oc?.title?.label }}\n</div>\n<div\n data-slot=\"actions\"\n tabindex=\"0\"\n (click)=\"selectSlot('actions')\"\n (keydown.enter)=\"selectSlot('actions')\"\n (keydown.space)=\"selectSlot('actions'); $event.preventDefault()\"\n>\n @for (a of actions(); track a.id) {\n <button mat-icon-button [matTooltip]=\"a.label\" [attr.inert]=\"true\" aria-hidden=\"true\">\n <mat-icon inert=\"true\" aria-hidden=\"true\">{{ a.icon }}</mat-icon>\n </button>\n }\n</div>\n<div\n data-slot=\"description\"\n tabindex=\"0\"\n (click)=\"selectSlot('description')\"\n (keydown.enter)=\"selectSlot('description')\"\n (keydown.space)=\"selectSlot('description'); $event.preventDefault()\"\n>\n {{ oc?.description?.label }}\n</div>\n<div\n data-slot=\"aside\"\n tabindex=\"0\"\n (click)=\"selectSlot('aside')\"\n (keydown.enter)=\"selectSlot('aside')\"\n (keydown.space)=\"selectSlot('aside'); $event.preventDefault()\"\n>\n {{ oc?.aside?.label }}\n</div>\n<div\n data-slot=\"meta\"\n tabindex=\"0\"\n (click)=\"selectSlot('meta')\"\n (keydown.enter)=\"selectSlot('meta')\"\n (keydown.space)=\"selectSlot('meta'); $event.preventDefault()\"\n>\n {{ oc?.meta?.label }}\n</div>\n@if (!disableBadgesSlot()) {\n <div\n data-slot=\"badges\"\n tabindex=\"0\"\n (click)=\"selectSlot('badges')\"\n (keydown.enter)=\"selectSlot('badges')\"\n (keydown.space)=\"selectSlot('badges'); $event.preventDefault()\"\n >\n {{ oc?.badges }}\n </div>\n}\n", styles: [":host{--tile-item-gap: .5em;--tile-background: transparent;--tile-icon-fill: currentColor;display:grid;grid-template-rows:auto auto auto auto;grid-template-columns:3rem 1fr auto;grid-template-areas:\"icon title title actions\" \"icon description aside aside\" \"icon meta meta badges\";gap:var(--tile-item-gap);padding:var(--ymt-spacing-m);background-color:var(--tile-background)}:host:hover [data-slot=actions]{opacity:1}:host [data-slot=icon]{grid-area:icon;display:flex;align-items:center;justify-content:center}:host [data-slot=title]{grid-area:title;font-weight:700}:host [data-slot=description]{grid-area:description}:host [data-slot=meta]{grid-area:meta}:host [data-slot=aside]{flex:0 0 auto;grid-area:aside}:host [data-slot=actions]{flex:0 0 auto;display:flex;justify-self:end;grid-area:actions}:host [data-slot=actions] button{padding:0;gap:2px}:host [data-slot=badges]{grid-area:badges;justify-self:end;flex:0 0 auto}:host :where([data-slot=badges],[data-slot=actions],[data-slot=aside],[data-slot=icon],[data-slot=title],[data-slot=description],[data-slot=meta]){display:flex;align-items:center;background-color:var(--ymt-surface-panel);border:1px solid var(--ymt-outline);padding:.25em .5em;box-sizing:border-box;min-height:2.2em;border-radius:var(--ymt-corner-xs)}:host :where([data-slot=badges],[data-slot=actions],[data-slot=aside],[data-slot=icon],[data-slot=title],[data-slot=description],[data-slot=meta]):not([disabled]){cursor:pointer}:host :where([data-slot=badges],[data-slot=actions],[data-slot=aside],[data-slot=icon],[data-slot=title],[data-slot=description],[data-slot=meta]):not([disabled]):hover{background-color:var(--ymt-focus-background);color:var(--ymt-on-focus-background)}:host :where([data-slot=badges],[data-slot=actions],[data-slot=aside],[data-slot=icon],[data-slot=title],[data-slot=description],[data-slot=meta]):not([disabled]).active{background-color:var(--ymt-primary-container);color:var(--ymt-on-primary-container)}:host :where([data-slot=badges],[data-slot=actions],[data-slot=aside],[data-slot=icon],[data-slot=title],[data-slot=description],[data-slot=meta])[disabled]{border:none;background-color:transparent}:host :where([data-slot=badges],[data-slot=actions]){min-width:3em}:host :where([data-slot=badges],[data-slot=actions]) button{width:24px;height:24px;pointer-events:none;color:currentColor}:host [data-slot=aside]{min-width:4em}:host [data-slot=icon]{height:3em;width:100%}\n"] }]
|
|
841
841
|
}] });
|
|
842
842
|
|
|
843
843
|
class TileConfigComponent {
|