@kirbydesign/designsystem 12.0.0-dev-67d5287 → 12.0.0-dev-286cdc0
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/fesm2022/kirbydesign-designsystem-accordion.mjs +12 -12
- package/fesm2022/kirbydesign-designsystem-accordion.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-action-group.mjs +3 -3
- package/fesm2022/kirbydesign-designsystem-avatar.mjs +5 -5
- package/fesm2022/kirbydesign-designsystem-avatar.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-badge.mjs +5 -5
- package/fesm2022/kirbydesign-designsystem-badge.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-button.mjs +5 -5
- package/fesm2022/kirbydesign-designsystem-button.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-calendar.mjs +7 -7
- package/fesm2022/kirbydesign-designsystem-calendar.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-card.mjs +24 -24
- package/fesm2022/kirbydesign-designsystem-card.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-chart.mjs +22 -22
- package/fesm2022/kirbydesign-designsystem-checkbox.mjs +14 -6
- package/fesm2022/kirbydesign-designsystem-checkbox.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-data-table.mjs +7 -7
- package/fesm2022/kirbydesign-designsystem-divider.mjs +5 -5
- package/fesm2022/kirbydesign-designsystem-divider.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-dropdown.mjs +10 -10
- package/fesm2022/kirbydesign-designsystem-empty-state.mjs +19 -8
- package/fesm2022/kirbydesign-designsystem-empty-state.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-fab-sheet.mjs +3 -3
- package/fesm2022/kirbydesign-designsystem-flag.mjs +5 -5
- package/fesm2022/kirbydesign-designsystem-flag.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-form-field.mjs +32 -32
- package/fesm2022/kirbydesign-designsystem-form-field.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-gesture.mjs +3 -3
- package/fesm2022/kirbydesign-designsystem-header.mjs +19 -19
- package/fesm2022/kirbydesign-designsystem-helpers.mjs +9 -9
- package/fesm2022/kirbydesign-designsystem-icon.mjs +10 -10
- package/fesm2022/kirbydesign-designsystem-item-group.mjs +3 -3
- package/fesm2022/kirbydesign-designsystem-item-sliding.mjs +3 -3
- package/fesm2022/kirbydesign-designsystem-item.mjs +12 -12
- package/fesm2022/kirbydesign-designsystem-item.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-kirby-app.mjs +7 -7
- package/fesm2022/kirbydesign-designsystem-list.mjs +49 -46
- package/fesm2022/kirbydesign-designsystem-list.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-loading-overlay.mjs +8 -8
- package/fesm2022/kirbydesign-designsystem-loading-overlay.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-menu.mjs +5 -5
- package/fesm2022/kirbydesign-designsystem-menu.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-modal.mjs +59 -50
- package/fesm2022/kirbydesign-designsystem-modal.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-page.mjs +69 -48
- package/fesm2022/kirbydesign-designsystem-page.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-popover.mjs +3 -3
- package/fesm2022/kirbydesign-designsystem-progress-circle.mjs +6 -6
- package/fesm2022/kirbydesign-designsystem-radio.mjs +12 -12
- package/fesm2022/kirbydesign-designsystem-radio.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-range.mjs +5 -5
- package/fesm2022/kirbydesign-designsystem-range.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-reorder-list.mjs +5 -5
- package/fesm2022/kirbydesign-designsystem-reorder-list.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-router-outlet.mjs +7 -7
- package/fesm2022/kirbydesign-designsystem-section-header.mjs +3 -3
- package/fesm2022/kirbydesign-designsystem-segmented-control.mjs +5 -5
- package/fesm2022/kirbydesign-designsystem-segmented-control.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-shared-floating.mjs +16 -7
- package/fesm2022/kirbydesign-designsystem-shared-floating.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-shared-portal.mjs +3 -3
- package/fesm2022/kirbydesign-designsystem-shared.mjs +21 -21
- package/fesm2022/kirbydesign-designsystem-slide-button.mjs +3 -3
- package/fesm2022/kirbydesign-designsystem-slide.mjs +13 -13
- package/fesm2022/kirbydesign-designsystem-spinner.mjs +7 -7
- package/fesm2022/kirbydesign-designsystem-tab-navigation.mjs +12 -12
- package/fesm2022/kirbydesign-designsystem-tab-navigation.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-tabs.mjs +15 -15
- package/fesm2022/kirbydesign-designsystem-tabs.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-testing-base.mjs +305 -303
- package/fesm2022/kirbydesign-designsystem-testing-base.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-testing-jasmine.mjs +4 -4
- package/fesm2022/kirbydesign-designsystem-testing-jest.mjs +4 -4
- package/fesm2022/kirbydesign-designsystem-testing.mjs +4 -4
- package/fesm2022/kirbydesign-designsystem-toast.mjs +6 -6
- package/fesm2022/kirbydesign-designsystem-toggle-button.mjs +7 -7
- package/fesm2022/kirbydesign-designsystem-toggle.mjs +5 -5
- package/fesm2022/kirbydesign-designsystem-toggle.mjs.map +1 -1
- package/fesm2022/kirbydesign-designsystem-types.mjs +3 -3
- package/fesm2022/kirbydesign-designsystem.mjs +10 -10
- package/package.json +2 -2
- package/types/kirbydesign-designsystem-card.d.ts +2 -2
- package/types/kirbydesign-designsystem-card.d.ts.map +1 -1
- package/types/kirbydesign-designsystem-checkbox.d.ts +7 -1
- package/types/kirbydesign-designsystem-checkbox.d.ts.map +1 -1
- package/types/kirbydesign-designsystem-empty-state.d.ts +11 -0
- package/types/kirbydesign-designsystem-empty-state.d.ts.map +1 -1
- package/types/kirbydesign-designsystem-list.d.ts +5 -0
- package/types/kirbydesign-designsystem-list.d.ts.map +1 -1
- package/types/kirbydesign-designsystem-modal.d.ts +2 -1
- package/types/kirbydesign-designsystem-modal.d.ts.map +1 -1
- package/types/kirbydesign-designsystem-page.d.ts +4 -0
- package/types/kirbydesign-designsystem-page.d.ts.map +1 -1
- package/types/kirbydesign-designsystem-shared-floating.d.ts.map +1 -1
- package/types/kirbydesign-designsystem-testing-base.d.ts +5 -0
- package/types/kirbydesign-designsystem-testing-base.d.ts.map +1 -1
|
@@ -40,7 +40,7 @@ var AccordionItemComponent = class AccordionItemComponent {
|
|
|
40
40
|
static {
|
|
41
41
|
this.ɵfac = i0.ɵɵngDeclareFactory({
|
|
42
42
|
minVersion: "12.0.0",
|
|
43
|
-
version: "22.2.
|
|
43
|
+
version: "22.2.3",
|
|
44
44
|
ngImport: i0,
|
|
45
45
|
type: AccordionItemComponent,
|
|
46
46
|
deps: [],
|
|
@@ -50,7 +50,7 @@ var AccordionItemComponent = class AccordionItemComponent {
|
|
|
50
50
|
static {
|
|
51
51
|
this.ɵcmp = i0.ɵɵngDeclareComponent({
|
|
52
52
|
minVersion: "14.0.0",
|
|
53
|
-
version: "22.2.
|
|
53
|
+
version: "22.2.3",
|
|
54
54
|
type: AccordionItemComponent,
|
|
55
55
|
isStandalone: true,
|
|
56
56
|
selector: "kirby-accordion-item",
|
|
@@ -71,7 +71,7 @@ var AccordionItemComponent = class AccordionItemComponent {
|
|
|
71
71
|
usesOnChanges: true,
|
|
72
72
|
ngImport: i0,
|
|
73
73
|
template: "<div [attr.aria-level]=\"headingLevel\" [attr.role]=\"headingLevel ? 'heading' : null\">\n <button\n type=\"button\"\n class=\"header\"\n [attr.aria-expanded]=\"isExpanded\"\n [attr.aria-controls]=\"_contentId\"\n [id]=\"_titleId\"\n [disabled]=\"isDisabled\"\n (click)=\"_onToggleExpanded($event)\"\n >\n <div class=\"title\" [class.bold]=\"isExpanded\">{{ getTitle() }}</div>\n <kirby-icon name=\"arrow-down\"></kirby-icon>\n </button>\n</div>\n<div\n class=\"content\"\n role=\"region\"\n [attr.aria-labelledby]=\"_titleId\"\n [id]=\"_contentId\"\n [@isExpanded]=\"!!isExpanded\"\n>\n <div class=\"content-body\" [class.padding]=\"hasPadding\">\n <ng-content></ng-content>\n </div>\n</div>\n",
|
|
74
|
-
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{display:block;border-top:
|
|
74
|
+
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{display:block;border-top:var(--kirby-stroke-xs) solid var(--kirby-color-border-base-quiet);border-bottom:var(--kirby-stroke-xs) solid var(--kirby-color-border-base-quiet);box-sizing:border-box}:host(.has-list){--kirby-item-background: transparent}:host(:first-of-type){--kirby-accordion-border-top-radius: var(--kirby-content-border-top-radius, 0)}:host(:last-of-type){--kirby-accordion-border-bottom-radius: var(--kirby-content-border-bottom-radius, 0)}:host(:last-of-type):has([aria-expanded=true]){--kirby-accordion-border-bottom-radius: 0}@media(hover:hover){:host:has(.header:hover){background-color:var(--kirby-color-fill-base-hover);color:var(--kirby-color-content-base-hover);border-color:var(--kirby-color-border-base-quiet-hover)}}:host:has(.header:active){background-color:var(--kirby-color-fill-base-active);color:var(--kirby-color-content-base-active);border-color:var(--kirby-color-border-base-quiet-active)}.header{border-radius:var(--kirby-accordion-border-top-radius, 0) var(--kirby-accordion-border-top-radius, 0) var(--kirby-accordion-border-bottom-radius, 0) var(--kirby-accordion-border-bottom-radius, 0)}.header:focus-visible{transition:all 80ms linear 0ms;box-shadow:var(--kirby-focus-ring-md-inset);outline:0}.header{display:flex;align-items:center;gap:var(--kirby-spacing-xxs);padding:var(--kirby-spacing-s);-webkit-user-select:none;user-select:none;width:100%;border:none;outline:none;background:none;box-shadow:none;font-family:var(--kirby-font-family);text-align:start;cursor:pointer}.title{flex-grow:2;display:flex;font-size:var(--kirby-font-size-n)}.kirby-icon{transition:transform var(--kirby-transition-duration-quick)}.content{overflow:hidden;cursor:default}.content-body.padding{padding:0 var(--kirby-spacing-s) var(--kirby-spacing-s)}button[disabled]{pointer-events:none;opacity:var(--kirby-opacity-40)}button{color:var(--kirby-color-content-base)}button[aria-expanded=true] .title{font-weight:var(--kirby-font-weight-bold)}button[aria-expanded=true] .kirby-icon{transform:rotate(180deg)}:host-context(kirby-accordion):not(:first-child){border-top:none}:host-context(kirby-card):first-child{border-top:none}:host-context(kirby-card):last-child{border-bottom:none}\n"],
|
|
75
75
|
dependencies: [{
|
|
76
76
|
kind: "component",
|
|
77
77
|
type: IconComponent,
|
|
@@ -95,7 +95,7 @@ var AccordionItemComponent = class AccordionItemComponent {
|
|
|
95
95
|
};
|
|
96
96
|
i0.ɵɵngDeclareClassMetadata({
|
|
97
97
|
minVersion: "12.0.0",
|
|
98
|
-
version: "22.2.
|
|
98
|
+
version: "22.2.3",
|
|
99
99
|
ngImport: i0,
|
|
100
100
|
type: AccordionItemComponent,
|
|
101
101
|
decorators: [{
|
|
@@ -116,7 +116,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
116
116
|
])],
|
|
117
117
|
imports: [IconComponent],
|
|
118
118
|
template: "<div [attr.aria-level]=\"headingLevel\" [attr.role]=\"headingLevel ? 'heading' : null\">\n <button\n type=\"button\"\n class=\"header\"\n [attr.aria-expanded]=\"isExpanded\"\n [attr.aria-controls]=\"_contentId\"\n [id]=\"_titleId\"\n [disabled]=\"isDisabled\"\n (click)=\"_onToggleExpanded($event)\"\n >\n <div class=\"title\" [class.bold]=\"isExpanded\">{{ getTitle() }}</div>\n <kirby-icon name=\"arrow-down\"></kirby-icon>\n </button>\n</div>\n<div\n class=\"content\"\n role=\"region\"\n [attr.aria-labelledby]=\"_titleId\"\n [id]=\"_contentId\"\n [@isExpanded]=\"!!isExpanded\"\n>\n <div class=\"content-body\" [class.padding]=\"hasPadding\">\n <ng-content></ng-content>\n </div>\n</div>\n",
|
|
119
|
-
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{display:block;border-top:
|
|
119
|
+
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{display:block;border-top:var(--kirby-stroke-xs) solid var(--kirby-color-border-base-quiet);border-bottom:var(--kirby-stroke-xs) solid var(--kirby-color-border-base-quiet);box-sizing:border-box}:host(.has-list){--kirby-item-background: transparent}:host(:first-of-type){--kirby-accordion-border-top-radius: var(--kirby-content-border-top-radius, 0)}:host(:last-of-type){--kirby-accordion-border-bottom-radius: var(--kirby-content-border-bottom-radius, 0)}:host(:last-of-type):has([aria-expanded=true]){--kirby-accordion-border-bottom-radius: 0}@media(hover:hover){:host:has(.header:hover){background-color:var(--kirby-color-fill-base-hover);color:var(--kirby-color-content-base-hover);border-color:var(--kirby-color-border-base-quiet-hover)}}:host:has(.header:active){background-color:var(--kirby-color-fill-base-active);color:var(--kirby-color-content-base-active);border-color:var(--kirby-color-border-base-quiet-active)}.header{border-radius:var(--kirby-accordion-border-top-radius, 0) var(--kirby-accordion-border-top-radius, 0) var(--kirby-accordion-border-bottom-radius, 0) var(--kirby-accordion-border-bottom-radius, 0)}.header:focus-visible{transition:all 80ms linear 0ms;box-shadow:var(--kirby-focus-ring-md-inset);outline:0}.header{display:flex;align-items:center;gap:var(--kirby-spacing-xxs);padding:var(--kirby-spacing-s);-webkit-user-select:none;user-select:none;width:100%;border:none;outline:none;background:none;box-shadow:none;font-family:var(--kirby-font-family);text-align:start;cursor:pointer}.title{flex-grow:2;display:flex;font-size:var(--kirby-font-size-n)}.kirby-icon{transition:transform var(--kirby-transition-duration-quick)}.content{overflow:hidden;cursor:default}.content-body.padding{padding:0 var(--kirby-spacing-s) var(--kirby-spacing-s)}button[disabled]{pointer-events:none;opacity:var(--kirby-opacity-40)}button{color:var(--kirby-color-content-base)}button[aria-expanded=true] .title{font-weight:var(--kirby-font-weight-bold)}button[aria-expanded=true] .kirby-icon{transform:rotate(180deg)}:host-context(kirby-accordion):not(:first-child){border-top:none}:host-context(kirby-card):first-child{border-top:none}:host-context(kirby-card):last-child{border-bottom:none}\n"]
|
|
120
120
|
}]
|
|
121
121
|
}],
|
|
122
122
|
propDecorators: {
|
|
@@ -151,7 +151,7 @@ var AccordionDirective = class AccordionDirective {
|
|
|
151
151
|
static {
|
|
152
152
|
this.ɵfac = i0.ɵɵngDeclareFactory({
|
|
153
153
|
minVersion: "12.0.0",
|
|
154
|
-
version: "22.2.
|
|
154
|
+
version: "22.2.3",
|
|
155
155
|
ngImport: i0,
|
|
156
156
|
type: AccordionDirective,
|
|
157
157
|
deps: [],
|
|
@@ -161,7 +161,7 @@ var AccordionDirective = class AccordionDirective {
|
|
|
161
161
|
static {
|
|
162
162
|
this.ɵdir = i0.ɵɵngDeclareDirective({
|
|
163
163
|
minVersion: "14.0.0",
|
|
164
|
-
version: "22.2.
|
|
164
|
+
version: "22.2.3",
|
|
165
165
|
type: AccordionDirective,
|
|
166
166
|
isStandalone: true,
|
|
167
167
|
selector: "[kirbyAccordion], kirby-accordion",
|
|
@@ -177,7 +177,7 @@ var AccordionDirective = class AccordionDirective {
|
|
|
177
177
|
};
|
|
178
178
|
i0.ɵɵngDeclareClassMetadata({
|
|
179
179
|
minVersion: "12.0.0",
|
|
180
|
-
version: "22.2.
|
|
180
|
+
version: "22.2.3",
|
|
181
181
|
ngImport: i0,
|
|
182
182
|
type: AccordionDirective,
|
|
183
183
|
decorators: [{
|
|
@@ -200,7 +200,7 @@ var AccordionModule = class AccordionModule {
|
|
|
200
200
|
static {
|
|
201
201
|
this.ɵfac = i0.ɵɵngDeclareFactory({
|
|
202
202
|
minVersion: "12.0.0",
|
|
203
|
-
version: "22.2.
|
|
203
|
+
version: "22.2.3",
|
|
204
204
|
ngImport: i0,
|
|
205
205
|
type: AccordionModule,
|
|
206
206
|
deps: [],
|
|
@@ -210,7 +210,7 @@ var AccordionModule = class AccordionModule {
|
|
|
210
210
|
static {
|
|
211
211
|
this.ɵmod = i0.ɵɵngDeclareNgModule({
|
|
212
212
|
minVersion: "14.0.0",
|
|
213
|
-
version: "22.2.
|
|
213
|
+
version: "22.2.3",
|
|
214
214
|
ngImport: i0,
|
|
215
215
|
type: AccordionModule,
|
|
216
216
|
imports: [
|
|
@@ -224,7 +224,7 @@ var AccordionModule = class AccordionModule {
|
|
|
224
224
|
static {
|
|
225
225
|
this.ɵinj = i0.ɵɵngDeclareInjector({
|
|
226
226
|
minVersion: "12.0.0",
|
|
227
|
-
version: "22.2.
|
|
227
|
+
version: "22.2.3",
|
|
228
228
|
ngImport: i0,
|
|
229
229
|
type: AccordionModule,
|
|
230
230
|
imports: [IconModule, AccordionItemComponent]
|
|
@@ -233,7 +233,7 @@ var AccordionModule = class AccordionModule {
|
|
|
233
233
|
};
|
|
234
234
|
i0.ɵɵngDeclareClassMetadata({
|
|
235
235
|
minVersion: "12.0.0",
|
|
236
|
-
version: "22.2.
|
|
236
|
+
version: "22.2.3",
|
|
237
237
|
ngImport: i0,
|
|
238
238
|
type: AccordionModule,
|
|
239
239
|
decorators: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kirbydesign-designsystem-accordion.mjs","names":[],"sources":["../../accordion/src/accordion-item.component.ts","../../accordion/src/accordion-item.component.html","../../accordion/src/accordion.directive.ts","../../accordion/src/accordion.module.ts"],"sourcesContent":["import { animate, state, style, transition, trigger } from '@angular/animations';\nimport {\n AfterContentInit,\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n EventEmitter,\n HostBinding,\n Input,\n OnChanges,\n Output,\n QueryList,\n} from '@angular/core';\nimport { ListComponent } from '@kirbydesign/designsystem/list';\nimport { IconComponent } from '@kirbydesign/designsystem/icon';\n\n// Counter for generating unique element ids\nlet uniqueId = 0;\n\n@Component({\n selector: 'kirby-accordion-item',\n templateUrl: './accordion-item.component.html',\n styleUrls: ['./accordion-item.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n animations: [\n trigger('isExpanded', [\n state('true', style({ height: '*', visibility: 'visible' })),\n state('false', style({ height: '0px', visibility: 'hidden' })),\n transition('true <=> false', animate('0.2s')),\n ]),\n ],\n imports: [IconComponent],\n})\nexport class AccordionItemComponent implements OnChanges, AfterContentInit {\n @HostBinding('class.has-list') hasList: boolean = false;\n @Input() title: string;\n @Input() isExpanded: boolean = false;\n @Input() isDisabled: boolean = false;\n @Input() disabledTitle: string;\n @Input() hasPadding: boolean = true;\n @Input() headingLevel: 1 | 2 | 3 | 4 | 5 | 6;\n @Output() toggle: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n @ContentChildren(ListComponent) listChildren: QueryList<ListComponent>;\n\n ngAfterContentInit(): void {\n if (this.listChildren.length > 0) {\n this.hasPadding = false;\n this.hasList = true;\n this.listChildren.forEach((child) => {\n child.shape = 'none';\n });\n }\n }\n\n ngOnChanges(): void {\n if (this.isDisabled) {\n this.isExpanded = false;\n }\n }\n\n getTitle() {\n if (this.isDisabled && !!this.disabledTitle) {\n return this.disabledTitle;\n } else {\n return this.title;\n }\n }\n\n _onToggleExpanded(event: UIEvent) {\n event.preventDefault();\n if (this.isDisabled) return;\n\n this.isExpanded = !this.isExpanded && !this.isDisabled;\n this.toggle.emit(this.isExpanded);\n }\n\n // IDs used for a11y labelling\n _titleId = `kirby-accordion-item-title-${++uniqueId}`;\n _contentId = `kirby-accordion-item-content-${uniqueId}`;\n}\n","<div [attr.aria-level]=\"headingLevel\" [attr.role]=\"headingLevel ? 'heading' : null\">\n <button\n type=\"button\"\n class=\"header\"\n [attr.aria-expanded]=\"isExpanded\"\n [attr.aria-controls]=\"_contentId\"\n [id]=\"_titleId\"\n [disabled]=\"isDisabled\"\n (click)=\"_onToggleExpanded($event)\"\n >\n <div class=\"title\" [class.bold]=\"isExpanded\">{{ getTitle() }}</div>\n <kirby-icon name=\"arrow-down\"></kirby-icon>\n </button>\n</div>\n<div\n class=\"content\"\n role=\"region\"\n [attr.aria-labelledby]=\"_titleId\"\n [id]=\"_contentId\"\n [@isExpanded]=\"!!isExpanded\"\n>\n <div class=\"content-body\" [class.padding]=\"hasPadding\">\n <ng-content></ng-content>\n </div>\n</div>\n","import { AfterContentInit, ContentChildren, Directive, Input, QueryList } from '@angular/core';\n\nimport { startWith } from 'rxjs';\nimport { AccordionItemComponent } from './accordion-item.component';\n\n@Directive({\n selector: '[kirbyAccordion], kirby-accordion',\n exportAs: 'kirby-accordion',\n})\nexport class AccordionDirective implements AfterContentInit {\n @Input() headingLevel: 1 | 2 | 3 | 4 | 5 | 6;\n @ContentChildren(AccordionItemComponent) accordionItems: QueryList<AccordionItemComponent>;\n\n ngAfterContentInit(): void {\n this.accordionItems.changes.pipe(startWith(0)).subscribe(() => {\n this.setHeadingLevels();\n });\n }\n\n private setHeadingLevels(): void {\n if (this.accordionItems.length > 0 && this.headingLevel) {\n this.accordionItems.forEach((child) => {\n child.headingLevel = this.headingLevel;\n });\n }\n }\n}\n","import { NgModule } from '@angular/core';\nimport { IconModule } from '@kirbydesign/designsystem/icon';\n\nimport { AccordionItemComponent } from './accordion-item.component';\nimport { AccordionDirective } from './accordion.directive';\n\nconst imports = [AccordionDirective, AccordionItemComponent];\n\n@NgModule({\n imports: [IconModule, ...imports],\n exports: [...imports],\n})\nexport class AccordionModule {}\n"],"mappings":";;;;;;AAiBA,IAAI,WAAW;AAgBf,IAAa,yBAAb,MAAa,uBAAsB;CAdnC,cAAA;EAeiC,KAAA,UAAmB;EAEzC,KAAA,aAAsB;EACtB,KAAA,aAAsB;EAEtB,KAAA,aAAsB;EAErB,KAAA,SAAgC,IAAI,aAAY;EAqC1D,KAAA,WAAW,8BAA8B,EAAE;EAC3C,KAAA,aAAa,gCAAgC;CAC9C;CAnCC,qBAAkB;EAChB,IAAI,KAAK,aAAa,SAAS,GAAG;GAChC,KAAK,aAAa;GAClB,KAAK,UAAU;GACf,KAAK,aAAa,SAAS,UAAS;IAClC,MAAM,QAAQ;GAChB,CAAC;EACH;CACF;CAEA,cAAW;EACT,IAAI,KAAK,YACP,KAAK,aAAa;CAEtB;CAEA,WAAQ;EACN,IAAI,KAAK,cAAc,CAAC,CAAC,KAAK,eAC5B,OAAO,KAAK;OAEZ,OAAO,KAAK;CAEhB;CAEA,kBAAkB,OAAc;EAC9B,MAAM,eAAc;EACpB,IAAI,KAAK,YAAY;EAErB,KAAK,aAAa,CAAC,KAAK,cAAc,CAAC,KAAK;EAC5C,KAAK,OAAO,KAAK,KAAK,UAAU;CAClC;CA1CW;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAsB,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAtB;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAsB,cAAA;GAAA,UAAA;GAAA,QAAA;IAAA,OAAA;IAAA,YAAA;IAAA,YAAA;IAAA,eAAA;IAAA,YAAA;IAAA,cAAA;GAAA;GAAA,SAAA,EAAA,QAAA,SAAA;GAAA,MAAA,EAAA,YAAA,EAAA,kBAAA,eAAA,EAAA;GAAA,SAAA,CAAA;IAAA,cAAA;IAAA,WAUhB;GAAa,CAAA;GAAA,eAAA;GAAA,UAAA;GAAA,UC3ChC;GAyBA,QAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"kirbydesign-designsystem-accordion.mjs","names":[],"sources":["../../accordion/src/accordion-item.component.ts","../../accordion/src/accordion-item.component.html","../../accordion/src/accordion.directive.ts","../../accordion/src/accordion.module.ts"],"sourcesContent":["import { animate, state, style, transition, trigger } from '@angular/animations';\nimport {\n AfterContentInit,\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n EventEmitter,\n HostBinding,\n Input,\n OnChanges,\n Output,\n QueryList,\n} from '@angular/core';\nimport { ListComponent } from '@kirbydesign/designsystem/list';\nimport { IconComponent } from '@kirbydesign/designsystem/icon';\n\n// Counter for generating unique element ids\nlet uniqueId = 0;\n\n@Component({\n selector: 'kirby-accordion-item',\n templateUrl: './accordion-item.component.html',\n styleUrls: ['./accordion-item.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n animations: [\n trigger('isExpanded', [\n state('true', style({ height: '*', visibility: 'visible' })),\n state('false', style({ height: '0px', visibility: 'hidden' })),\n transition('true <=> false', animate('0.2s')),\n ]),\n ],\n imports: [IconComponent],\n})\nexport class AccordionItemComponent implements OnChanges, AfterContentInit {\n @HostBinding('class.has-list') hasList: boolean = false;\n @Input() title: string;\n @Input() isExpanded: boolean = false;\n @Input() isDisabled: boolean = false;\n @Input() disabledTitle: string;\n @Input() hasPadding: boolean = true;\n @Input() headingLevel: 1 | 2 | 3 | 4 | 5 | 6;\n @Output() toggle: EventEmitter<boolean> = new EventEmitter<boolean>();\n\n @ContentChildren(ListComponent) listChildren: QueryList<ListComponent>;\n\n ngAfterContentInit(): void {\n if (this.listChildren.length > 0) {\n this.hasPadding = false;\n this.hasList = true;\n this.listChildren.forEach((child) => {\n child.shape = 'none';\n });\n }\n }\n\n ngOnChanges(): void {\n if (this.isDisabled) {\n this.isExpanded = false;\n }\n }\n\n getTitle() {\n if (this.isDisabled && !!this.disabledTitle) {\n return this.disabledTitle;\n } else {\n return this.title;\n }\n }\n\n _onToggleExpanded(event: UIEvent) {\n event.preventDefault();\n if (this.isDisabled) return;\n\n this.isExpanded = !this.isExpanded && !this.isDisabled;\n this.toggle.emit(this.isExpanded);\n }\n\n // IDs used for a11y labelling\n _titleId = `kirby-accordion-item-title-${++uniqueId}`;\n _contentId = `kirby-accordion-item-content-${uniqueId}`;\n}\n","<div [attr.aria-level]=\"headingLevel\" [attr.role]=\"headingLevel ? 'heading' : null\">\n <button\n type=\"button\"\n class=\"header\"\n [attr.aria-expanded]=\"isExpanded\"\n [attr.aria-controls]=\"_contentId\"\n [id]=\"_titleId\"\n [disabled]=\"isDisabled\"\n (click)=\"_onToggleExpanded($event)\"\n >\n <div class=\"title\" [class.bold]=\"isExpanded\">{{ getTitle() }}</div>\n <kirby-icon name=\"arrow-down\"></kirby-icon>\n </button>\n</div>\n<div\n class=\"content\"\n role=\"region\"\n [attr.aria-labelledby]=\"_titleId\"\n [id]=\"_contentId\"\n [@isExpanded]=\"!!isExpanded\"\n>\n <div class=\"content-body\" [class.padding]=\"hasPadding\">\n <ng-content></ng-content>\n </div>\n</div>\n","import { AfterContentInit, ContentChildren, Directive, Input, QueryList } from '@angular/core';\n\nimport { startWith } from 'rxjs';\nimport { AccordionItemComponent } from './accordion-item.component';\n\n@Directive({\n selector: '[kirbyAccordion], kirby-accordion',\n exportAs: 'kirby-accordion',\n})\nexport class AccordionDirective implements AfterContentInit {\n @Input() headingLevel: 1 | 2 | 3 | 4 | 5 | 6;\n @ContentChildren(AccordionItemComponent) accordionItems: QueryList<AccordionItemComponent>;\n\n ngAfterContentInit(): void {\n this.accordionItems.changes.pipe(startWith(0)).subscribe(() => {\n this.setHeadingLevels();\n });\n }\n\n private setHeadingLevels(): void {\n if (this.accordionItems.length > 0 && this.headingLevel) {\n this.accordionItems.forEach((child) => {\n child.headingLevel = this.headingLevel;\n });\n }\n }\n}\n","import { NgModule } from '@angular/core';\nimport { IconModule } from '@kirbydesign/designsystem/icon';\n\nimport { AccordionItemComponent } from './accordion-item.component';\nimport { AccordionDirective } from './accordion.directive';\n\nconst imports = [AccordionDirective, AccordionItemComponent];\n\n@NgModule({\n imports: [IconModule, ...imports],\n exports: [...imports],\n})\nexport class AccordionModule {}\n"],"mappings":"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"}
|
|
@@ -70,7 +70,7 @@ var ActionGroupComponent = class ActionGroupComponent {
|
|
|
70
70
|
static {
|
|
71
71
|
this.ɵfac = i0.ɵɵngDeclareFactory({
|
|
72
72
|
minVersion: "12.0.0",
|
|
73
|
-
version: "22.2.
|
|
73
|
+
version: "22.2.3",
|
|
74
74
|
ngImport: i0,
|
|
75
75
|
type: ActionGroupComponent,
|
|
76
76
|
deps: [
|
|
@@ -87,7 +87,7 @@ var ActionGroupComponent = class ActionGroupComponent {
|
|
|
87
87
|
static {
|
|
88
88
|
this.ɵcmp = i0.ɵɵngDeclareComponent({
|
|
89
89
|
minVersion: "17.0.0",
|
|
90
|
-
version: "22.2.
|
|
90
|
+
version: "22.2.3",
|
|
91
91
|
type: ActionGroupComponent,
|
|
92
92
|
isStandalone: true,
|
|
93
93
|
selector: "kirby-action-group",
|
|
@@ -166,7 +166,7 @@ var ActionGroupComponent = class ActionGroupComponent {
|
|
|
166
166
|
};
|
|
167
167
|
i0.ɵɵngDeclareClassMetadata({
|
|
168
168
|
minVersion: "12.0.0",
|
|
169
|
-
version: "22.2.
|
|
169
|
+
version: "22.2.3",
|
|
170
170
|
ngImport: i0,
|
|
171
171
|
type: ActionGroupComponent,
|
|
172
172
|
decorators: [{
|
|
@@ -27,7 +27,7 @@ var AvatarComponent = class AvatarComponent {
|
|
|
27
27
|
static {
|
|
28
28
|
this.ɵfac = i0.ɵɵngDeclareFactory({
|
|
29
29
|
minVersion: "12.0.0",
|
|
30
|
-
version: "22.2.
|
|
30
|
+
version: "22.2.3",
|
|
31
31
|
ngImport: i0,
|
|
32
32
|
type: AvatarComponent,
|
|
33
33
|
deps: [],
|
|
@@ -37,7 +37,7 @@ var AvatarComponent = class AvatarComponent {
|
|
|
37
37
|
static {
|
|
38
38
|
this.ɵcmp = i0.ɵɵngDeclareComponent({
|
|
39
39
|
minVersion: "17.0.0",
|
|
40
|
-
version: "22.2.
|
|
40
|
+
version: "22.2.3",
|
|
41
41
|
type: AvatarComponent,
|
|
42
42
|
isStandalone: true,
|
|
43
43
|
selector: "kirby-avatar",
|
|
@@ -55,7 +55,7 @@ var AvatarComponent = class AvatarComponent {
|
|
|
55
55
|
host: { properties: { "class": "this._cssClass" } },
|
|
56
56
|
ngImport: i0,
|
|
57
57
|
template: "<div class=\"avatar\" [ngClass]=\"{ overlay: overlay }\">\n @if (imageSrc) {\n <img\n [src]=\"imageSrc\"\n [attr.alt]=\"altText\"\n [attr.loading]=\"imageLoading\"\n (error)=\"onImageError($event)\"\n />\n }\n @if (!text) {\n <ng-content select=\"kirby-icon\"></ng-content>\n }\n @if (text) {\n <span class=\"avatar-text\">{{ text }}</span>\n }\n</div>\n<ng-content select=\"kirby-badge\"></ng-content>\n",
|
|
58
|
-
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{--kirby-badge-position: absolute;--kirby-badge-right: calc(6px - .5rem) ;--kirby-badge-top: calc(6px - .5rem) ;--kirby-badge-z-index: var(--kirby-z-index-avatar-badge);position:relative}.avatar{width:40px;height:40px;border:
|
|
58
|
+
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{--kirby-badge-position: absolute;--kirby-badge-right: calc(6px - .5rem) ;--kirby-badge-top: calc(6px - .5rem) ;--kirby-badge-z-index: var(--kirby-z-index-avatar-badge);position:relative}.avatar{width:40px;height:40px;border:var(--kirby-stroke-xs) solid var(--kirby-color-border-raised-quiet);border-radius:var(--kirby-border-radius-circle);box-sizing:border-box;overflow:hidden;position:relative;z-index:1;display:flex;justify-content:center;align-items:center;background-color:var(--kirby-avatar-background-color, var(--kirby-color-fill-raised));color:var(--kirby-avatar-color, var(--kirby-color-content-raised))}.avatar.overlay:before{content:\"\";background-color:var(--kirby-black);opacity:var(--kirby-opacity-5);width:100%;height:100%;position:absolute;top:0;left:0}.avatar img{object-fit:cover;max-width:100%;height:100%;width:100%}:host(.xs) .avatar{--kirby-icon-font-size: 24px;width:32px;height:32px;border-radius:8px}:host(.xs) .avatar .avatar-text{font-size:var(--kirby-font-size-s)}:host-context(kirby-progress-circle.sm) .avatar,:host(.sm) .avatar{--kirby-icon-font-size: 24px;width:40px;height:40px}:host-context(kirby-progress-circle.sm) .avatar .avatar-text,:host(.sm) .avatar .avatar-text{font-size:var(--kirby-font-size-s)}:host-context(kirby-progress-circle.md),:host(.md){--kirby-badge-right: calc(8px - .5rem) ;--kirby-badge-top: calc(8px - .5rem) }:host-context(kirby-progress-circle.md) .avatar,:host(.md) .avatar{--kirby-icon-font-size: 32px;width:56px;height:56px}:host-context(kirby-progress-circle.md) .avatar .avatar-text,:host(.md) .avatar .avatar-text{font-size:var(--kirby-font-size-m)}:host-context(kirby-progress-circle.lg),:host(.lg){--kirby-badge-right: calc(14px - .5rem) ;--kirby-badge-top: calc(14px - .5rem) }:host-context(kirby-progress-circle.lg) .avatar,:host(.lg) .avatar{--kirby-icon-font-size: 56px;width:96px;height:96px}:host-context(kirby-progress-circle.lg) .avatar .avatar-text,:host(.lg) .avatar .avatar-text{font-size:var(--kirby-font-size-xl)}:host-context(kirby-item)[slot=start]{margin-inline-end:var(--kirby-spacing-xs)}:host-context(kirby-item)[slot=start].xs{margin-inline-end:var(--kirby-spacing-s)}:host(.primary){--kirby-avatar-background-color: var(--kirby-primary);--kirby-avatar-color: var(--kirby-primary-contrast)}:host(.secondary){--kirby-avatar-background-color: var(--kirby-secondary);--kirby-avatar-color: var(--kirby-secondary-contrast)}:host(.tertiary){--kirby-avatar-background-color: var(--kirby-tertiary);--kirby-avatar-color: var(--kirby-tertiary-contrast)}:host(.success){--kirby-avatar-background-color: var(--kirby-success);--kirby-avatar-color: var(--kirby-success-contrast)}:host(.warning){--kirby-avatar-background-color: var(--kirby-warning);--kirby-avatar-color: var(--kirby-warning-contrast)}:host(.danger){--kirby-avatar-background-color: var(--kirby-danger);--kirby-avatar-color: var(--kirby-danger-contrast)}:host(.white-overlay){--kirby-avatar-background-color: var(--kirby-white-overlay);--kirby-avatar-color: var(--kirby-white-overlay-contrast)}:host(.light){--kirby-avatar-background-color: var(--kirby-color-fill-raised);--kirby-avatar-color: var(--kirby-color-content-raised)}:host(.medium){--kirby-avatar-background-color: var(--kirby-medium);--kirby-avatar-color: var(--kirby-medium-contrast)}:host(.dark){--kirby-avatar-background-color: var(--kirby-dark);--kirby-avatar-color: var(--kirby-dark-contrast)}:host(.dark-overlay){--kirby-avatar-background-color: var(--kirby-dark-overlay);--kirby-avatar-color: var(--kirby-dark-overlay-contrast)}:host(.white){--kirby-avatar-background-color: var(--kirby-color-fill-raised);--kirby-avatar-color: var(--kirby-color-content-raised)}:host(.semi-light){--kirby-avatar-background-color: var(--kirby-semi-light);--kirby-avatar-color: var(--kirby-semi-light-contrast)}\n"],
|
|
59
59
|
dependencies: [{
|
|
60
60
|
kind: "ngmodule",
|
|
61
61
|
type: CommonModule
|
|
@@ -71,7 +71,7 @@ var AvatarComponent = class AvatarComponent {
|
|
|
71
71
|
};
|
|
72
72
|
i0.ɵɵngDeclareClassMetadata({
|
|
73
73
|
minVersion: "12.0.0",
|
|
74
|
-
version: "22.2.
|
|
74
|
+
version: "22.2.3",
|
|
75
75
|
ngImport: i0,
|
|
76
76
|
type: AvatarComponent,
|
|
77
77
|
decorators: [{
|
|
@@ -81,7 +81,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
81
81
|
selector: "kirby-avatar",
|
|
82
82
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
83
83
|
template: "<div class=\"avatar\" [ngClass]=\"{ overlay: overlay }\">\n @if (imageSrc) {\n <img\n [src]=\"imageSrc\"\n [attr.alt]=\"altText\"\n [attr.loading]=\"imageLoading\"\n (error)=\"onImageError($event)\"\n />\n }\n @if (!text) {\n <ng-content select=\"kirby-icon\"></ng-content>\n }\n @if (text) {\n <span class=\"avatar-text\">{{ text }}</span>\n }\n</div>\n<ng-content select=\"kirby-badge\"></ng-content>\n",
|
|
84
|
-
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{--kirby-badge-position: absolute;--kirby-badge-right: calc(6px - .5rem) ;--kirby-badge-top: calc(6px - .5rem) ;--kirby-badge-z-index: var(--kirby-z-index-avatar-badge);position:relative}.avatar{width:40px;height:40px;border:
|
|
84
|
+
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{--kirby-badge-position: absolute;--kirby-badge-right: calc(6px - .5rem) ;--kirby-badge-top: calc(6px - .5rem) ;--kirby-badge-z-index: var(--kirby-z-index-avatar-badge);position:relative}.avatar{width:40px;height:40px;border:var(--kirby-stroke-xs) solid var(--kirby-color-border-raised-quiet);border-radius:var(--kirby-border-radius-circle);box-sizing:border-box;overflow:hidden;position:relative;z-index:1;display:flex;justify-content:center;align-items:center;background-color:var(--kirby-avatar-background-color, var(--kirby-color-fill-raised));color:var(--kirby-avatar-color, var(--kirby-color-content-raised))}.avatar.overlay:before{content:\"\";background-color:var(--kirby-black);opacity:var(--kirby-opacity-5);width:100%;height:100%;position:absolute;top:0;left:0}.avatar img{object-fit:cover;max-width:100%;height:100%;width:100%}:host(.xs) .avatar{--kirby-icon-font-size: 24px;width:32px;height:32px;border-radius:8px}:host(.xs) .avatar .avatar-text{font-size:var(--kirby-font-size-s)}:host-context(kirby-progress-circle.sm) .avatar,:host(.sm) .avatar{--kirby-icon-font-size: 24px;width:40px;height:40px}:host-context(kirby-progress-circle.sm) .avatar .avatar-text,:host(.sm) .avatar .avatar-text{font-size:var(--kirby-font-size-s)}:host-context(kirby-progress-circle.md),:host(.md){--kirby-badge-right: calc(8px - .5rem) ;--kirby-badge-top: calc(8px - .5rem) }:host-context(kirby-progress-circle.md) .avatar,:host(.md) .avatar{--kirby-icon-font-size: 32px;width:56px;height:56px}:host-context(kirby-progress-circle.md) .avatar .avatar-text,:host(.md) .avatar .avatar-text{font-size:var(--kirby-font-size-m)}:host-context(kirby-progress-circle.lg),:host(.lg){--kirby-badge-right: calc(14px - .5rem) ;--kirby-badge-top: calc(14px - .5rem) }:host-context(kirby-progress-circle.lg) .avatar,:host(.lg) .avatar{--kirby-icon-font-size: 56px;width:96px;height:96px}:host-context(kirby-progress-circle.lg) .avatar .avatar-text,:host(.lg) .avatar .avatar-text{font-size:var(--kirby-font-size-xl)}:host-context(kirby-item)[slot=start]{margin-inline-end:var(--kirby-spacing-xs)}:host-context(kirby-item)[slot=start].xs{margin-inline-end:var(--kirby-spacing-s)}:host(.primary){--kirby-avatar-background-color: var(--kirby-primary);--kirby-avatar-color: var(--kirby-primary-contrast)}:host(.secondary){--kirby-avatar-background-color: var(--kirby-secondary);--kirby-avatar-color: var(--kirby-secondary-contrast)}:host(.tertiary){--kirby-avatar-background-color: var(--kirby-tertiary);--kirby-avatar-color: var(--kirby-tertiary-contrast)}:host(.success){--kirby-avatar-background-color: var(--kirby-success);--kirby-avatar-color: var(--kirby-success-contrast)}:host(.warning){--kirby-avatar-background-color: var(--kirby-warning);--kirby-avatar-color: var(--kirby-warning-contrast)}:host(.danger){--kirby-avatar-background-color: var(--kirby-danger);--kirby-avatar-color: var(--kirby-danger-contrast)}:host(.white-overlay){--kirby-avatar-background-color: var(--kirby-white-overlay);--kirby-avatar-color: var(--kirby-white-overlay-contrast)}:host(.light){--kirby-avatar-background-color: var(--kirby-color-fill-raised);--kirby-avatar-color: var(--kirby-color-content-raised)}:host(.medium){--kirby-avatar-background-color: var(--kirby-medium);--kirby-avatar-color: var(--kirby-medium-contrast)}:host(.dark){--kirby-avatar-background-color: var(--kirby-dark);--kirby-avatar-color: var(--kirby-dark-contrast)}:host(.dark-overlay){--kirby-avatar-background-color: var(--kirby-dark-overlay);--kirby-avatar-color: var(--kirby-dark-overlay-contrast)}:host(.white){--kirby-avatar-background-color: var(--kirby-color-fill-raised);--kirby-avatar-color: var(--kirby-color-content-raised)}:host(.semi-light){--kirby-avatar-background-color: var(--kirby-semi-light);--kirby-avatar-color: var(--kirby-semi-light-contrast)}\n"]
|
|
85
85
|
}]
|
|
86
86
|
}],
|
|
87
87
|
propDecorators: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kirbydesign-designsystem-avatar.mjs","names":[],"sources":["../../avatar/src/avatar.component.ts","../../avatar/src/avatar.component.html"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n HostBinding,\n Input,\n Output,\n} from '@angular/core';\n\nimport { BrandColor, NotificationColor } from '@kirbydesign/core';\n\nexport enum AvatarSize {\n XS = 'xs',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n}\n\n@Component({\n imports: [CommonModule],\n selector: 'kirby-avatar',\n templateUrl: './avatar.component.html',\n styleUrls: ['./avatar.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class AvatarComponent {\n @Input() imageSrc: string;\n @Input() imageLoading: 'eager' | 'lazy' | undefined;\n @Input() altText: string;\n /**\n * @deprecated The avatar now always has an outline, so this input no longer has any effect.\n * This input will be removed in a future major version.\n */\n @Input() set stroke(_value: boolean) {\n console.warn(\n `[Kirby Avatar] The 'stroke' input is deprecated and no longer has any effect.\n The avatar now always has an outline. This input will be removed in a future major version.`\n );\n }\n @Input() text: string;\n @Input() overlay: boolean;\n @Input() size: AvatarSize | `${AvatarSize}` = AvatarSize.SM;\n @Input()\n themeColor: NotificationColor | BrandColor | 'medium' | 'white' | 'dark' | 'light' | 'semi-light';\n @Output()\n imageError: EventEmitter<ErrorEvent> = new EventEmitter();\n\n @HostBinding('class')\n get _cssClass() {\n return [this.themeColor, this.size].filter((cssClass) => !!cssClass);\n }\n\n onImageError($event: ErrorEvent) {\n this.imageError.emit($event);\n }\n}\n","<div class=\"avatar\" [ngClass]=\"{ overlay: overlay }\">\n @if (imageSrc) {\n <img\n [src]=\"imageSrc\"\n [attr.alt]=\"altText\"\n [attr.loading]=\"imageLoading\"\n (error)=\"onImageError($event)\"\n />\n }\n @if (!text) {\n <ng-content select=\"kirby-icon\"></ng-content>\n }\n @if (text) {\n <span class=\"avatar-text\">{{ text }}</span>\n }\n</div>\n<ng-content select=\"kirby-badge\"></ng-content>\n"],"mappings":";;;;AAYA,IAAY;CAAZ,SAAY,YAAU;CACpB,WAAA,QAAA;CACA,WAAA,QAAA;CACA,WAAA,QAAA;CACA,WAAA,QAAA;AACF,EAAA,CALY,eAAA,aAAU,CAAA,EAAA;AActB,IAAa,kBAAb,MAAa,gBAAe;CAP5B,cAAA;EAuBW,KAAA,OAAqC,WAAW;EAIzD,KAAA,aAAuC,IAAI,aAAY;CAUxD;CAtBC,IAAa,OAAO,QAAe;EACjC,QAAQ,KACN;oGAC8F;CAElG;CASA,IACI,YAAS;EACX,OAAO,CAAC,KAAK,YAAY,KAAK,IAAI,CAAC,CAAC,QAAQ,aAAa,CAAC,CAAC,QAAQ;CACrE;CAEA,aAAa,QAAkB;EAC7B,KAAK,WAAW,KAAK,MAAM;CAC7B;CA7BW;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAe,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAf;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAe,cAAA;GAAA,UAAA;GAAA,QAAA;IAAA,UAAA;IAAA,cAAA;IAAA,SAAA;IAAA,QAAA;IAAA,MAAA;IAAA,SAAA;IAAA,MAAA;IAAA,YAAA;GAAA;GAAA,SAAA,EAAA,YAAA,aAAA;GAAA,MAAA,EAAA,YAAA,EAAA,SAAA,iBAAA,EAAA;GAAA,UAAA;GAAA,UC1B5B;GAiBA,QAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"kirbydesign-designsystem-avatar.mjs","names":[],"sources":["../../avatar/src/avatar.component.ts","../../avatar/src/avatar.component.html"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n HostBinding,\n Input,\n Output,\n} from '@angular/core';\n\nimport { BrandColor, NotificationColor } from '@kirbydesign/core';\n\nexport enum AvatarSize {\n XS = 'xs',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n}\n\n@Component({\n imports: [CommonModule],\n selector: 'kirby-avatar',\n templateUrl: './avatar.component.html',\n styleUrls: ['./avatar.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class AvatarComponent {\n @Input() imageSrc: string;\n @Input() imageLoading: 'eager' | 'lazy' | undefined;\n @Input() altText: string;\n /**\n * @deprecated The avatar now always has an outline, so this input no longer has any effect.\n * This input will be removed in a future major version.\n */\n @Input() set stroke(_value: boolean) {\n console.warn(\n `[Kirby Avatar] The 'stroke' input is deprecated and no longer has any effect.\n The avatar now always has an outline. This input will be removed in a future major version.`\n );\n }\n @Input() text: string;\n @Input() overlay: boolean;\n @Input() size: AvatarSize | `${AvatarSize}` = AvatarSize.SM;\n @Input()\n themeColor: NotificationColor | BrandColor | 'medium' | 'white' | 'dark' | 'light' | 'semi-light';\n @Output()\n imageError: EventEmitter<ErrorEvent> = new EventEmitter();\n\n @HostBinding('class')\n get _cssClass() {\n return [this.themeColor, this.size].filter((cssClass) => !!cssClass);\n }\n\n onImageError($event: ErrorEvent) {\n this.imageError.emit($event);\n }\n}\n","<div class=\"avatar\" [ngClass]=\"{ overlay: overlay }\">\n @if (imageSrc) {\n <img\n [src]=\"imageSrc\"\n [attr.alt]=\"altText\"\n [attr.loading]=\"imageLoading\"\n (error)=\"onImageError($event)\"\n />\n }\n @if (!text) {\n <ng-content select=\"kirby-icon\"></ng-content>\n }\n @if (text) {\n <span class=\"avatar-text\">{{ text }}</span>\n }\n</div>\n<ng-content select=\"kirby-badge\"></ng-content>\n"],"mappings":";;;;AAYA,IAAY;CAAZ,SAAY,YAAU;CACpB,WAAA,QAAA;CACA,WAAA,QAAA;CACA,WAAA,QAAA;CACA,WAAA,QAAA;AACF,EAAA,CALY,eAAA,aAAU,CAAA,EAAA;AActB,IAAa,kBAAb,MAAa,gBAAe;CAP5B,cAAA;EAuBW,KAAA,OAAqC,WAAW;EAIzD,KAAA,aAAuC,IAAI,aAAY;CAUxD;CAtBC,IAAa,OAAO,QAAe;EACjC,QAAQ,KACN;oGAC8F;CAElG;CASA,IACI,YAAS;EACX,OAAO,CAAC,KAAK,YAAY,KAAK,IAAI,CAAC,CAAC,QAAQ,aAAa,CAAC,CAAC,QAAQ;CACrE;CAEA,aAAa,QAAkB;EAC7B,KAAK,WAAW,KAAK,MAAM;CAC7B;CA7BW;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAe,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAf;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAe,cAAA;GAAA,UAAA;GAAA,QAAA;IAAA,UAAA;IAAA,cAAA;IAAA,SAAA;IAAA,QAAA;IAAA,MAAA;IAAA,SAAA;IAAA,MAAA;IAAA,YAAA;GAAA;GAAA,SAAA,EAAA,YAAA,aAAA;GAAA,MAAA,EAAA,YAAA,EAAA,SAAA,iBAAA,EAAA;GAAA,UAAA;GAAA,UC1B5B;GAiBA,QAAA,CAAA,m2HAAA;GAAA,cAAA,CAAA;IAAA,MAAA;IAAA,MDGY;GAAY,GAAA;IAAA,MAAA;IAAA,MAAA,GAAA;IAAA,UAAA;IAAA,QAAA,CAAA,SAAA,SAAA;GAAA,CAAA;GAAA,iBAAA,GAAA,wBAAA;EAAA,CAAA;CAAA;;AAMX,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAe,YAAA,CAAA;EAP3B,MAAA;EACU,MAAA,CAAA;GAAA,SAAA,CAAC,YAAY;GAAC,UACb;GAAc,iBAGP,wBAAwB;GAAM,UAAA;GAAA,QAAA,CAAA,m2HAAA;EAAA,CAAA;;;EAG9C,UAAA,CAAA,EAAA,MAAA,MAAA,CAAA;EACA,cAAA,CAAA,EAAA,MAAA,MAAA,CAAA;EACA,SAAA,CAAA,EAAA,MAAA,MAAA,CAAA;EAKA,QAAA,CAAA,EAAA,MAAA,MAAA,CAAA;EAMA,MAAA,CAAA,EAAA,MAAA,MAAA,CAAA;EACA,SAAA,CAAA,EAAA,MAAA,MAAA,CAAA;EACA,MAAA,CAAA,EAAA,MAAA,MAAA,CAAA;EACA,YAAA,CAAA,EAAA,MAAA,MAAA,CAAA;EAEA,YAAA,CAAA,EAAA,MAAA,OAAA,CAAA;;GAGA,MAAA;GAAY,MAAA,CAAA,OAAO"}
|
|
@@ -18,7 +18,7 @@ var BadgeComponent = class BadgeComponent {
|
|
|
18
18
|
static {
|
|
19
19
|
this.ɵfac = i0.ɵɵngDeclareFactory({
|
|
20
20
|
minVersion: "12.0.0",
|
|
21
|
-
version: "22.2.
|
|
21
|
+
version: "22.2.3",
|
|
22
22
|
ngImport: i0,
|
|
23
23
|
type: BadgeComponent,
|
|
24
24
|
deps: [],
|
|
@@ -28,7 +28,7 @@ var BadgeComponent = class BadgeComponent {
|
|
|
28
28
|
static {
|
|
29
29
|
this.ɵcmp = i0.ɵɵngDeclareComponent({
|
|
30
30
|
minVersion: "17.0.0",
|
|
31
|
-
version: "22.2.
|
|
31
|
+
version: "22.2.3",
|
|
32
32
|
type: BadgeComponent,
|
|
33
33
|
isStandalone: true,
|
|
34
34
|
selector: "kirby-badge",
|
|
@@ -43,7 +43,7 @@ var BadgeComponent = class BadgeComponent {
|
|
|
43
43
|
}],
|
|
44
44
|
ngImport: i0,
|
|
45
45
|
template: "<ion-badge>\n @if (size === 'sm') {\n <span></span>\n }\n @if (!text && size === 'md') {\n <ng-content></ng-content>\n }\n @if (text && size === 'md') {\n {{ text }}\n }\n</ion-badge>\n",
|
|
46
|
-
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{position:var(--kirby-badge-position, relative);left:var(--kirby-badge-left, auto);right:var(--kirby-badge-right, auto);top:var(--kirby-badge-top, auto);z-index:var(--kirby-badge-z-index, auto);font-size:var(--kirby-badge-font-size, min(14.5px, var(--kirby-font-size-xxs)));display:inline-flex}:host ion-badge{--background: var(--kirby-badge-background-color, var(--kirby-color-fill-raised));--color: var(--kirby-badge-color, var(--kirby-color-content-raised));border:var(--kirby-badge-border-width,
|
|
46
|
+
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{position:var(--kirby-badge-position, relative);left:var(--kirby-badge-left, auto);right:var(--kirby-badge-right, auto);top:var(--kirby-badge-top, auto);z-index:var(--kirby-badge-z-index, auto);font-size:var(--kirby-badge-font-size, min(14.5px, var(--kirby-font-size-xxs)));display:inline-flex}:host ion-badge{--background: var(--kirby-badge-background-color, var(--kirby-color-fill-raised));--color: var(--kirby-badge-color, var(--kirby-color-content-raised));border:var(--kirby-badge-border-width, var(--kirby-stroke-xs)) solid var(--kirby-color-border-raised-quiet);box-sizing:border-box;border-radius:var(--kirby-border-radius-pill);font-size:inherit;position:relative;box-shadow:var(--kirby-badge-elevation, none);--kirby-icon-font-size: 1.6em}:host.sm ion-badge{--background: var(--kirby-badge-background-color, var(--kirby-color-fill-base-quiet));--color: var(--kirby-badge-color, var(--kirby-color-content-base-quiet));border-color:var(--kirby-color-border-base-quiet)}:host.success.sm ion-badge{--background: var(--kirby-color-fill-success-loud);--color: var(--kirby-color-content-success-loud);border-color:var(--kirby-color-border-success-loud)}:host.success.md ion-badge{--background: var(--kirby-color-fill-success);--color: var(--kirby-color-content-success);border-color:var(--kirby-color-border-success)}:host.warning.sm ion-badge{--background: var(--kirby-color-fill-warning-loud);--color: var(--kirby-color-content-warning-loud);border-color:var(--kirby-color-border-warning-loud)}:host.warning.md ion-badge{--background: var(--kirby-color-fill-warning);--color: var(--kirby-color-content-warning);border-color:var(--kirby-color-border-warning)}:host.danger ion-badge{--background: var(--kirby-color-fill-danger-loud);--color: var(--kirby-color-content-danger-loud);border-color:var(--kirby-color-border-danger-loud)}:host(.sm) ion-badge{padding:initial;min-height:initial;min-width:initial;height:.8em;width:.8em}:host(.md) ion-badge{--padding-end: calc( var(--kirby-badge-padding-inline, .5em) - var(--kirby-badge-border-width, var(--kirby-stroke-xs)) );--padding-start: calc( var(--kirby-badge-padding-inline, .5em) - var(--kirby-badge-border-width, var(--kirby-stroke-xs)) );--padding-bottom: calc( var(--kirby-badge-padding-block, .3em) - var(--kirby-badge-border-width, var(--kirby-stroke-xs)) );--padding-top: calc( var(--kirby-badge-padding-block, .3em) - var(--kirby-badge-border-width, var(--kirby-stroke-xs)) );min-width:1.6em;min-height:1.6em}:host(.md):has(kirby-icon) ion-badge{--padding-top: 0px;--padding-start: 0px;height:1.6em;width:1.6em}:host(.md):has(kirby-icon) ion-badge ::ng-deep>kirby-icon{margin:calc(-1 * var(--kirby-badge-border-width, var(--kirby-stroke-xs)))}\n"],
|
|
47
47
|
dependencies: [{
|
|
48
48
|
kind: "component",
|
|
49
49
|
type: IonBadge,
|
|
@@ -56,7 +56,7 @@ var BadgeComponent = class BadgeComponent {
|
|
|
56
56
|
};
|
|
57
57
|
i0.ɵɵngDeclareClassMetadata({
|
|
58
58
|
minVersion: "12.0.0",
|
|
59
|
-
version: "22.2.
|
|
59
|
+
version: "22.2.3",
|
|
60
60
|
ngImport: i0,
|
|
61
61
|
type: BadgeComponent,
|
|
62
62
|
decorators: [{
|
|
@@ -70,7 +70,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
70
70
|
}],
|
|
71
71
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
72
72
|
template: "<ion-badge>\n @if (size === 'sm') {\n <span></span>\n }\n @if (!text && size === 'md') {\n <ng-content></ng-content>\n }\n @if (text && size === 'md') {\n {{ text }}\n }\n</ion-badge>\n",
|
|
73
|
-
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{position:var(--kirby-badge-position, relative);left:var(--kirby-badge-left, auto);right:var(--kirby-badge-right, auto);top:var(--kirby-badge-top, auto);z-index:var(--kirby-badge-z-index, auto);font-size:var(--kirby-badge-font-size, min(14.5px, var(--kirby-font-size-xxs)));display:inline-flex}:host ion-badge{--background: var(--kirby-badge-background-color, var(--kirby-color-fill-raised));--color: var(--kirby-badge-color, var(--kirby-color-content-raised));border:var(--kirby-badge-border-width,
|
|
73
|
+
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{position:var(--kirby-badge-position, relative);left:var(--kirby-badge-left, auto);right:var(--kirby-badge-right, auto);top:var(--kirby-badge-top, auto);z-index:var(--kirby-badge-z-index, auto);font-size:var(--kirby-badge-font-size, min(14.5px, var(--kirby-font-size-xxs)));display:inline-flex}:host ion-badge{--background: var(--kirby-badge-background-color, var(--kirby-color-fill-raised));--color: var(--kirby-badge-color, var(--kirby-color-content-raised));border:var(--kirby-badge-border-width, var(--kirby-stroke-xs)) solid var(--kirby-color-border-raised-quiet);box-sizing:border-box;border-radius:var(--kirby-border-radius-pill);font-size:inherit;position:relative;box-shadow:var(--kirby-badge-elevation, none);--kirby-icon-font-size: 1.6em}:host.sm ion-badge{--background: var(--kirby-badge-background-color, var(--kirby-color-fill-base-quiet));--color: var(--kirby-badge-color, var(--kirby-color-content-base-quiet));border-color:var(--kirby-color-border-base-quiet)}:host.success.sm ion-badge{--background: var(--kirby-color-fill-success-loud);--color: var(--kirby-color-content-success-loud);border-color:var(--kirby-color-border-success-loud)}:host.success.md ion-badge{--background: var(--kirby-color-fill-success);--color: var(--kirby-color-content-success);border-color:var(--kirby-color-border-success)}:host.warning.sm ion-badge{--background: var(--kirby-color-fill-warning-loud);--color: var(--kirby-color-content-warning-loud);border-color:var(--kirby-color-border-warning-loud)}:host.warning.md ion-badge{--background: var(--kirby-color-fill-warning);--color: var(--kirby-color-content-warning);border-color:var(--kirby-color-border-warning)}:host.danger ion-badge{--background: var(--kirby-color-fill-danger-loud);--color: var(--kirby-color-content-danger-loud);border-color:var(--kirby-color-border-danger-loud)}:host(.sm) ion-badge{padding:initial;min-height:initial;min-width:initial;height:.8em;width:.8em}:host(.md) ion-badge{--padding-end: calc( var(--kirby-badge-padding-inline, .5em) - var(--kirby-badge-border-width, var(--kirby-stroke-xs)) );--padding-start: calc( var(--kirby-badge-padding-inline, .5em) - var(--kirby-badge-border-width, var(--kirby-stroke-xs)) );--padding-bottom: calc( var(--kirby-badge-padding-block, .3em) - var(--kirby-badge-border-width, var(--kirby-stroke-xs)) );--padding-top: calc( var(--kirby-badge-padding-block, .3em) - var(--kirby-badge-border-width, var(--kirby-stroke-xs)) );min-width:1.6em;min-height:1.6em}:host(.md):has(kirby-icon) ion-badge{--padding-top: 0px;--padding-start: 0px;height:1.6em;width:1.6em}:host(.md):has(kirby-icon) ion-badge ::ng-deep>kirby-icon{margin:calc(-1 * var(--kirby-badge-border-width, var(--kirby-stroke-xs)))}\n"]
|
|
74
74
|
}]
|
|
75
75
|
}],
|
|
76
76
|
propDecorators: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kirbydesign-designsystem-badge.mjs","names":[],"sources":["../../badge/src/badge.component.ts","../../badge/src/badge.component.html"],"sourcesContent":["import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core';\nimport { ThemeColorDirective } from '@kirbydesign/designsystem/shared';\nimport { IonBadge } from '@ionic/angular';\n\nexport type BadgeSize = 'sm' | 'md';\n\nconst KIRBY_BADGE_TEXT_PROPERTY_DEPRECATION_WARNING =\n '[Kirby Badge] The `text` property has been deprecated. Please set the text of the Badge between the opening and closing tag.';\n\n@Component({\n selector: 'kirby-badge',\n templateUrl: './badge.component.html',\n styleUrls: ['./badge.component.scss'],\n imports: [IonBadge],\n hostDirectives: [{ directive: ThemeColorDirective, inputs: ['themeColor'] }],\n changeDetection: ChangeDetectionStrategy.Eager,\n})\nexport class BadgeComponent {\n private _text: string;\n get text(): string {\n return this._text;\n }\n /**\n * @deprecated The 'text' property has been deprecated.\n * Please set the text of the Badge between the opening and closing tag.\n */\n @Input() set text(value: string) {\n console.warn(KIRBY_BADGE_TEXT_PROPERTY_DEPRECATION_WARNING);\n this._text = value;\n }\n\n @HostBinding('class')\n @Input()\n size: BadgeSize = 'md';\n}\n","<ion-badge>\n @if (size === 'sm') {\n <span></span>\n }\n @if (!text && size === 'md') {\n <ng-content></ng-content>\n }\n @if (text && size === 'md') {\n {{ text }}\n }\n</ion-badge>\n"],"mappings":";;;;;AAMA,MAAM,gDACJ;AAUF,IAAa,iBAAb,MAAa,eAAc;CAR3B,cAAA;EAwBE,KAAA,OAAkB;CACnB;CAfC,IAAI,OAAI;EACN,OAAO,KAAK;CACd;CAKA,IAAa,KAAK,OAAa;EAC7B,QAAQ,KAAK,6CAA6C;EAC1D,KAAK,QAAQ;CACf;CAZW;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAc,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAd;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAc,cAAA;GAAA,UAAA;GAAA,QAAA;IAAA,MAAA;IAAA,MAAA;GAAA;GAAA,MAAA,EAAA,YAAA,EAAA,SAAA,YAAA,EAAA;GAAA,gBAAA,CAAA;IAAA,WAAA,GAAA;IAAA,QAAA,CAAA,cAAA,YAAA;GAAA,CAAA;GAAA,UAAA;GAAA,UCjB3B;GAWA,QAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"kirbydesign-designsystem-badge.mjs","names":[],"sources":["../../badge/src/badge.component.ts","../../badge/src/badge.component.html"],"sourcesContent":["import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core';\nimport { ThemeColorDirective } from '@kirbydesign/designsystem/shared';\nimport { IonBadge } from '@ionic/angular';\n\nexport type BadgeSize = 'sm' | 'md';\n\nconst KIRBY_BADGE_TEXT_PROPERTY_DEPRECATION_WARNING =\n '[Kirby Badge] The `text` property has been deprecated. Please set the text of the Badge between the opening and closing tag.';\n\n@Component({\n selector: 'kirby-badge',\n templateUrl: './badge.component.html',\n styleUrls: ['./badge.component.scss'],\n imports: [IonBadge],\n hostDirectives: [{ directive: ThemeColorDirective, inputs: ['themeColor'] }],\n changeDetection: ChangeDetectionStrategy.Eager,\n})\nexport class BadgeComponent {\n private _text: string;\n get text(): string {\n return this._text;\n }\n /**\n * @deprecated The 'text' property has been deprecated.\n * Please set the text of the Badge between the opening and closing tag.\n */\n @Input() set text(value: string) {\n console.warn(KIRBY_BADGE_TEXT_PROPERTY_DEPRECATION_WARNING);\n this._text = value;\n }\n\n @HostBinding('class')\n @Input()\n size: BadgeSize = 'md';\n}\n","<ion-badge>\n @if (size === 'sm') {\n <span></span>\n }\n @if (!text && size === 'md') {\n <ng-content></ng-content>\n }\n @if (text && size === 'md') {\n {{ text }}\n }\n</ion-badge>\n"],"mappings":";;;;;AAMA,MAAM,gDACJ;AAUF,IAAa,iBAAb,MAAa,eAAc;CAR3B,cAAA;EAwBE,KAAA,OAAkB;CACnB;CAfC,IAAI,OAAI;EACN,OAAO,KAAK;CACd;CAKA,IAAa,KAAK,OAAa;EAC7B,QAAQ,KAAK,6CAA6C;EAC1D,KAAK,QAAQ;CACf;CAZW;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAc,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAd;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAc,cAAA;GAAA,UAAA;GAAA,QAAA;IAAA,MAAA;IAAA,MAAA;GAAA;GAAA,MAAA,EAAA,YAAA,EAAA,SAAA,YAAA,EAAA;GAAA,gBAAA,CAAA;IAAA,WAAA,GAAA;IAAA,QAAA,CAAA,cAAA,YAAA;GAAA,CAAA;GAAA,UAAA;GAAA,UCjB3B;GAWA,QAAA,CAAA,yxFAAA;GAAA,cAAA,CAAA;IAAA,MAAA;IAAA,MDEY;IAAQ,UAAA;IAAA,QAAA,CAAA,SAAA,MAAA;GAAA,CAAA;GAAA,iBAAA,GAAA,wBAAA;EAAA,CAAA;CAAA;;AAIP,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAc,YAAA,CAAA;EAR1B,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAa,SAGd,CAAC,QAAQ;GAAC,gBACH,CAAC;IAAE,WAAW;IAAqB,QAAQ,CAAC,YAAY;GAAC,CAAE;GAAC,iBAC3D,wBAAwB;GAAK,UAAA;GAAA,QAAA,CAAA,yxFAAA;EAAA,CAAA;;;EAW7C,MAAA,CAAA,EAAA,MAAA,MAAA,CAAA;;GAKA,MAAA;GAAY,MAAA,CAAA,OAAO;EACnB,GAAA,EAAA,MAAA,MAAA,CAAA"}
|
|
@@ -104,7 +104,7 @@ var ButtonComponent = class ButtonComponent {
|
|
|
104
104
|
static {
|
|
105
105
|
this.ɵfac = i0.ɵɵngDeclareFactory({
|
|
106
106
|
minVersion: "12.0.0",
|
|
107
|
-
version: "22.2.
|
|
107
|
+
version: "22.2.3",
|
|
108
108
|
ngImport: i0,
|
|
109
109
|
type: ButtonComponent,
|
|
110
110
|
deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }],
|
|
@@ -114,7 +114,7 @@ var ButtonComponent = class ButtonComponent {
|
|
|
114
114
|
static {
|
|
115
115
|
this.ɵcmp = i0.ɵɵngDeclareComponent({
|
|
116
116
|
minVersion: "14.0.0",
|
|
117
|
-
version: "22.2.
|
|
117
|
+
version: "22.2.3",
|
|
118
118
|
type: ButtonComponent,
|
|
119
119
|
isStandalone: true,
|
|
120
120
|
selector: "button[kirby-button],Button[kirby-button],a[kirby-button]",
|
|
@@ -144,14 +144,14 @@ var ButtonComponent = class ButtonComponent {
|
|
|
144
144
|
}],
|
|
145
145
|
ngImport: i0,
|
|
146
146
|
template: "<ng-content></ng-content>\n",
|
|
147
|
-
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{--kirby-button-padding-left: var(--kirby-spacing-m);--kirby-button-padding-right: var(--kirby-spacing-m);flex-shrink:0}:host{position:relative}:host:after{content:\"\";position:absolute;min-height:44px;min-width:44px;width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}:host{font-family:var(--kirby-font-family);background-color:var(--kirby-button-background-color, initial);color:var(--kirby-button-color, inherit);border:1px solid var(--kirby-button-border-color, transparent);border-radius:var(--kirby-border-radius-pill);box-sizing:border-box;display:inline-flex;flex-direction:row;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap;font-size:var(--kirby-font-size-s);height:var(--kirby-spacing-xl);min-width:88px;padding-block:0;padding-inline:var(--kirby-button-padding-left) var(--kirby-button-padding-right);margin:var(--kirby-spacing-xxxs);cursor:pointer;outline:none}:host.no-margin{margin:0}:host.icon-left{--kirby-icon-margin-right: var(--kirby-spacing-xxs);--kirby-button-padding-left: var(--kirby-spacing-xs);--kirby-button-padding-right: var(--kirby-spacing-s)}:host.icon-right{--kirby-icon-margin-left: var(--kirby-spacing-xxs);--kirby-button-padding-left: var(--kirby-spacing-s);--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.icon-only{--kirby-button-padding-left: 0;--kirby-button-padding-right: 0;width:var(--kirby-spacing-xl);padding:0;min-width:unset}:host.icon-only ::ng-deep>:not(kirby-icon){position:absolute;scale:0}:host.xs{position:relative}:host.xs:after{content:\"\";position:absolute;min-height:calc(var(--kirby-spacing-m) + var(--kirby-spacing-xxxs) * 2);min-width:calc(var(--kirby-spacing-m) + var(--kirby-spacing-xxxs) * 2);width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}:host.xs{--kirby-icon-font-size: var(--kirby-icon-font-size-xs);font-size:var(--kirby-font-size-xs);height:max(var(--kirby-spacing-m),var(--kirby-relative-size-s));min-width:44px}:host.xs:not(.icon-only){--kirby-button-padding-left: var(--kirby-spacing-xs);--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.xs.icon-only{width:max(var(--kirby-spacing-m),var(--kirby-relative-size-s));min-width:unset}:host.xs.icon-left{--kirby-button-padding-left: var(--kirby-spacing-xxs);--kirby-icon-margin-right: var(--kirby-spacing-xxxs)}:host.xs.icon-right{--kirby-button-padding-right: var(--kirby-spacing-xxs);--kirby-icon-margin-left: var(--kirby-spacing-xxxs)}:host.xs.icon-left,:host.xs.icon-right{min-width:44px}:host.sm{--kirby-icon-font-size: var(--kirby-spacing-s);font-size:var(--kirby-font-size-xs);height:var(--kirby-spacing-l);min-width:44px}:host.sm:not(.icon-only){--kirby-button-padding-left: var(--kirby-spacing-s);--kirby-button-padding-right: var(--kirby-spacing-s)}:host.sm.icon-only{width:var(--kirby-spacing-l);min-width:unset}:host.sm.icon-left{--kirby-button-padding-left: var(--kirby-spacing-xs)}:host.sm.icon-right{--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.sm.icon-left,:host.sm.icon-right{min-width:88px}:host.lg{font-size:var(--kirby-font-size-n);height:var(--kirby-spacing-xxl);min-width:220px}:host.lg.icon-only{width:var(--kirby-spacing-xxl);min-width:unset}:host.no-decoration{--kirby-button-background-color: transparent;--kirby-button-color: var(--kirby-color-content-base);--kirby-button-border-color: transparent}@media(hover:hover){:host.no-decoration:hover{--kirby-button-background-color: var(--kirby-color-fill-base-hover);--kirby-button-color: var(--kirby-color-content-base-hover);--kirby-button-border-color: var(--kirby-color-border-base-quiet-hover)}}:host.no-decoration:active{--kirby-button-background-color: var(--kirby-color-fill-base-active);--kirby-button-color: var(--kirby-color-content-base-active);--kirby-button-border-color: var(--kirby-color-border-base-quiet-active)}:host.attention-level1{--kirby-button-background-color: var(--kirby-color-fill-brand-loud);--kirby-button-color: var(--kirby-color-content-brand-loud);--kirby-button-border-color: var(--kirby-color-border-brand-loud)}@media(hover:hover){:host.attention-level1:hover{--kirby-button-background-color: var(--kirby-color-fill-brand-loud-hover);--kirby-button-color: var(--kirby-color-content-brand-loud-hover);--kirby-button-border-color: var(--kirby-color-border-brand-loud-hover)}}:host.attention-level1:active{--kirby-button-background-color: var(--kirby-color-fill-brand-loud-active);--kirby-button-color: var(--kirby-color-content-brand-loud-active);--kirby-button-border-color: var(--kirby-color-border-brand-loud-active)}:host.attention-level1.destructive{--kirby-button-background-color: var(--kirby-color-fill-danger);--kirby-button-color: var(--kirby-color-content-danger);--kirby-button-border-color: var(--kirby-color-border-danger)}@media(hover:hover){:host.attention-level1.destructive:hover{--kirby-button-background-color: var(--kirby-color-fill-danger-hover);--kirby-button-color: var(--kirby-color-content-danger-hover);--kirby-button-border-color: var(--kirby-color-border-danger-hover)}}:host.attention-level1.destructive:active{--kirby-button-background-color: var(--kirby-color-fill-danger-active);--kirby-button-color: var(--kirby-color-content-danger-active);--kirby-button-border-color: var(--kirby-color-border-danger-active)}:host.attention-level2{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host.attention-level2:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host.attention-level2:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host.attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host.attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host.attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host:focus-visible{transition:all 80ms linear 0ms;box-shadow:var(--kirby-focus-ring-md-combined-inset);border-color:var(--kirby-color-border-focus)}:host[expand=block]{width:100%}:host:disabled,:host[aria-disabled=true]{pointer-events:none;opacity:.4}:host.floating{width:64px!important;height:64px!important;min-width:unset}:host.floating:not(:disabled){box-shadow:var(--kirby-elevation-8)}:host(a){text-decoration:none}:host-context(kirby-item)[slot=end]{margin-inline:var(--kirby-spacing-s) 0}:host-context(kirby-dropdown){justify-content:space-between}:host-context(ion-toolbar ion-buttons.legacy-actions){font-size:var(--kirby-font-size-s);height:var(--kirby-spacing-xl)}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only{width:var(--kirby-spacing-xl)}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host-context(.page-title kirby-page-actions).no-decoration,:host-context(.page-title kirby-page-actions).attention-level1,:host-context(.page-title kirby-page-actions).attention-level2,:host-context(.page-title kirby-page-actions).attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host-context(.page-title kirby-page-actions).no-decoration:hover,:host-context(.page-title kirby-page-actions).attention-level1:hover,:host-context(.page-title kirby-page-actions).attention-level2:hover,:host-context(.page-title kirby-page-actions).attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host-context(.page-title kirby-page-actions).no-decoration:active,:host-context(.page-title kirby-page-actions).attention-level1:active,:host-context(.page-title kirby-page-actions).attention-level2:active,:host-context(.page-title kirby-page-actions).attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host-context(kirby-empty-state .content){font-size:var(--kirby-font-size-n);height:var(--kirby-spacing-xxl);min-width:220px}:host-context(kirby-empty-state .content).icon-only{width:var(--kirby-spacing-xxl);min-width:unset}:host-context(kirby-toggle-button).success{--kirby-button-background-color: var(--kirby-color-fill-success-loud);--kirby-button-color: var(--kirby-color-content-success-loud);--kirby-button-border-color: var(--kirby-color-border-success-loud)}@media(hover:hover){:host-context(kirby-toggle-button).success:hover{--kirby-button-background-color: var(--kirby-color-fill-success-loud-hover);--kirby-button-color: var(--kirby-color-content-success-loud-hover);--kirby-button-border-color: var(--kirby-color-border-success-loud-hover)}}:host-context(kirby-toggle-button).success:active{--kirby-button-background-color: var(--kirby-color-fill-success-loud-active);--kirby-button-color: var(--kirby-color-content-success-loud-active);--kirby-button-border-color: var(--kirby-color-border-success-loud-active)}:host-context(kirby-toggle-button).warning{--kirby-button-background-color: var(--kirby-color-fill-warning-loud);--kirby-button-color: var(--kirby-color-content-warning-loud);--kirby-button-border-color: var(--kirby-color-border-warning-loud)}@media(hover:hover){:host-context(kirby-toggle-button).warning:hover{--kirby-button-background-color: var(--kirby-color-fill-warning-loud-hover);--kirby-button-color: var(--kirby-color-content-warning-loud-hover);--kirby-button-border-color: var(--kirby-color-border-warning-loud-hover)}}:host-context(kirby-toggle-button).warning:active{--kirby-button-background-color: var(--kirby-color-fill-warning-loud-active);--kirby-button-color: var(--kirby-color-content-warning-loud-active);--kirby-button-border-color: var(--kirby-color-border-warning-loud-active)}:host-context(kirby-toggle-button).danger{--kirby-button-background-color: var(--kirby-color-fill-danger-loud);--kirby-button-color: var(--kirby-color-content-danger-loud);--kirby-button-border-color: var(--kirby-color-border-danger-loud)}@media(hover:hover){:host-context(kirby-toggle-button).danger:hover{--kirby-button-background-color: var(--kirby-color-fill-danger-loud-hover);--kirby-button-color: var(--kirby-color-content-danger-loud-hover);--kirby-button-border-color: var(--kirby-color-border-danger-loud-hover)}}:host-context(kirby-toggle-button).danger:active{--kirby-button-background-color: var(--kirby-color-fill-danger-loud-active);--kirby-button-color: var(--kirby-color-content-danger-loud-active);--kirby-button-border-color: var(--kirby-color-border-danger-loud-active)}:host-context(kirby-page-actions),:host-context(kirby-action-group),:host-context(.kirby-modal ion-header ion-toolbar ion-buttons){margin:0}:host-context(kirby-modal-footer){margin-top:0;margin-bottom:0}:host-context(kirby-modal-footer):first-child{margin-left:0}:host-context(kirby-modal-footer):last-child{margin-right:0}\n"],
|
|
147
|
+
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{--kirby-button-padding-left: var(--kirby-spacing-m);--kirby-button-padding-right: var(--kirby-spacing-m);flex-shrink:0}:host{position:relative}:host:after{content:\"\";position:absolute;min-height:44px;min-width:44px;width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}:host{font-family:var(--kirby-font-family);background-color:var(--kirby-button-background-color, initial);color:var(--kirby-button-color, inherit);border:var(--kirby-stroke-xs) solid var(--kirby-button-border-color, transparent);border-radius:var(--kirby-border-radius-pill);box-sizing:border-box;display:inline-flex;flex-direction:row;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap;font-size:var(--kirby-font-size-s);height:var(--kirby-spacing-xl);min-width:88px;padding-block:0;padding-inline:var(--kirby-button-padding-left) var(--kirby-button-padding-right);margin:var(--kirby-spacing-xxxs);cursor:pointer;outline:none}:host.no-margin{margin:0}:host.icon-left{--kirby-icon-margin-right: var(--kirby-spacing-xxs);--kirby-button-padding-left: var(--kirby-spacing-xs);--kirby-button-padding-right: var(--kirby-spacing-s)}:host.icon-right{--kirby-icon-margin-left: var(--kirby-spacing-xxs);--kirby-button-padding-left: var(--kirby-spacing-s);--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.icon-only{--kirby-button-padding-left: 0;--kirby-button-padding-right: 0;width:var(--kirby-spacing-xl);padding:0;min-width:unset}:host.icon-only ::ng-deep>:not(kirby-icon){position:absolute;scale:0}:host.xs{position:relative}:host.xs:after{content:\"\";position:absolute;min-height:calc(var(--kirby-spacing-m) + var(--kirby-spacing-xxxs) * 2);min-width:calc(var(--kirby-spacing-m) + var(--kirby-spacing-xxxs) * 2);width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}:host.xs{--kirby-icon-font-size: var(--kirby-icon-font-size-xs);font-size:var(--kirby-font-size-xs);height:max(var(--kirby-spacing-m),var(--kirby-relative-size-s));min-width:44px}:host.xs:not(.icon-only){--kirby-button-padding-left: var(--kirby-spacing-xs);--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.xs.icon-only{width:max(var(--kirby-spacing-m),var(--kirby-relative-size-s));min-width:unset}:host.xs.icon-left{--kirby-button-padding-left: var(--kirby-spacing-xxs);--kirby-icon-margin-right: var(--kirby-spacing-xxxs)}:host.xs.icon-right{--kirby-button-padding-right: var(--kirby-spacing-xxs);--kirby-icon-margin-left: var(--kirby-spacing-xxxs)}:host.xs.icon-left,:host.xs.icon-right{min-width:44px}:host.sm{--kirby-icon-font-size: var(--kirby-spacing-s);font-size:var(--kirby-font-size-xs);height:var(--kirby-spacing-l);min-width:44px}:host.sm:not(.icon-only){--kirby-button-padding-left: var(--kirby-spacing-s);--kirby-button-padding-right: var(--kirby-spacing-s)}:host.sm.icon-only{width:var(--kirby-spacing-l);min-width:unset}:host.sm.icon-left{--kirby-button-padding-left: var(--kirby-spacing-xs)}:host.sm.icon-right{--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.sm.icon-left,:host.sm.icon-right{min-width:88px}:host.lg{font-size:var(--kirby-font-size-n);height:var(--kirby-spacing-xxl);min-width:220px}:host.lg.icon-only{width:var(--kirby-spacing-xxl);min-width:unset}:host.no-decoration{--kirby-button-background-color: transparent;--kirby-button-color: var(--kirby-color-content-base);--kirby-button-border-color: transparent}@media(hover:hover){:host.no-decoration:hover{--kirby-button-background-color: var(--kirby-color-fill-base-hover);--kirby-button-color: var(--kirby-color-content-base-hover);--kirby-button-border-color: var(--kirby-color-border-base-quiet-hover)}}:host.no-decoration:active{--kirby-button-background-color: var(--kirby-color-fill-base-active);--kirby-button-color: var(--kirby-color-content-base-active);--kirby-button-border-color: var(--kirby-color-border-base-quiet-active)}:host.attention-level1{--kirby-button-background-color: var(--kirby-color-fill-brand-loud);--kirby-button-color: var(--kirby-color-content-brand-loud);--kirby-button-border-color: var(--kirby-color-border-brand-loud)}@media(hover:hover){:host.attention-level1:hover{--kirby-button-background-color: var(--kirby-color-fill-brand-loud-hover);--kirby-button-color: var(--kirby-color-content-brand-loud-hover);--kirby-button-border-color: var(--kirby-color-border-brand-loud-hover)}}:host.attention-level1:active{--kirby-button-background-color: var(--kirby-color-fill-brand-loud-active);--kirby-button-color: var(--kirby-color-content-brand-loud-active);--kirby-button-border-color: var(--kirby-color-border-brand-loud-active)}:host.attention-level1.destructive{--kirby-button-background-color: var(--kirby-color-fill-danger);--kirby-button-color: var(--kirby-color-content-danger);--kirby-button-border-color: var(--kirby-color-border-danger)}@media(hover:hover){:host.attention-level1.destructive:hover{--kirby-button-background-color: var(--kirby-color-fill-danger-hover);--kirby-button-color: var(--kirby-color-content-danger-hover);--kirby-button-border-color: var(--kirby-color-border-danger-hover)}}:host.attention-level1.destructive:active{--kirby-button-background-color: var(--kirby-color-fill-danger-active);--kirby-button-color: var(--kirby-color-content-danger-active);--kirby-button-border-color: var(--kirby-color-border-danger-active)}:host.attention-level2{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host.attention-level2:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host.attention-level2:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host.attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host.attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host.attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host:focus-visible{transition:all 80ms linear 0ms;box-shadow:var(--kirby-focus-ring-md-combined-inset);border-color:var(--kirby-color-border-focus)}:host[expand=block]{width:100%}:host:disabled,:host[aria-disabled=true]{pointer-events:none;opacity:var(--kirby-opacity-40)}:host.floating{width:64px!important;height:64px!important;min-width:unset}:host.floating:not(:disabled){box-shadow:var(--kirby-elevation-8)}:host(a){text-decoration:none}:host-context(kirby-item)[slot=end]{margin-inline:var(--kirby-spacing-s) 0}:host-context(kirby-dropdown){justify-content:space-between}:host-context(ion-toolbar ion-buttons.legacy-actions){font-size:var(--kirby-font-size-s);height:var(--kirby-spacing-xl)}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only{width:var(--kirby-spacing-xl)}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host-context(.page-title kirby-page-actions).no-decoration,:host-context(.page-title kirby-page-actions).attention-level1,:host-context(.page-title kirby-page-actions).attention-level2,:host-context(.page-title kirby-page-actions).attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host-context(.page-title kirby-page-actions).no-decoration:hover,:host-context(.page-title kirby-page-actions).attention-level1:hover,:host-context(.page-title kirby-page-actions).attention-level2:hover,:host-context(.page-title kirby-page-actions).attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host-context(.page-title kirby-page-actions).no-decoration:active,:host-context(.page-title kirby-page-actions).attention-level1:active,:host-context(.page-title kirby-page-actions).attention-level2:active,:host-context(.page-title kirby-page-actions).attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host-context(kirby-empty-state .content){font-size:var(--kirby-font-size-n);height:var(--kirby-spacing-xxl);min-width:220px}:host-context(kirby-empty-state .content).icon-only{width:var(--kirby-spacing-xxl);min-width:unset}:host-context(kirby-toggle-button).success{--kirby-button-background-color: var(--kirby-color-fill-success-loud);--kirby-button-color: var(--kirby-color-content-success-loud);--kirby-button-border-color: var(--kirby-color-border-success-loud)}@media(hover:hover){:host-context(kirby-toggle-button).success:hover{--kirby-button-background-color: var(--kirby-color-fill-success-loud-hover);--kirby-button-color: var(--kirby-color-content-success-loud-hover);--kirby-button-border-color: var(--kirby-color-border-success-loud-hover)}}:host-context(kirby-toggle-button).success:active{--kirby-button-background-color: var(--kirby-color-fill-success-loud-active);--kirby-button-color: var(--kirby-color-content-success-loud-active);--kirby-button-border-color: var(--kirby-color-border-success-loud-active)}:host-context(kirby-toggle-button).warning{--kirby-button-background-color: var(--kirby-color-fill-warning-loud);--kirby-button-color: var(--kirby-color-content-warning-loud);--kirby-button-border-color: var(--kirby-color-border-warning-loud)}@media(hover:hover){:host-context(kirby-toggle-button).warning:hover{--kirby-button-background-color: var(--kirby-color-fill-warning-loud-hover);--kirby-button-color: var(--kirby-color-content-warning-loud-hover);--kirby-button-border-color: var(--kirby-color-border-warning-loud-hover)}}:host-context(kirby-toggle-button).warning:active{--kirby-button-background-color: var(--kirby-color-fill-warning-loud-active);--kirby-button-color: var(--kirby-color-content-warning-loud-active);--kirby-button-border-color: var(--kirby-color-border-warning-loud-active)}:host-context(kirby-toggle-button).danger{--kirby-button-background-color: var(--kirby-color-fill-danger-loud);--kirby-button-color: var(--kirby-color-content-danger-loud);--kirby-button-border-color: var(--kirby-color-border-danger-loud)}@media(hover:hover){:host-context(kirby-toggle-button).danger:hover{--kirby-button-background-color: var(--kirby-color-fill-danger-loud-hover);--kirby-button-color: var(--kirby-color-content-danger-loud-hover);--kirby-button-border-color: var(--kirby-color-border-danger-loud-hover)}}:host-context(kirby-toggle-button).danger:active{--kirby-button-background-color: var(--kirby-color-fill-danger-loud-active);--kirby-button-color: var(--kirby-color-content-danger-loud-active);--kirby-button-border-color: var(--kirby-color-border-danger-loud-active)}:host-context(kirby-page-actions),:host-context(kirby-action-group),:host-context(.kirby-modal ion-header ion-toolbar ion-buttons){margin:0}:host-context(kirby-modal-footer){margin-top:0;margin-bottom:0}:host-context(kirby-modal-footer):first-child{margin-left:0}:host-context(kirby-modal-footer):last-child{margin-right:0}\n"],
|
|
148
148
|
changeDetection: i0.ChangeDetectionStrategy.OnPush
|
|
149
149
|
});
|
|
150
150
|
}
|
|
151
151
|
};
|
|
152
152
|
i0.ɵɵngDeclareClassMetadata({
|
|
153
153
|
minVersion: "12.0.0",
|
|
154
|
-
version: "22.2.
|
|
154
|
+
version: "22.2.3",
|
|
155
155
|
ngImport: i0,
|
|
156
156
|
type: ButtonComponent,
|
|
157
157
|
decorators: [{
|
|
@@ -160,7 +160,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
160
160
|
selector: "button[kirby-button],Button[kirby-button],a[kirby-button]",
|
|
161
161
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
162
162
|
template: "<ng-content></ng-content>\n",
|
|
163
|
-
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{--kirby-button-padding-left: var(--kirby-spacing-m);--kirby-button-padding-right: var(--kirby-spacing-m);flex-shrink:0}:host{position:relative}:host:after{content:\"\";position:absolute;min-height:44px;min-width:44px;width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}:host{font-family:var(--kirby-font-family);background-color:var(--kirby-button-background-color, initial);color:var(--kirby-button-color, inherit);border:1px solid var(--kirby-button-border-color, transparent);border-radius:var(--kirby-border-radius-pill);box-sizing:border-box;display:inline-flex;flex-direction:row;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap;font-size:var(--kirby-font-size-s);height:var(--kirby-spacing-xl);min-width:88px;padding-block:0;padding-inline:var(--kirby-button-padding-left) var(--kirby-button-padding-right);margin:var(--kirby-spacing-xxxs);cursor:pointer;outline:none}:host.no-margin{margin:0}:host.icon-left{--kirby-icon-margin-right: var(--kirby-spacing-xxs);--kirby-button-padding-left: var(--kirby-spacing-xs);--kirby-button-padding-right: var(--kirby-spacing-s)}:host.icon-right{--kirby-icon-margin-left: var(--kirby-spacing-xxs);--kirby-button-padding-left: var(--kirby-spacing-s);--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.icon-only{--kirby-button-padding-left: 0;--kirby-button-padding-right: 0;width:var(--kirby-spacing-xl);padding:0;min-width:unset}:host.icon-only ::ng-deep>:not(kirby-icon){position:absolute;scale:0}:host.xs{position:relative}:host.xs:after{content:\"\";position:absolute;min-height:calc(var(--kirby-spacing-m) + var(--kirby-spacing-xxxs) * 2);min-width:calc(var(--kirby-spacing-m) + var(--kirby-spacing-xxxs) * 2);width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}:host.xs{--kirby-icon-font-size: var(--kirby-icon-font-size-xs);font-size:var(--kirby-font-size-xs);height:max(var(--kirby-spacing-m),var(--kirby-relative-size-s));min-width:44px}:host.xs:not(.icon-only){--kirby-button-padding-left: var(--kirby-spacing-xs);--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.xs.icon-only{width:max(var(--kirby-spacing-m),var(--kirby-relative-size-s));min-width:unset}:host.xs.icon-left{--kirby-button-padding-left: var(--kirby-spacing-xxs);--kirby-icon-margin-right: var(--kirby-spacing-xxxs)}:host.xs.icon-right{--kirby-button-padding-right: var(--kirby-spacing-xxs);--kirby-icon-margin-left: var(--kirby-spacing-xxxs)}:host.xs.icon-left,:host.xs.icon-right{min-width:44px}:host.sm{--kirby-icon-font-size: var(--kirby-spacing-s);font-size:var(--kirby-font-size-xs);height:var(--kirby-spacing-l);min-width:44px}:host.sm:not(.icon-only){--kirby-button-padding-left: var(--kirby-spacing-s);--kirby-button-padding-right: var(--kirby-spacing-s)}:host.sm.icon-only{width:var(--kirby-spacing-l);min-width:unset}:host.sm.icon-left{--kirby-button-padding-left: var(--kirby-spacing-xs)}:host.sm.icon-right{--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.sm.icon-left,:host.sm.icon-right{min-width:88px}:host.lg{font-size:var(--kirby-font-size-n);height:var(--kirby-spacing-xxl);min-width:220px}:host.lg.icon-only{width:var(--kirby-spacing-xxl);min-width:unset}:host.no-decoration{--kirby-button-background-color: transparent;--kirby-button-color: var(--kirby-color-content-base);--kirby-button-border-color: transparent}@media(hover:hover){:host.no-decoration:hover{--kirby-button-background-color: var(--kirby-color-fill-base-hover);--kirby-button-color: var(--kirby-color-content-base-hover);--kirby-button-border-color: var(--kirby-color-border-base-quiet-hover)}}:host.no-decoration:active{--kirby-button-background-color: var(--kirby-color-fill-base-active);--kirby-button-color: var(--kirby-color-content-base-active);--kirby-button-border-color: var(--kirby-color-border-base-quiet-active)}:host.attention-level1{--kirby-button-background-color: var(--kirby-color-fill-brand-loud);--kirby-button-color: var(--kirby-color-content-brand-loud);--kirby-button-border-color: var(--kirby-color-border-brand-loud)}@media(hover:hover){:host.attention-level1:hover{--kirby-button-background-color: var(--kirby-color-fill-brand-loud-hover);--kirby-button-color: var(--kirby-color-content-brand-loud-hover);--kirby-button-border-color: var(--kirby-color-border-brand-loud-hover)}}:host.attention-level1:active{--kirby-button-background-color: var(--kirby-color-fill-brand-loud-active);--kirby-button-color: var(--kirby-color-content-brand-loud-active);--kirby-button-border-color: var(--kirby-color-border-brand-loud-active)}:host.attention-level1.destructive{--kirby-button-background-color: var(--kirby-color-fill-danger);--kirby-button-color: var(--kirby-color-content-danger);--kirby-button-border-color: var(--kirby-color-border-danger)}@media(hover:hover){:host.attention-level1.destructive:hover{--kirby-button-background-color: var(--kirby-color-fill-danger-hover);--kirby-button-color: var(--kirby-color-content-danger-hover);--kirby-button-border-color: var(--kirby-color-border-danger-hover)}}:host.attention-level1.destructive:active{--kirby-button-background-color: var(--kirby-color-fill-danger-active);--kirby-button-color: var(--kirby-color-content-danger-active);--kirby-button-border-color: var(--kirby-color-border-danger-active)}:host.attention-level2{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host.attention-level2:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host.attention-level2:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host.attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host.attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host.attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host:focus-visible{transition:all 80ms linear 0ms;box-shadow:var(--kirby-focus-ring-md-combined-inset);border-color:var(--kirby-color-border-focus)}:host[expand=block]{width:100%}:host:disabled,:host[aria-disabled=true]{pointer-events:none;opacity:.4}:host.floating{width:64px!important;height:64px!important;min-width:unset}:host.floating:not(:disabled){box-shadow:var(--kirby-elevation-8)}:host(a){text-decoration:none}:host-context(kirby-item)[slot=end]{margin-inline:var(--kirby-spacing-s) 0}:host-context(kirby-dropdown){justify-content:space-between}:host-context(ion-toolbar ion-buttons.legacy-actions){font-size:var(--kirby-font-size-s);height:var(--kirby-spacing-xl)}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only{width:var(--kirby-spacing-xl)}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host-context(.page-title kirby-page-actions).no-decoration,:host-context(.page-title kirby-page-actions).attention-level1,:host-context(.page-title kirby-page-actions).attention-level2,:host-context(.page-title kirby-page-actions).attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host-context(.page-title kirby-page-actions).no-decoration:hover,:host-context(.page-title kirby-page-actions).attention-level1:hover,:host-context(.page-title kirby-page-actions).attention-level2:hover,:host-context(.page-title kirby-page-actions).attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host-context(.page-title kirby-page-actions).no-decoration:active,:host-context(.page-title kirby-page-actions).attention-level1:active,:host-context(.page-title kirby-page-actions).attention-level2:active,:host-context(.page-title kirby-page-actions).attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host-context(kirby-empty-state .content){font-size:var(--kirby-font-size-n);height:var(--kirby-spacing-xxl);min-width:220px}:host-context(kirby-empty-state .content).icon-only{width:var(--kirby-spacing-xxl);min-width:unset}:host-context(kirby-toggle-button).success{--kirby-button-background-color: var(--kirby-color-fill-success-loud);--kirby-button-color: var(--kirby-color-content-success-loud);--kirby-button-border-color: var(--kirby-color-border-success-loud)}@media(hover:hover){:host-context(kirby-toggle-button).success:hover{--kirby-button-background-color: var(--kirby-color-fill-success-loud-hover);--kirby-button-color: var(--kirby-color-content-success-loud-hover);--kirby-button-border-color: var(--kirby-color-border-success-loud-hover)}}:host-context(kirby-toggle-button).success:active{--kirby-button-background-color: var(--kirby-color-fill-success-loud-active);--kirby-button-color: var(--kirby-color-content-success-loud-active);--kirby-button-border-color: var(--kirby-color-border-success-loud-active)}:host-context(kirby-toggle-button).warning{--kirby-button-background-color: var(--kirby-color-fill-warning-loud);--kirby-button-color: var(--kirby-color-content-warning-loud);--kirby-button-border-color: var(--kirby-color-border-warning-loud)}@media(hover:hover){:host-context(kirby-toggle-button).warning:hover{--kirby-button-background-color: var(--kirby-color-fill-warning-loud-hover);--kirby-button-color: var(--kirby-color-content-warning-loud-hover);--kirby-button-border-color: var(--kirby-color-border-warning-loud-hover)}}:host-context(kirby-toggle-button).warning:active{--kirby-button-background-color: var(--kirby-color-fill-warning-loud-active);--kirby-button-color: var(--kirby-color-content-warning-loud-active);--kirby-button-border-color: var(--kirby-color-border-warning-loud-active)}:host-context(kirby-toggle-button).danger{--kirby-button-background-color: var(--kirby-color-fill-danger-loud);--kirby-button-color: var(--kirby-color-content-danger-loud);--kirby-button-border-color: var(--kirby-color-border-danger-loud)}@media(hover:hover){:host-context(kirby-toggle-button).danger:hover{--kirby-button-background-color: var(--kirby-color-fill-danger-loud-hover);--kirby-button-color: var(--kirby-color-content-danger-loud-hover);--kirby-button-border-color: var(--kirby-color-border-danger-loud-hover)}}:host-context(kirby-toggle-button).danger:active{--kirby-button-background-color: var(--kirby-color-fill-danger-loud-active);--kirby-button-color: var(--kirby-color-content-danger-loud-active);--kirby-button-border-color: var(--kirby-color-border-danger-loud-active)}:host-context(kirby-page-actions),:host-context(kirby-action-group),:host-context(.kirby-modal ion-header ion-toolbar ion-buttons){margin:0}:host-context(kirby-modal-footer){margin-top:0;margin-bottom:0}:host-context(kirby-modal-footer):first-child{margin-left:0}:host-context(kirby-modal-footer):last-child{margin-right:0}\n"]
|
|
163
|
+
styles: [".kirby-line-clamp{display:-webkit-box;-webkit-line-clamp:var(--line-clamp, none);-webkit-box-orient:vertical;overflow:hidden}:host{--kirby-button-padding-left: var(--kirby-spacing-m);--kirby-button-padding-right: var(--kirby-spacing-m);flex-shrink:0}:host{position:relative}:host:after{content:\"\";position:absolute;min-height:44px;min-width:44px;width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}:host{font-family:var(--kirby-font-family);background-color:var(--kirby-button-background-color, initial);color:var(--kirby-button-color, inherit);border:var(--kirby-stroke-xs) solid var(--kirby-button-border-color, transparent);border-radius:var(--kirby-border-radius-pill);box-sizing:border-box;display:inline-flex;flex-direction:row;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap;font-size:var(--kirby-font-size-s);height:var(--kirby-spacing-xl);min-width:88px;padding-block:0;padding-inline:var(--kirby-button-padding-left) var(--kirby-button-padding-right);margin:var(--kirby-spacing-xxxs);cursor:pointer;outline:none}:host.no-margin{margin:0}:host.icon-left{--kirby-icon-margin-right: var(--kirby-spacing-xxs);--kirby-button-padding-left: var(--kirby-spacing-xs);--kirby-button-padding-right: var(--kirby-spacing-s)}:host.icon-right{--kirby-icon-margin-left: var(--kirby-spacing-xxs);--kirby-button-padding-left: var(--kirby-spacing-s);--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.icon-only{--kirby-button-padding-left: 0;--kirby-button-padding-right: 0;width:var(--kirby-spacing-xl);padding:0;min-width:unset}:host.icon-only ::ng-deep>:not(kirby-icon){position:absolute;scale:0}:host.xs{position:relative}:host.xs:after{content:\"\";position:absolute;min-height:calc(var(--kirby-spacing-m) + var(--kirby-spacing-xxxs) * 2);min-width:calc(var(--kirby-spacing-m) + var(--kirby-spacing-xxxs) * 2);width:100%;height:100%;transform:translate(-50%,-50%);left:50%;top:50%}:host.xs{--kirby-icon-font-size: var(--kirby-icon-font-size-xs);font-size:var(--kirby-font-size-xs);height:max(var(--kirby-spacing-m),var(--kirby-relative-size-s));min-width:44px}:host.xs:not(.icon-only){--kirby-button-padding-left: var(--kirby-spacing-xs);--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.xs.icon-only{width:max(var(--kirby-spacing-m),var(--kirby-relative-size-s));min-width:unset}:host.xs.icon-left{--kirby-button-padding-left: var(--kirby-spacing-xxs);--kirby-icon-margin-right: var(--kirby-spacing-xxxs)}:host.xs.icon-right{--kirby-button-padding-right: var(--kirby-spacing-xxs);--kirby-icon-margin-left: var(--kirby-spacing-xxxs)}:host.xs.icon-left,:host.xs.icon-right{min-width:44px}:host.sm{--kirby-icon-font-size: var(--kirby-spacing-s);font-size:var(--kirby-font-size-xs);height:var(--kirby-spacing-l);min-width:44px}:host.sm:not(.icon-only){--kirby-button-padding-left: var(--kirby-spacing-s);--kirby-button-padding-right: var(--kirby-spacing-s)}:host.sm.icon-only{width:var(--kirby-spacing-l);min-width:unset}:host.sm.icon-left{--kirby-button-padding-left: var(--kirby-spacing-xs)}:host.sm.icon-right{--kirby-button-padding-right: var(--kirby-spacing-xs)}:host.sm.icon-left,:host.sm.icon-right{min-width:88px}:host.lg{font-size:var(--kirby-font-size-n);height:var(--kirby-spacing-xxl);min-width:220px}:host.lg.icon-only{width:var(--kirby-spacing-xxl);min-width:unset}:host.no-decoration{--kirby-button-background-color: transparent;--kirby-button-color: var(--kirby-color-content-base);--kirby-button-border-color: transparent}@media(hover:hover){:host.no-decoration:hover{--kirby-button-background-color: var(--kirby-color-fill-base-hover);--kirby-button-color: var(--kirby-color-content-base-hover);--kirby-button-border-color: var(--kirby-color-border-base-quiet-hover)}}:host.no-decoration:active{--kirby-button-background-color: var(--kirby-color-fill-base-active);--kirby-button-color: var(--kirby-color-content-base-active);--kirby-button-border-color: var(--kirby-color-border-base-quiet-active)}:host.attention-level1{--kirby-button-background-color: var(--kirby-color-fill-brand-loud);--kirby-button-color: var(--kirby-color-content-brand-loud);--kirby-button-border-color: var(--kirby-color-border-brand-loud)}@media(hover:hover){:host.attention-level1:hover{--kirby-button-background-color: var(--kirby-color-fill-brand-loud-hover);--kirby-button-color: var(--kirby-color-content-brand-loud-hover);--kirby-button-border-color: var(--kirby-color-border-brand-loud-hover)}}:host.attention-level1:active{--kirby-button-background-color: var(--kirby-color-fill-brand-loud-active);--kirby-button-color: var(--kirby-color-content-brand-loud-active);--kirby-button-border-color: var(--kirby-color-border-brand-loud-active)}:host.attention-level1.destructive{--kirby-button-background-color: var(--kirby-color-fill-danger);--kirby-button-color: var(--kirby-color-content-danger);--kirby-button-border-color: var(--kirby-color-border-danger)}@media(hover:hover){:host.attention-level1.destructive:hover{--kirby-button-background-color: var(--kirby-color-fill-danger-hover);--kirby-button-color: var(--kirby-color-content-danger-hover);--kirby-button-border-color: var(--kirby-color-border-danger-hover)}}:host.attention-level1.destructive:active{--kirby-button-background-color: var(--kirby-color-fill-danger-active);--kirby-button-color: var(--kirby-color-content-danger-active);--kirby-button-border-color: var(--kirby-color-border-danger-active)}:host.attention-level2{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host.attention-level2:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host.attention-level2:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host.attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host.attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host.attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host:focus-visible{transition:all 80ms linear 0ms;box-shadow:var(--kirby-focus-ring-md-combined-inset);border-color:var(--kirby-color-border-focus)}:host[expand=block]{width:100%}:host:disabled,:host[aria-disabled=true]{pointer-events:none;opacity:var(--kirby-opacity-40)}:host.floating{width:64px!important;height:64px!important;min-width:unset}:host.floating:not(:disabled){box-shadow:var(--kirby-elevation-8)}:host(a){text-decoration:none}:host-context(kirby-item)[slot=end]{margin-inline:var(--kirby-spacing-s) 0}:host-context(kirby-dropdown){justify-content:space-between}:host-context(ion-toolbar ion-buttons.legacy-actions){font-size:var(--kirby-font-size-s);height:var(--kirby-spacing-xl)}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only{width:var(--kirby-spacing-xl)}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2:hover,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.no-decoration:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level1:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level2:active,:host-context(ion-toolbar ion-buttons.legacy-actions).icon-only.attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host-context(.page-title kirby-page-actions).no-decoration,:host-context(.page-title kirby-page-actions).attention-level1,:host-context(.page-title kirby-page-actions).attention-level2,:host-context(.page-title kirby-page-actions).attention-level3{--kirby-button-background-color: var(--kirby-color-fill-raised);--kirby-button-color: var(--kirby-color-content-raised);--kirby-button-border-color: var(--kirby-color-border-raised-quiet)}@media(hover:hover){:host-context(.page-title kirby-page-actions).no-decoration:hover,:host-context(.page-title kirby-page-actions).attention-level1:hover,:host-context(.page-title kirby-page-actions).attention-level2:hover,:host-context(.page-title kirby-page-actions).attention-level3:hover{--kirby-button-background-color: var(--kirby-color-fill-raised-hover);--kirby-button-color: var(--kirby-color-content-raised-hover);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-hover)}}:host-context(.page-title kirby-page-actions).no-decoration:active,:host-context(.page-title kirby-page-actions).attention-level1:active,:host-context(.page-title kirby-page-actions).attention-level2:active,:host-context(.page-title kirby-page-actions).attention-level3:active{--kirby-button-background-color: var(--kirby-color-fill-raised-active);--kirby-button-color: var(--kirby-color-content-raised-active);--kirby-button-border-color: var(--kirby-color-border-raised-quiet-active)}:host-context(kirby-empty-state .content){font-size:var(--kirby-font-size-n);height:var(--kirby-spacing-xxl);min-width:220px}:host-context(kirby-empty-state .content).icon-only{width:var(--kirby-spacing-xxl);min-width:unset}:host-context(kirby-toggle-button).success{--kirby-button-background-color: var(--kirby-color-fill-success-loud);--kirby-button-color: var(--kirby-color-content-success-loud);--kirby-button-border-color: var(--kirby-color-border-success-loud)}@media(hover:hover){:host-context(kirby-toggle-button).success:hover{--kirby-button-background-color: var(--kirby-color-fill-success-loud-hover);--kirby-button-color: var(--kirby-color-content-success-loud-hover);--kirby-button-border-color: var(--kirby-color-border-success-loud-hover)}}:host-context(kirby-toggle-button).success:active{--kirby-button-background-color: var(--kirby-color-fill-success-loud-active);--kirby-button-color: var(--kirby-color-content-success-loud-active);--kirby-button-border-color: var(--kirby-color-border-success-loud-active)}:host-context(kirby-toggle-button).warning{--kirby-button-background-color: var(--kirby-color-fill-warning-loud);--kirby-button-color: var(--kirby-color-content-warning-loud);--kirby-button-border-color: var(--kirby-color-border-warning-loud)}@media(hover:hover){:host-context(kirby-toggle-button).warning:hover{--kirby-button-background-color: var(--kirby-color-fill-warning-loud-hover);--kirby-button-color: var(--kirby-color-content-warning-loud-hover);--kirby-button-border-color: var(--kirby-color-border-warning-loud-hover)}}:host-context(kirby-toggle-button).warning:active{--kirby-button-background-color: var(--kirby-color-fill-warning-loud-active);--kirby-button-color: var(--kirby-color-content-warning-loud-active);--kirby-button-border-color: var(--kirby-color-border-warning-loud-active)}:host-context(kirby-toggle-button).danger{--kirby-button-background-color: var(--kirby-color-fill-danger-loud);--kirby-button-color: var(--kirby-color-content-danger-loud);--kirby-button-border-color: var(--kirby-color-border-danger-loud)}@media(hover:hover){:host-context(kirby-toggle-button).danger:hover{--kirby-button-background-color: var(--kirby-color-fill-danger-loud-hover);--kirby-button-color: var(--kirby-color-content-danger-loud-hover);--kirby-button-border-color: var(--kirby-color-border-danger-loud-hover)}}:host-context(kirby-toggle-button).danger:active{--kirby-button-background-color: var(--kirby-color-fill-danger-loud-active);--kirby-button-color: var(--kirby-color-content-danger-loud-active);--kirby-button-border-color: var(--kirby-color-border-danger-loud-active)}:host-context(kirby-page-actions),:host-context(kirby-action-group),:host-context(.kirby-modal ion-header ion-toolbar ion-buttons){margin:0}:host-context(kirby-modal-footer){margin-top:0;margin-bottom:0}:host-context(kirby-modal-footer):first-child{margin-left:0}:host-context(kirby-modal-footer):last-child{margin-right:0}\n"]
|
|
164
164
|
}]
|
|
165
165
|
}],
|
|
166
166
|
ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kirbydesign-designsystem-button.mjs","names":[],"sources":["../../button/src/button.component.ts","../../button/src/button.component.html"],"sourcesContent":["import {\n AfterContentInit,\n ChangeDetectionStrategy,\n Component,\n ContentChild,\n ElementRef,\n HostBinding,\n Input,\n OnDestroy,\n OnInit,\n Renderer2,\n} from '@angular/core';\n\nimport { NotificationColor } from '@kirbydesign/core';\nimport { EventListenerDisposeFn } from '@kirbydesign/designsystem/types';\n\nimport { IconComponent } from '@kirbydesign/designsystem/icon';\n\nexport enum ButtonSize {\n XS = 'xs',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n}\n\nexport type AttentionLevel = '1' | '2' | '3';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'button[kirby-button],Button[kirby-button],a[kirby-button]',\n templateUrl: './button.component.html',\n styleUrls: ['./button.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ButtonComponent implements AfterContentInit, OnDestroy, OnInit {\n @Input() attentionLevel: AttentionLevel;\n\n @HostBinding('class.no-decoration')\n @Input()\n noDecoration = false;\n\n @HostBinding('class.floating')\n public get isButtonFloating(): boolean {\n return this.isFloating;\n }\n\n @HostBinding('class.icon-only')\n public get isIconOnly(): boolean {\n return !!this.iconElementRef && this.showIconOnly;\n }\n private _isIconLeft = false;\n @HostBinding('class.icon-left')\n public get isIconLeft() {\n return this._isIconLeft && !this.showIconOnly;\n }\n private _isIconRight = false;\n @HostBinding('class.icon-right')\n public get isIconRight() {\n return this._isIconRight && !this.showIconOnly;\n }\n\n @HostBinding('class')\n get _cssClass() {\n const attentionLevel = this.getAttentionLevelCssClass();\n return [this.themeColor, this.size, attentionLevel].filter((cssClass) => !!cssClass);\n }\n\n private getAttentionLevelCssClass() {\n if (this.noDecoration) return;\n const attentionLevelDefault: AttentionLevel = '1';\n return `attention-level${this.attentionLevel || attentionLevelDefault}`;\n }\n\n @Input()\n themeColor: NotificationColor;\n @Input() expand: 'full' | 'block';\n @Input() isFloating: boolean = false;\n @Input()\n size: ButtonSize | `${ButtonSize}` = ButtonSize.MD;\n\n private _showIconOnly: boolean = false;\n get showIconOnly() {\n return this._showIconOnly;\n }\n @Input() set showIconOnly(value: boolean) {\n if (value) {\n // If the button text is supplied as plain text (i.e. as a text node not within an element tag),\n // we need to wrap it in an element to be able to target and hide it with css:\n this.wrapTextNode(this.iconElementRef?.nativeElement);\n }\n this._showIconOnly = value;\n }\n\n @ContentChild(IconComponent, { read: ElementRef })\n iconElementRef?: ElementRef<HTMLElement>;\n\n private disposeEventListeners: EventListenerDisposeFn[] = [];\n\n constructor(\n private elementRef: ElementRef<HTMLElement>,\n private renderer: Renderer2\n ) {}\n\n ngOnInit(): void {\n this.setupEventListenerForAriaDisabledHandling();\n }\n\n setupEventListenerForAriaDisabledHandling() {\n // Prevent event bubbling for aria-disabled buttons using a native event listener.\n // HostListener cannot block event bubbling, see: https://github.com/angular/angular/issues/9587\n ['click', 'keydown.enter', 'keydown.space'].forEach((evt) => {\n const disposeEventListener = this.renderer.listen(\n this.elementRef.nativeElement,\n evt,\n this.blockEventIfAriaDisabled.bind(this),\n { capture: true }\n );\n this.disposeEventListeners.push(disposeEventListener);\n });\n }\n\n private wrapTextNode(iconElement?: HTMLElement) {\n if (!iconElement) {\n return;\n }\n\n const ifTextNode = (node?: ChildNode): ChildNode | undefined => {\n return node?.nodeType === Node.TEXT_NODE ? node : undefined;\n };\n\n const textNode = ifTextNode(iconElement.previousSibling) || ifTextNode(iconElement.nextSibling);\n if (textNode) {\n const placement = textNode === iconElement.previousSibling ? 'before' : 'after';\n const textWrapper = this.renderer.createElement('span');\n const parent = textNode.parentNode;\n this.renderer.removeChild(textNode.parentNode, textNode);\n this.renderer.appendChild(textWrapper, textNode);\n if (placement === 'before') {\n this.renderer.insertBefore(parent, textWrapper, iconElement);\n } else if (placement === 'after') {\n this.renderer.appendChild(parent, textWrapper);\n }\n }\n }\n\n ngAfterContentInit(): void {\n const iconElement = this.iconElementRef?.nativeElement;\n\n if (iconElement === undefined) {\n // Nothing to do here when there's no icon:\n return;\n }\n\n // Ensure buttons with icon is always shown as icon only inside the toolbar:\n if (this.elementRef.nativeElement.closest('ion-toolbar')) {\n this._showIconOnly = true;\n }\n\n if (this.showIconOnly) {\n // If the button text is supplied as plain text (i.e. as a text node not within an element tag),\n // we need to wrap it in an element to be able to target and hide it with css:\n this.wrapTextNode(iconElement);\n }\n\n const hasText = !!this.elementRef.nativeElement.textContent;\n if (!hasText) {\n // Button doesn't contain any text, make it round:\n this._showIconOnly = true;\n }\n\n if (hasText && !this.showIconOnly) {\n this._isIconLeft = this.elementRef.nativeElement.firstChild === iconElement;\n this._isIconRight = !this._isIconLeft;\n }\n }\n\n private blockEventIfAriaDisabled(event: Event) {\n if (this.elementRef.nativeElement.ariaDisabled === 'true') {\n event.preventDefault();\n event.stopImmediatePropagation();\n }\n }\n\n ngOnDestroy() {\n this.disposeEventListeners.forEach((unlistenEvent) => unlistenEvent());\n }\n}\n","<ng-content></ng-content>\n"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"kirbydesign-designsystem-button.mjs","names":[],"sources":["../../button/src/button.component.ts","../../button/src/button.component.html"],"sourcesContent":["import {\n AfterContentInit,\n ChangeDetectionStrategy,\n Component,\n ContentChild,\n ElementRef,\n HostBinding,\n Input,\n OnDestroy,\n OnInit,\n Renderer2,\n} from '@angular/core';\n\nimport { NotificationColor } from '@kirbydesign/core';\nimport { EventListenerDisposeFn } from '@kirbydesign/designsystem/types';\n\nimport { IconComponent } from '@kirbydesign/designsystem/icon';\n\nexport enum ButtonSize {\n XS = 'xs',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n}\n\nexport type AttentionLevel = '1' | '2' | '3';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'button[kirby-button],Button[kirby-button],a[kirby-button]',\n templateUrl: './button.component.html',\n styleUrls: ['./button.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ButtonComponent implements AfterContentInit, OnDestroy, OnInit {\n @Input() attentionLevel: AttentionLevel;\n\n @HostBinding('class.no-decoration')\n @Input()\n noDecoration = false;\n\n @HostBinding('class.floating')\n public get isButtonFloating(): boolean {\n return this.isFloating;\n }\n\n @HostBinding('class.icon-only')\n public get isIconOnly(): boolean {\n return !!this.iconElementRef && this.showIconOnly;\n }\n private _isIconLeft = false;\n @HostBinding('class.icon-left')\n public get isIconLeft() {\n return this._isIconLeft && !this.showIconOnly;\n }\n private _isIconRight = false;\n @HostBinding('class.icon-right')\n public get isIconRight() {\n return this._isIconRight && !this.showIconOnly;\n }\n\n @HostBinding('class')\n get _cssClass() {\n const attentionLevel = this.getAttentionLevelCssClass();\n return [this.themeColor, this.size, attentionLevel].filter((cssClass) => !!cssClass);\n }\n\n private getAttentionLevelCssClass() {\n if (this.noDecoration) return;\n const attentionLevelDefault: AttentionLevel = '1';\n return `attention-level${this.attentionLevel || attentionLevelDefault}`;\n }\n\n @Input()\n themeColor: NotificationColor;\n @Input() expand: 'full' | 'block';\n @Input() isFloating: boolean = false;\n @Input()\n size: ButtonSize | `${ButtonSize}` = ButtonSize.MD;\n\n private _showIconOnly: boolean = false;\n get showIconOnly() {\n return this._showIconOnly;\n }\n @Input() set showIconOnly(value: boolean) {\n if (value) {\n // If the button text is supplied as plain text (i.e. as a text node not within an element tag),\n // we need to wrap it in an element to be able to target and hide it with css:\n this.wrapTextNode(this.iconElementRef?.nativeElement);\n }\n this._showIconOnly = value;\n }\n\n @ContentChild(IconComponent, { read: ElementRef })\n iconElementRef?: ElementRef<HTMLElement>;\n\n private disposeEventListeners: EventListenerDisposeFn[] = [];\n\n constructor(\n private elementRef: ElementRef<HTMLElement>,\n private renderer: Renderer2\n ) {}\n\n ngOnInit(): void {\n this.setupEventListenerForAriaDisabledHandling();\n }\n\n setupEventListenerForAriaDisabledHandling() {\n // Prevent event bubbling for aria-disabled buttons using a native event listener.\n // HostListener cannot block event bubbling, see: https://github.com/angular/angular/issues/9587\n ['click', 'keydown.enter', 'keydown.space'].forEach((evt) => {\n const disposeEventListener = this.renderer.listen(\n this.elementRef.nativeElement,\n evt,\n this.blockEventIfAriaDisabled.bind(this),\n { capture: true }\n );\n this.disposeEventListeners.push(disposeEventListener);\n });\n }\n\n private wrapTextNode(iconElement?: HTMLElement) {\n if (!iconElement) {\n return;\n }\n\n const ifTextNode = (node?: ChildNode): ChildNode | undefined => {\n return node?.nodeType === Node.TEXT_NODE ? node : undefined;\n };\n\n const textNode = ifTextNode(iconElement.previousSibling) || ifTextNode(iconElement.nextSibling);\n if (textNode) {\n const placement = textNode === iconElement.previousSibling ? 'before' : 'after';\n const textWrapper = this.renderer.createElement('span');\n const parent = textNode.parentNode;\n this.renderer.removeChild(textNode.parentNode, textNode);\n this.renderer.appendChild(textWrapper, textNode);\n if (placement === 'before') {\n this.renderer.insertBefore(parent, textWrapper, iconElement);\n } else if (placement === 'after') {\n this.renderer.appendChild(parent, textWrapper);\n }\n }\n }\n\n ngAfterContentInit(): void {\n const iconElement = this.iconElementRef?.nativeElement;\n\n if (iconElement === undefined) {\n // Nothing to do here when there's no icon:\n return;\n }\n\n // Ensure buttons with icon is always shown as icon only inside the toolbar:\n if (this.elementRef.nativeElement.closest('ion-toolbar')) {\n this._showIconOnly = true;\n }\n\n if (this.showIconOnly) {\n // If the button text is supplied as plain text (i.e. as a text node not within an element tag),\n // we need to wrap it in an element to be able to target and hide it with css:\n this.wrapTextNode(iconElement);\n }\n\n const hasText = !!this.elementRef.nativeElement.textContent;\n if (!hasText) {\n // Button doesn't contain any text, make it round:\n this._showIconOnly = true;\n }\n\n if (hasText && !this.showIconOnly) {\n this._isIconLeft = this.elementRef.nativeElement.firstChild === iconElement;\n this._isIconRight = !this._isIconLeft;\n }\n }\n\n private blockEventIfAriaDisabled(event: Event) {\n if (this.elementRef.nativeElement.ariaDisabled === 'true') {\n event.preventDefault();\n event.stopImmediatePropagation();\n }\n }\n\n ngOnDestroy() {\n this.disposeEventListeners.forEach((unlistenEvent) => unlistenEvent());\n }\n}\n","<ng-content></ng-content>\n"],"mappings":"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"}
|