@kirbydesign/designsystem 8.9.0 → 8.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/accordion/accordion-item.component.d.ts +4 -3
- package/esm2020/accordion/accordion-item.component.mjs +10 -4
- package/esm2020/action-group/action-group.component.mjs +2 -2
- package/esm2020/calendar/calendar.component.mjs +6 -8
- package/esm2020/divider/divider.component.mjs +3 -3
- package/esm2020/dropdown/dropdown.component.mjs +1 -1
- package/esm2020/icon/kirby-icon-settings.mjs +4 -1
- package/esm2020/item/item.component.mjs +6 -3
- package/esm2020/item-sliding/item-sliding.component.mjs +13 -6
- package/esm2020/page/page.component.mjs +3 -3
- package/esm2020/reorder-list/reorder-list.component.mjs +3 -3
- package/esm2020/tab-navigation/tab-navigation/tab-navigation.component.mjs +2 -2
- package/esm2020/tabs/tab-button/tab-button.component.mjs +2 -2
- package/esm2020/testing/test-helper.mjs +9 -1
- package/fesm2015/kirbydesign-designsystem-accordion.mjs +9 -3
- package/fesm2015/kirbydesign-designsystem-accordion.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-action-group.mjs +1 -1
- package/fesm2015/kirbydesign-designsystem-action-group.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-calendar.mjs +5 -7
- package/fesm2015/kirbydesign-designsystem-calendar.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-divider.mjs +2 -2
- package/fesm2015/kirbydesign-designsystem-divider.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-dropdown.mjs +1 -1
- package/fesm2015/kirbydesign-designsystem-dropdown.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-icon.mjs +3 -0
- package/fesm2015/kirbydesign-designsystem-icon.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-item-sliding.mjs +12 -5
- package/fesm2015/kirbydesign-designsystem-item-sliding.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-item.mjs +5 -2
- package/fesm2015/kirbydesign-designsystem-item.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-page.mjs +2 -2
- package/fesm2015/kirbydesign-designsystem-page.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-reorder-list.mjs +2 -2
- package/fesm2015/kirbydesign-designsystem-reorder-list.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-tab-navigation.mjs +1 -1
- package/fesm2015/kirbydesign-designsystem-tab-navigation.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-tabs.mjs +2 -2
- package/fesm2015/kirbydesign-designsystem-tabs.mjs.map +1 -1
- package/fesm2015/kirbydesign-designsystem-testing.mjs +8 -0
- package/fesm2015/kirbydesign-designsystem-testing.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-accordion.mjs +9 -3
- package/fesm2020/kirbydesign-designsystem-accordion.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-action-group.mjs +1 -1
- package/fesm2020/kirbydesign-designsystem-action-group.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-calendar.mjs +5 -7
- package/fesm2020/kirbydesign-designsystem-calendar.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-divider.mjs +2 -2
- package/fesm2020/kirbydesign-designsystem-divider.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-dropdown.mjs +1 -1
- package/fesm2020/kirbydesign-designsystem-dropdown.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-icon.mjs +3 -0
- package/fesm2020/kirbydesign-designsystem-icon.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-item-sliding.mjs +12 -5
- package/fesm2020/kirbydesign-designsystem-item-sliding.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-item.mjs +5 -2
- package/fesm2020/kirbydesign-designsystem-item.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-page.mjs +2 -2
- package/fesm2020/kirbydesign-designsystem-page.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-reorder-list.mjs +2 -2
- package/fesm2020/kirbydesign-designsystem-reorder-list.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-tab-navigation.mjs +1 -1
- package/fesm2020/kirbydesign-designsystem-tab-navigation.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-tabs.mjs +2 -2
- package/fesm2020/kirbydesign-designsystem-tabs.mjs.map +1 -1
- package/fesm2020/kirbydesign-designsystem-testing.mjs +8 -0
- package/fesm2020/kirbydesign-designsystem-testing.mjs.map +1 -1
- package/icons/svg/adjust.svg +2 -0
- package/icons/svg/grid.svg +2 -0
- package/icons/svg/list.svg +2 -0
- package/item/item.component.d.ts +2 -1
- package/item-sliding/item-sliding.component.d.ts +3 -0
- package/package.json +1 -1
- package/testing/test-helper.d.ts +1 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kirbydesign-designsystem-icon.mjs","sources":["../../../../libs/designsystem/icon/src/icon-registry.service.ts","../../../../libs/designsystem/icon/src/kirby-icon-settings.ts","../../../../libs/designsystem/icon/src/icon.component.ts","../../../../libs/designsystem/icon/src/icon.component.html","../../../../libs/designsystem/icon/src/icon.module.ts","../../../../libs/designsystem/icon/src/kirbydesign-designsystem-icon.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\n\nimport { Icon } from './icon-settings';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class IconRegistryService {\n private iconRegistry = new Map<string, string>();\n\n public addIcon(iconName: string, svgPath: string): void {\n if (!this.iconRegistry.has(iconName)) {\n this.iconRegistry.set(iconName, svgPath);\n } else {\n console.warn(`Icon with name: \"${iconName}\" already exists`);\n }\n }\n\n public addIcons(icons: Icon[]): void {\n if (!icons) {\n console.error('Icons not defined');\n return;\n }\n icons.forEach((icon) => {\n this.addIcon(icon.name, icon.svg);\n });\n }\n\n getIcons(): Icon[] {\n return [...this.iconRegistry].map(\n (keyValPair) => ({ name: keyValPair[0], svg: keyValPair[1] } as Icon)\n );\n }\n\n getIcon(name: string): Icon {\n const svg = this.iconRegistry.get(name);\n return svg ? { name, svg } : undefined;\n }\n}\n","import { IconSettings } from './icon-settings';\n\n/* eslint-disable */\nexport const kirbyIconSettings: IconSettings = {\n icons: [\n { name: 'accounts-outline', svg: 'assets/kirby/icons/svg/accounts-outline.svg' },\n { name: 'accounts', svg: 'assets/kirby/icons/svg/accounts.svg' },\n { name: 'add', svg: 'assets/kirby/icons/svg/add.svg' },\n { name: 'remove', svg: 'assets/kirby/icons/svg/remove.svg' },\n { name: 'unsubscribe', svg: 'assets/kirby/icons/svg/unsubscribe.svg' },\n { name: 'arrow-back', svg: 'assets/kirby/icons/svg/arrow-back.svg' },\n { name: 'arrow-down', svg: 'assets/kirby/icons/svg/arrow-down.svg' },\n { name: 'arrow-more', svg: 'assets/kirby/icons/svg/arrow-more.svg' },\n { name: 'arrow-up', svg: 'assets/kirby/icons/svg/arrow-up.svg' },\n { name: 'attach', svg: 'assets/kirby/icons/svg/attach.svg' },\n { name: 'backspace', svg: 'assets/kirby/icons/svg/backspace.svg' },\n { name: 'calendar', svg: 'assets/kirby/icons/svg/calendar.svg' },\n { name: 'camera', svg: 'assets/kirby/icons/svg/camera.svg' },\n { name: 'car', svg: 'assets/kirby/icons/svg/car.svg' },\n { name: 'checkbox-outline', svg: 'assets/kirby/icons/svg/checkbox-outline.svg' },\n { name: 'checkbox', svg: 'assets/kirby/icons/svg/checkbox.svg' },\n { name: 'checkmark-selected', svg: 'assets/kirby/icons/svg/checkmark-selected.svg' },\n { name: 'close', svg: 'assets/kirby/icons/svg/close.svg' },\n { name: 'cog', svg: 'assets/kirby/icons/svg/cog.svg' },\n { name: 'coinstack', svg: 'assets/kirby/icons/svg/coinstack.svg' },\n { name: 'contact', svg: 'assets/kirby/icons/svg/contact.svg' },\n { name: 'copy', svg: 'assets/kirby/icons/svg/copy.svg' },\n { name: 'flag', svg: 'assets/kirby/icons/svg/flag.svg' },\n { name: 'edit', svg: 'assets/kirby/icons/svg/edit.svg' },\n { name: 'filter', svg: 'assets/kirby/icons/svg/filter.svg' },\n { name: 'flash-off', svg: 'assets/kirby/icons/svg/flash-off.svg' },\n { name: 'flash', svg: 'assets/kirby/icons/svg/flash.svg' },\n { name: 'moneybag', svg: 'assets/kirby/icons/svg/moneybag.svg' },\n { name: 'help', svg: 'assets/kirby/icons/svg/help.svg' },\n { name: 'home', svg: 'assets/kirby/icons/svg/home.svg' },\n { name: 'inbox', svg: 'assets/kirby/icons/svg/inbox.svg' },\n { name: 'inbox-outline', svg: 'assets/kirby/icons/svg/inbox-outline.svg' },\n { name: 'information', svg: 'assets/kirby/icons/svg/information.svg' },\n { name: 'insurance', svg: 'assets/kirby/icons/svg/insurance.svg' },\n { name: 'investment', svg: 'assets/kirby/icons/svg/investment.svg' },\n { name: 'kirby', svg: 'assets/kirby/icons/svg/kirby.svg' },\n { name: 'link', svg: 'assets/kirby/icons/svg/link.svg' },\n { name: 'log-out', svg: 'assets/kirby/icons/svg/log-out.svg' },\n { name: 'menu-outline', svg: 'assets/kirby/icons/svg/menu-outline.svg' },\n { name: 'menu', svg: 'assets/kirby/icons/svg/menu.svg' },\n { name: 'menu-no-decoration', svg: 'assets/kirby/icons/svg/menu-no-decoration.svg' },\n { name: 'misc', svg: 'assets/kirby/icons/svg/misc.svg' },\n { name: 'more', svg: 'assets/kirby/icons/svg/more.svg' },\n { name: 'move', svg: 'assets/kirby/icons/svg/move.svg' },\n { name: 'payment-card', svg: 'assets/kirby/icons/svg/payment-card.svg' },\n { name: 'pension', svg: 'assets/kirby/icons/svg/pension.svg' },\n { name: 'person-outline', svg: 'assets/kirby/icons/svg/person-outline.svg' },\n { name: 'person', svg: 'assets/kirby/icons/svg/person.svg' },\n { name: 'qr', svg: 'assets/kirby/icons/svg/QR.svg' },\n { name: 'recurring', svg: 'assets/kirby/icons/svg/recurring.svg' },\n { name: 'salary', svg: 'assets/kirby/icons/svg/salary.svg' },\n { name: 'search', svg: 'assets/kirby/icons/svg/search.svg' },\n { name: 'share', svg: 'assets/kirby/icons/svg/share.svg' },\n { name: 'sort', svg: 'assets/kirby/icons/svg/sort.svg' },\n { name: 'support', svg: 'assets/kirby/icons/svg/support.svg' },\n { name: 'swap', svg: 'assets/kirby/icons/svg/swap.svg' },\n { name: 'trash', svg: 'assets/kirby/icons/svg/trash.svg' },\n { name: 'foreign-payment', svg: 'assets/kirby/icons/svg/foreign-payment.svg' },\n { name: 'clock', svg: 'assets/kirby/icons/svg/clock.svg' },\n { name: 'verify', svg: 'assets/kirby/icons/svg/verify.svg' },\n { name: 'warning', svg: 'assets/kirby/icons/svg/warning.svg' },\n { name: 'write-message', svg: 'assets/kirby/icons/svg/write-message.svg' },\n { name: 'reorder', svg: 'assets/kirby/icons/svg/reorder.svg' },\n { name: 'accident', svg: 'assets/kirby/icons/svg/accident.svg' },\n { name: 'health', svg: 'assets/kirby/icons/svg/health.svg' },\n { name: 'illness', svg: 'assets/kirby/icons/svg/illness.svg' },\n { name: 'incapacity', svg: 'assets/kirby/icons/svg/incapacity.svg' },\n { name: 'life', svg: 'assets/kirby/icons/svg/life.svg' },\n { name: 'help-decoration', svg: 'assets/kirby/icons/svg/help-decoration.svg' },\n { name: 'information-decoration', svg: 'assets/kirby/icons/svg/information-decoration.svg' },\n { name: 'notification', svg: 'assets/kirby/icons/svg/notification.svg' },\n { name: 'transfer-ownership', svg: 'assets/kirby/icons/svg/transfer-ownership.svg' },\n { name: 'update', svg: 'assets/kirby/icons/svg/update.svg' },\n { name: 'user-blocked', svg: 'assets/kirby/icons/svg/user-blocked.svg' },\n { name: 'add-bank', svg: 'assets/kirby/icons/svg/add-bank.svg' },\n { name: 'participants', svg: 'assets/kirby/icons/svg/participants.svg' },\n { name: 'download', svg: 'assets/kirby/icons/svg/download.svg' },\n { name: 'globe-transfer', svg: 'assets/kirby/icons/svg/globe-transfer.svg' },\n { name: 'banknotes', svg: 'assets/kirby/icons/svg/banknotes.svg' },\n { name: 'air-balloon', svg: 'assets/kirby/icons/svg/air-balloon.svg' },\n { name: 'piggybank', svg: 'assets/kirby/icons/svg/piggybank.svg' },\n { name: 'business', svg: 'assets/kirby/icons/svg/business.svg' },\n { name: 'navigation', svg: 'assets/kirby/icons/svg/navigation.svg' },\n { name: 'phone-device', svg: 'assets/kirby/icons/svg/phone-device.svg' },\n { name: 'upload', svg: 'assets/kirby/icons/svg/upload.svg' },\n { name: 'document', svg: 'assets/kirby/icons/svg/document.svg' },\n { name: 'chat', svg: 'assets/kirby/icons/svg/chat.svg' },\n { name: 'feedback', svg: 'assets/kirby/icons/svg/feedback.svg' },\n { name: 'keyboard', svg: 'assets/kirby/icons/svg/keyboard.svg' },\n { name: 'lock', svg: 'assets/kirby/icons/svg/lock.svg' },\n { name: 'see', svg: 'assets/kirby/icons/svg/see.svg' },\n { name: 'overview', svg: 'assets/kirby/icons/svg/overview.svg' },\n { name: 'overview-outline', svg: 'assets/kirby/icons/svg/overview-outline.svg' },\n { name: 'arrow-down-fill', svg: 'assets/kirby/icons/svg/arrow-down-fill.svg' },\n { name: 'arrow-up-fill', svg: 'assets/kirby/icons/svg/arrow-up-fill.svg' },\n { name: 'calculator', svg: 'assets/kirby/icons/svg/calculator.svg' },\n ],\n};\n\nexport const defaultIcons = kirbyIconSettings.icons.map((icon) => icon.name);\n","import {\n ChangeDetectionStrategy,\n Component,\n HostBinding,\n Input,\n OnChanges,\n SimpleChanges,\n} from '@angular/core';\n\nimport { IconRegistryService } from './icon-registry.service';\nimport { Icon } from './icon-settings';\nimport { kirbyIconSettings } from './kirby-icon-settings';\n\nexport enum IconSize {\n XS = 'xs',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n}\n\n@Component({\n selector: 'kirby-icon',\n templateUrl: './icon.component.html',\n styleUrls: ['./icon.component.scss'],\n // eslint-disable-next-line @angular-eslint/no-host-metadata-property\n host: { '[class.kirby-icon]': 'true' },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class IconComponent implements OnChanges {\n defaultIcon: Icon = this.findIcon(kirbyIconSettings.icons, 'cog');\n private _icon = (this.icon = this.defaultIcon);\n @HostBinding('class')\n @Input()\n size: IconSize | `${IconSize}`;\n\n @Input() name: string;\n @Input() customName: string;\n\n get icon(): Icon {\n return this._icon;\n }\n\n set icon(icon: Icon) {\n // If icon are not found, set default icon\n if (!icon && (this.name || this.customName)) {\n this.warnAboutMissingIcon();\n\n icon = this.defaultIcon;\n\n // If default icon are not found\n if (!icon) {\n console.warn('Default icon was not found.');\n return;\n }\n }\n\n // Set icon if it's found\n if (icon) {\n this._icon = icon;\n }\n }\n\n private warnAboutMissingIcon(): void {\n if (this.customName) {\n console.warn(`Custom icon with name \"${this.customName}\" was not found. \n Do you have a typo in 'customName' or\n forgot to configure the custom icon through the 'IconRegistryService'?`);\n } else {\n console.warn(`Built-in icon with name \"${this.name}\" was not found. \n Do you have a typo in 'name' or\n did you mean to use a custom icon? If so, please use: \n <kirby-icon customName=\"${this.name}\"></kirby-icon>`);\n }\n }\n\n constructor(private iconRegistryService: IconRegistryService) {}\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes.name && changes.name.currentValue) {\n this.icon = this.findIcon(kirbyIconSettings.icons, changes.name.currentValue);\n } else if (changes.customName && changes.customName.currentValue) {\n this.icon = this.iconRegistryService.getIcon(changes.customName.currentValue);\n }\n }\n\n private findIcon(icons, name: string): Icon {\n return icons.find((icon) => icon.name === name);\n }\n}\n","<ion-icon [src]=\"icon?.svg\"></ion-icon>\n","import { NgModule } from '@angular/core';\nimport { KirbyIonicModule } from '@kirbydesign/designsystem/kirby-ionic-module';\nimport { ThemeColorDirective } from '@kirbydesign/designsystem/shared';\n\nimport { IconComponent } from './icon.component';\n\n@NgModule({\n imports: [KirbyIonicModule, ThemeColorDirective],\n declarations: [IconComponent],\n exports: [IconComponent, ThemeColorDirective],\n})\nexport class IconModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":["i1.IconRegistryService"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"kirbydesign-designsystem-icon.mjs","sources":["../../../../libs/designsystem/icon/src/icon-registry.service.ts","../../../../libs/designsystem/icon/src/kirby-icon-settings.ts","../../../../libs/designsystem/icon/src/icon.component.ts","../../../../libs/designsystem/icon/src/icon.component.html","../../../../libs/designsystem/icon/src/icon.module.ts","../../../../libs/designsystem/icon/src/kirbydesign-designsystem-icon.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\n\nimport { Icon } from './icon-settings';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class IconRegistryService {\n private iconRegistry = new Map<string, string>();\n\n public addIcon(iconName: string, svgPath: string): void {\n if (!this.iconRegistry.has(iconName)) {\n this.iconRegistry.set(iconName, svgPath);\n } else {\n console.warn(`Icon with name: \"${iconName}\" already exists`);\n }\n }\n\n public addIcons(icons: Icon[]): void {\n if (!icons) {\n console.error('Icons not defined');\n return;\n }\n icons.forEach((icon) => {\n this.addIcon(icon.name, icon.svg);\n });\n }\n\n getIcons(): Icon[] {\n return [...this.iconRegistry].map(\n (keyValPair) => ({ name: keyValPair[0], svg: keyValPair[1] } as Icon)\n );\n }\n\n getIcon(name: string): Icon {\n const svg = this.iconRegistry.get(name);\n return svg ? { name, svg } : undefined;\n }\n}\n","import { IconSettings } from './icon-settings';\n\n/* eslint-disable */\nexport const kirbyIconSettings: IconSettings = {\n icons: [\n { name: 'accounts-outline', svg: 'assets/kirby/icons/svg/accounts-outline.svg' },\n { name: 'accounts', svg: 'assets/kirby/icons/svg/accounts.svg' },\n { name: 'add', svg: 'assets/kirby/icons/svg/add.svg' },\n { name: 'remove', svg: 'assets/kirby/icons/svg/remove.svg' },\n { name: 'unsubscribe', svg: 'assets/kirby/icons/svg/unsubscribe.svg' },\n { name: 'arrow-back', svg: 'assets/kirby/icons/svg/arrow-back.svg' },\n { name: 'arrow-down', svg: 'assets/kirby/icons/svg/arrow-down.svg' },\n { name: 'arrow-more', svg: 'assets/kirby/icons/svg/arrow-more.svg' },\n { name: 'arrow-up', svg: 'assets/kirby/icons/svg/arrow-up.svg' },\n { name: 'attach', svg: 'assets/kirby/icons/svg/attach.svg' },\n { name: 'backspace', svg: 'assets/kirby/icons/svg/backspace.svg' },\n { name: 'calendar', svg: 'assets/kirby/icons/svg/calendar.svg' },\n { name: 'camera', svg: 'assets/kirby/icons/svg/camera.svg' },\n { name: 'car', svg: 'assets/kirby/icons/svg/car.svg' },\n { name: 'checkbox-outline', svg: 'assets/kirby/icons/svg/checkbox-outline.svg' },\n { name: 'checkbox', svg: 'assets/kirby/icons/svg/checkbox.svg' },\n { name: 'checkmark-selected', svg: 'assets/kirby/icons/svg/checkmark-selected.svg' },\n { name: 'close', svg: 'assets/kirby/icons/svg/close.svg' },\n { name: 'cog', svg: 'assets/kirby/icons/svg/cog.svg' },\n { name: 'coinstack', svg: 'assets/kirby/icons/svg/coinstack.svg' },\n { name: 'contact', svg: 'assets/kirby/icons/svg/contact.svg' },\n { name: 'copy', svg: 'assets/kirby/icons/svg/copy.svg' },\n { name: 'flag', svg: 'assets/kirby/icons/svg/flag.svg' },\n { name: 'edit', svg: 'assets/kirby/icons/svg/edit.svg' },\n { name: 'filter', svg: 'assets/kirby/icons/svg/filter.svg' },\n { name: 'flash-off', svg: 'assets/kirby/icons/svg/flash-off.svg' },\n { name: 'flash', svg: 'assets/kirby/icons/svg/flash.svg' },\n { name: 'moneybag', svg: 'assets/kirby/icons/svg/moneybag.svg' },\n { name: 'help', svg: 'assets/kirby/icons/svg/help.svg' },\n { name: 'home', svg: 'assets/kirby/icons/svg/home.svg' },\n { name: 'inbox', svg: 'assets/kirby/icons/svg/inbox.svg' },\n { name: 'inbox-outline', svg: 'assets/kirby/icons/svg/inbox-outline.svg' },\n { name: 'information', svg: 'assets/kirby/icons/svg/information.svg' },\n { name: 'insurance', svg: 'assets/kirby/icons/svg/insurance.svg' },\n { name: 'investment', svg: 'assets/kirby/icons/svg/investment.svg' },\n { name: 'kirby', svg: 'assets/kirby/icons/svg/kirby.svg' },\n { name: 'link', svg: 'assets/kirby/icons/svg/link.svg' },\n { name: 'log-out', svg: 'assets/kirby/icons/svg/log-out.svg' },\n { name: 'menu-outline', svg: 'assets/kirby/icons/svg/menu-outline.svg' },\n { name: 'menu', svg: 'assets/kirby/icons/svg/menu.svg' },\n { name: 'menu-no-decoration', svg: 'assets/kirby/icons/svg/menu-no-decoration.svg' },\n { name: 'misc', svg: 'assets/kirby/icons/svg/misc.svg' },\n { name: 'more', svg: 'assets/kirby/icons/svg/more.svg' },\n { name: 'move', svg: 'assets/kirby/icons/svg/move.svg' },\n { name: 'payment-card', svg: 'assets/kirby/icons/svg/payment-card.svg' },\n { name: 'pension', svg: 'assets/kirby/icons/svg/pension.svg' },\n { name: 'person-outline', svg: 'assets/kirby/icons/svg/person-outline.svg' },\n { name: 'person', svg: 'assets/kirby/icons/svg/person.svg' },\n { name: 'qr', svg: 'assets/kirby/icons/svg/QR.svg' },\n { name: 'recurring', svg: 'assets/kirby/icons/svg/recurring.svg' },\n { name: 'salary', svg: 'assets/kirby/icons/svg/salary.svg' },\n { name: 'search', svg: 'assets/kirby/icons/svg/search.svg' },\n { name: 'share', svg: 'assets/kirby/icons/svg/share.svg' },\n { name: 'sort', svg: 'assets/kirby/icons/svg/sort.svg' },\n { name: 'support', svg: 'assets/kirby/icons/svg/support.svg' },\n { name: 'swap', svg: 'assets/kirby/icons/svg/swap.svg' },\n { name: 'trash', svg: 'assets/kirby/icons/svg/trash.svg' },\n { name: 'foreign-payment', svg: 'assets/kirby/icons/svg/foreign-payment.svg' },\n { name: 'clock', svg: 'assets/kirby/icons/svg/clock.svg' },\n { name: 'verify', svg: 'assets/kirby/icons/svg/verify.svg' },\n { name: 'warning', svg: 'assets/kirby/icons/svg/warning.svg' },\n { name: 'write-message', svg: 'assets/kirby/icons/svg/write-message.svg' },\n { name: 'reorder', svg: 'assets/kirby/icons/svg/reorder.svg' },\n { name: 'accident', svg: 'assets/kirby/icons/svg/accident.svg' },\n { name: 'health', svg: 'assets/kirby/icons/svg/health.svg' },\n { name: 'illness', svg: 'assets/kirby/icons/svg/illness.svg' },\n { name: 'incapacity', svg: 'assets/kirby/icons/svg/incapacity.svg' },\n { name: 'life', svg: 'assets/kirby/icons/svg/life.svg' },\n { name: 'help-decoration', svg: 'assets/kirby/icons/svg/help-decoration.svg' },\n { name: 'information-decoration', svg: 'assets/kirby/icons/svg/information-decoration.svg' },\n { name: 'notification', svg: 'assets/kirby/icons/svg/notification.svg' },\n { name: 'transfer-ownership', svg: 'assets/kirby/icons/svg/transfer-ownership.svg' },\n { name: 'update', svg: 'assets/kirby/icons/svg/update.svg' },\n { name: 'user-blocked', svg: 'assets/kirby/icons/svg/user-blocked.svg' },\n { name: 'add-bank', svg: 'assets/kirby/icons/svg/add-bank.svg' },\n { name: 'participants', svg: 'assets/kirby/icons/svg/participants.svg' },\n { name: 'download', svg: 'assets/kirby/icons/svg/download.svg' },\n { name: 'globe-transfer', svg: 'assets/kirby/icons/svg/globe-transfer.svg' },\n { name: 'banknotes', svg: 'assets/kirby/icons/svg/banknotes.svg' },\n { name: 'air-balloon', svg: 'assets/kirby/icons/svg/air-balloon.svg' },\n { name: 'piggybank', svg: 'assets/kirby/icons/svg/piggybank.svg' },\n { name: 'business', svg: 'assets/kirby/icons/svg/business.svg' },\n { name: 'navigation', svg: 'assets/kirby/icons/svg/navigation.svg' },\n { name: 'phone-device', svg: 'assets/kirby/icons/svg/phone-device.svg' },\n { name: 'upload', svg: 'assets/kirby/icons/svg/upload.svg' },\n { name: 'document', svg: 'assets/kirby/icons/svg/document.svg' },\n { name: 'chat', svg: 'assets/kirby/icons/svg/chat.svg' },\n { name: 'feedback', svg: 'assets/kirby/icons/svg/feedback.svg' },\n { name: 'keyboard', svg: 'assets/kirby/icons/svg/keyboard.svg' },\n { name: 'lock', svg: 'assets/kirby/icons/svg/lock.svg' },\n { name: 'see', svg: 'assets/kirby/icons/svg/see.svg' },\n { name: 'overview', svg: 'assets/kirby/icons/svg/overview.svg' },\n { name: 'overview-outline', svg: 'assets/kirby/icons/svg/overview-outline.svg' },\n { name: 'arrow-down-fill', svg: 'assets/kirby/icons/svg/arrow-down-fill.svg' },\n { name: 'arrow-up-fill', svg: 'assets/kirby/icons/svg/arrow-up-fill.svg' },\n { name: 'calculator', svg: 'assets/kirby/icons/svg/calculator.svg' },\n { name: 'grid', svg: 'assets/kirby/icons/svg/grid.svg' },\n { name: 'list', svg: 'assets/kirby/icons/svg/list.svg' },\n { name: 'adjust', svg: 'assets/kirby/icons/svg/adjust.svg' },\n ],\n};\n\nexport const defaultIcons = kirbyIconSettings.icons.map((icon) => icon.name);\n","import {\n ChangeDetectionStrategy,\n Component,\n HostBinding,\n Input,\n OnChanges,\n SimpleChanges,\n} from '@angular/core';\n\nimport { IconRegistryService } from './icon-registry.service';\nimport { Icon } from './icon-settings';\nimport { kirbyIconSettings } from './kirby-icon-settings';\n\nexport enum IconSize {\n XS = 'xs',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n}\n\n@Component({\n selector: 'kirby-icon',\n templateUrl: './icon.component.html',\n styleUrls: ['./icon.component.scss'],\n // eslint-disable-next-line @angular-eslint/no-host-metadata-property\n host: { '[class.kirby-icon]': 'true' },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class IconComponent implements OnChanges {\n defaultIcon: Icon = this.findIcon(kirbyIconSettings.icons, 'cog');\n private _icon = (this.icon = this.defaultIcon);\n @HostBinding('class')\n @Input()\n size: IconSize | `${IconSize}`;\n\n @Input() name: string;\n @Input() customName: string;\n\n get icon(): Icon {\n return this._icon;\n }\n\n set icon(icon: Icon) {\n // If icon are not found, set default icon\n if (!icon && (this.name || this.customName)) {\n this.warnAboutMissingIcon();\n\n icon = this.defaultIcon;\n\n // If default icon are not found\n if (!icon) {\n console.warn('Default icon was not found.');\n return;\n }\n }\n\n // Set icon if it's found\n if (icon) {\n this._icon = icon;\n }\n }\n\n private warnAboutMissingIcon(): void {\n if (this.customName) {\n console.warn(`Custom icon with name \"${this.customName}\" was not found. \n Do you have a typo in 'customName' or\n forgot to configure the custom icon through the 'IconRegistryService'?`);\n } else {\n console.warn(`Built-in icon with name \"${this.name}\" was not found. \n Do you have a typo in 'name' or\n did you mean to use a custom icon? If so, please use: \n <kirby-icon customName=\"${this.name}\"></kirby-icon>`);\n }\n }\n\n constructor(private iconRegistryService: IconRegistryService) {}\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes.name && changes.name.currentValue) {\n this.icon = this.findIcon(kirbyIconSettings.icons, changes.name.currentValue);\n } else if (changes.customName && changes.customName.currentValue) {\n this.icon = this.iconRegistryService.getIcon(changes.customName.currentValue);\n }\n }\n\n private findIcon(icons, name: string): Icon {\n return icons.find((icon) => icon.name === name);\n }\n}\n","<ion-icon [src]=\"icon?.svg\"></ion-icon>\n","import { NgModule } from '@angular/core';\nimport { KirbyIonicModule } from '@kirbydesign/designsystem/kirby-ionic-module';\nimport { ThemeColorDirective } from '@kirbydesign/designsystem/shared';\n\nimport { IconComponent } from './icon.component';\n\n@NgModule({\n imports: [KirbyIonicModule, ThemeColorDirective],\n declarations: [IconComponent],\n exports: [IconComponent, ThemeColorDirective],\n})\nexport class IconModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":["i1.IconRegistryService"],"mappings":"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"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as i3 from '@angular/common';
|
|
2
2
|
import { CommonModule } from '@angular/common';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { Component, Input } from '@angular/core';
|
|
4
|
+
import { Component, ViewChild, Input } from '@angular/core';
|
|
5
5
|
import * as i2 from '@ionic/angular';
|
|
6
|
-
import { IonicModule } from '@ionic/angular';
|
|
6
|
+
import { IonItemSliding, IonicModule } from '@ionic/angular';
|
|
7
7
|
import * as i1 from '@kirbydesign/designsystem/icon';
|
|
8
8
|
import { IconModule } from '@kirbydesign/designsystem/icon';
|
|
9
9
|
|
|
@@ -20,13 +20,20 @@ class ItemSlidingComponent {
|
|
|
20
20
|
// will only return true when swipeActions is an array
|
|
21
21
|
return ((_a = this.swipeActions) === null || _a === void 0 ? void 0 : _a.length) > 0;
|
|
22
22
|
}
|
|
23
|
+
onSwipeActionClick(swipeAction) {
|
|
24
|
+
swipeAction.onSelected();
|
|
25
|
+
this.itemSliding.close();
|
|
26
|
+
}
|
|
23
27
|
}
|
|
24
28
|
/** @nocollapse */ ItemSlidingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ItemSlidingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
25
|
-
/** @nocollapse */ ItemSlidingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ItemSlidingComponent, isStandalone: true, selector: "kirby-item-sliding", inputs: { swipeActions: "swipeActions", side: "side" }, ngImport: i0, template: "<ion-item-sliding>\n <ng-content></ng-content>\n\n <ion-item-options *ngIf=\"_hasSwipeActions\" [side]=\"_side\">\n <ng-container *ngFor=\"let swipeAction of swipeActions\">\n <ion-item-option\n *ngIf=\"!swipeAction.isDisabled\"\n [ngClass]=\"swipeAction.type\"\n (click)=\"swipeAction
|
|
29
|
+
/** @nocollapse */ ItemSlidingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ItemSlidingComponent, isStandalone: true, selector: "kirby-item-sliding", inputs: { swipeActions: "swipeActions", side: "side" }, viewQueries: [{ propertyName: "itemSliding", first: true, predicate: IonItemSliding, descendants: true, static: true }], ngImport: i0, template: "<ion-item-sliding>\n <ng-content></ng-content>\n\n <ion-item-options *ngIf=\"_hasSwipeActions\" [side]=\"_side\">\n <ng-container *ngFor=\"let swipeAction of swipeActions\">\n <ion-item-option\n *ngIf=\"!swipeAction.isDisabled\"\n [ngClass]=\"swipeAction.type\"\n (click)=\"onSwipeActionClick(swipeAction)\"\n >\n <kirby-icon\n *ngIf=\"swipeAction.icon !== undefined\"\n [name]=\"swipeAction.icon\"\n slot=\"top\"\n ></kirby-icon>\n <ion-label>{{ swipeAction.title }}</ion-label>\n </ion-item-option>\n </ng-container>\n </ion-item-options>\n</ion-item-sliding>\n", styles: ["ion-item-option.primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}ion-item-option.secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}ion-item-option.tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}ion-item-option.success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}ion-item-option.warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}ion-item-option.danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}ion-item-option.white-overlay{background-color:var(--kirby-white-overlay);color:var(--kirby-white-overlay-contrast)}ion-item-option.light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}ion-item-option.medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}ion-item-option.dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}ion-item-option.dark-overlay{background-color:var(--kirby-dark-overlay);color:var(--kirby-dark-overlay-contrast)}:host{display:block}ion-item-option{min-width:92px}\n"], dependencies: [{ kind: "ngmodule", type: IconModule }, { kind: "component", type: i1.IconComponent, selector: "kirby-icon", inputs: ["size", "name", "customName"] }, { kind: "ngmodule", type: IonicModule }, { kind: "component", type: i2.IonItemOption, selector: "ion-item-option", inputs: ["color", "disabled", "download", "expandable", "href", "mode", "rel", "target", "type"] }, { kind: "component", type: i2.IonItemOptions, selector: "ion-item-options", inputs: ["side"] }, { kind: "component", type: i2.IonItemSliding, selector: "ion-item-sliding", inputs: ["disabled"] }, { kind: "component", type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
26
30
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ItemSlidingComponent, decorators: [{
|
|
27
31
|
type: Component,
|
|
28
|
-
args: [{ standalone: true, imports: [IconModule, IonicModule, CommonModule], selector: 'kirby-item-sliding', template: "<ion-item-sliding>\n <ng-content></ng-content>\n\n <ion-item-options *ngIf=\"_hasSwipeActions\" [side]=\"_side\">\n <ng-container *ngFor=\"let swipeAction of swipeActions\">\n <ion-item-option\n *ngIf=\"!swipeAction.isDisabled\"\n [ngClass]=\"swipeAction.type\"\n (click)=\"swipeAction
|
|
29
|
-
}], propDecorators: {
|
|
32
|
+
args: [{ standalone: true, imports: [IconModule, IonicModule, CommonModule], selector: 'kirby-item-sliding', template: "<ion-item-sliding>\n <ng-content></ng-content>\n\n <ion-item-options *ngIf=\"_hasSwipeActions\" [side]=\"_side\">\n <ng-container *ngFor=\"let swipeAction of swipeActions\">\n <ion-item-option\n *ngIf=\"!swipeAction.isDisabled\"\n [ngClass]=\"swipeAction.type\"\n (click)=\"onSwipeActionClick(swipeAction)\"\n >\n <kirby-icon\n *ngIf=\"swipeAction.icon !== undefined\"\n [name]=\"swipeAction.icon\"\n slot=\"top\"\n ></kirby-icon>\n <ion-label>{{ swipeAction.title }}</ion-label>\n </ion-item-option>\n </ng-container>\n </ion-item-options>\n</ion-item-sliding>\n", styles: ["ion-item-option.primary{background-color:var(--kirby-primary);color:var(--kirby-primary-contrast)}ion-item-option.secondary{background-color:var(--kirby-secondary);color:var(--kirby-secondary-contrast)}ion-item-option.tertiary{background-color:var(--kirby-tertiary);color:var(--kirby-tertiary-contrast)}ion-item-option.success{background-color:var(--kirby-success);color:var(--kirby-success-contrast)}ion-item-option.warning{background-color:var(--kirby-warning);color:var(--kirby-warning-contrast)}ion-item-option.danger{background-color:var(--kirby-danger);color:var(--kirby-danger-contrast)}ion-item-option.white-overlay{background-color:var(--kirby-white-overlay);color:var(--kirby-white-overlay-contrast)}ion-item-option.light{background-color:var(--kirby-light);color:var(--kirby-light-contrast)}ion-item-option.medium{background-color:var(--kirby-medium);color:var(--kirby-medium-contrast)}ion-item-option.dark{background-color:var(--kirby-dark);color:var(--kirby-dark-contrast)}ion-item-option.dark-overlay{background-color:var(--kirby-dark-overlay);color:var(--kirby-dark-overlay-contrast)}:host{display:block}ion-item-option{min-width:92px}\n"] }]
|
|
33
|
+
}], propDecorators: { itemSliding: [{
|
|
34
|
+
type: ViewChild,
|
|
35
|
+
args: [IonItemSliding, { static: true }]
|
|
36
|
+
}], swipeActions: [{
|
|
30
37
|
type: Input
|
|
31
38
|
}], side: [{
|
|
32
39
|
type: Input
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kirbydesign-designsystem-item-sliding.mjs","sources":["../../../../libs/designsystem/item-sliding/src/item-sliding.component.ts","../../../../libs/designsystem/item-sliding/src/item-sliding.component.html","../../../../libs/designsystem/item-sliding/src/kirbydesign-designsystem-item-sliding.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, Input } from '@angular/core';\nimport { IonicModule } from '@ionic/angular';\nimport { IconModule } from '@kirbydesign/designsystem/icon';\n\nimport { ItemSlidingSide, ItemSwipeAction } from './item-sliding.types';\n\n@Component({\n standalone: true,\n imports: [IconModule, IonicModule, CommonModule],\n selector: 'kirby-item-sliding',\n templateUrl: './item-sliding.component.html',\n styleUrls: ['./item-sliding.component.scss'],\n})\nexport class ItemSlidingComponent {\n @Input() swipeActions: ItemSwipeAction[];\n\n _side: 'start' | 'end' = 'start';\n @Input() set side(value: ItemSlidingSide) {\n this._side = value === 'left' ? 'start' : 'end';\n }\n\n get _hasSwipeActions(): boolean {\n // Using '>' instead of '!==';\n // will only return true when swipeActions is an array\n return this.swipeActions?.length > 0;\n }\n}\n","<ion-item-sliding>\n <ng-content></ng-content>\n\n <ion-item-options *ngIf=\"_hasSwipeActions\" [side]=\"_side\">\n <ng-container *ngFor=\"let swipeAction of swipeActions\">\n <ion-item-option\n *ngIf=\"!swipeAction.isDisabled\"\n [ngClass]=\"swipeAction.type\"\n (click)=\"swipeAction
|
|
1
|
+
{"version":3,"file":"kirbydesign-designsystem-item-sliding.mjs","sources":["../../../../libs/designsystem/item-sliding/src/item-sliding.component.ts","../../../../libs/designsystem/item-sliding/src/item-sliding.component.html","../../../../libs/designsystem/item-sliding/src/kirbydesign-designsystem-item-sliding.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, Input, ViewChild } from '@angular/core';\nimport { IonicModule, IonItemSliding } from '@ionic/angular';\nimport { IconModule } from '@kirbydesign/designsystem/icon';\n\nimport { ItemSlidingSide, ItemSwipeAction } from './item-sliding.types';\n\n@Component({\n standalone: true,\n imports: [IconModule, IonicModule, CommonModule],\n selector: 'kirby-item-sliding',\n templateUrl: './item-sliding.component.html',\n styleUrls: ['./item-sliding.component.scss'],\n})\nexport class ItemSlidingComponent {\n @ViewChild(IonItemSliding, { static: true }) itemSliding: IonItemSliding;\n @Input() swipeActions: ItemSwipeAction[];\n\n _side: 'start' | 'end' = 'start';\n @Input() set side(value: ItemSlidingSide) {\n this._side = value === 'left' ? 'start' : 'end';\n }\n\n get _hasSwipeActions(): boolean {\n // Using '>' instead of '!==';\n // will only return true when swipeActions is an array\n return this.swipeActions?.length > 0;\n }\n\n onSwipeActionClick(swipeAction: ItemSwipeAction): void {\n swipeAction.onSelected();\n this.itemSliding.close();\n }\n}\n","<ion-item-sliding>\n <ng-content></ng-content>\n\n <ion-item-options *ngIf=\"_hasSwipeActions\" [side]=\"_side\">\n <ng-container *ngFor=\"let swipeAction of swipeActions\">\n <ion-item-option\n *ngIf=\"!swipeAction.isDisabled\"\n [ngClass]=\"swipeAction.type\"\n (click)=\"onSwipeActionClick(swipeAction)\"\n >\n <kirby-icon\n *ngIf=\"swipeAction.icon !== undefined\"\n [name]=\"swipeAction.icon\"\n slot=\"top\"\n ></kirby-icon>\n <ion-label>{{ swipeAction.title }}</ion-label>\n </ion-item-option>\n </ng-container>\n </ion-item-options>\n</ion-item-sliding>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
|
@@ -16,6 +16,7 @@ var ItemSize;
|
|
|
16
16
|
class ItemComponent {
|
|
17
17
|
constructor() {
|
|
18
18
|
this.size = ItemSize.MD;
|
|
19
|
+
this.rotateIcon = false;
|
|
19
20
|
}
|
|
20
21
|
// Prevent default when inside kirby-dropdown to avoid blurring dropdown:
|
|
21
22
|
onMouseDown(event) {
|
|
@@ -26,10 +27,10 @@ class ItemComponent {
|
|
|
26
27
|
}
|
|
27
28
|
}
|
|
28
29
|
/** @nocollapse */ ItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
29
|
-
/** @nocollapse */ ItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ItemComponent, selector: "kirby-item", inputs: { disabled: "disabled", selected: "selected", disclosure: "disclosure", selectable: "selectable", reorderable: "reorderable", size: "size" }, host: { properties: { "class.disabled": "this.disabled", "class.selected": "this.selected", "class.disclosure": "this.disclosure", "class": "this.size" } }, ngImport: i0, template: "<ion-item\n lines=\"none\"\n [attr.disabled]=\"disabled\"\n [attr.button]=\"selectable ? true : null\"\n [attr.tabindex]=\"selectable ? null : 0\"\n detail=\"false\"\n (mousedown)=\"onMouseDown($event)\"\n>\n <div class=\"outside\" slot=\"start\">\n <ng-content select=\"[slot='outside']\"></ng-content>\n </div>\n <ng-content></ng-content>\n <ion-reorder slot=\"end\" *ngIf=\"reorderable\">\n <kirby-icon name=\"reorder\"></kirby-icon>\n </ion-reorder>\n\n <
|
|
30
|
+
/** @nocollapse */ ItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ItemComponent, selector: "kirby-item", inputs: { disabled: "disabled", selected: "selected", disclosure: "disclosure", selectable: "selectable", reorderable: "reorderable", size: "size", rotateIcon: "rotateIcon" }, host: { properties: { "class.disabled": "this.disabled", "class.selected": "this.selected", "class.disclosure": "this.disclosure", "class": "this.size" } }, ngImport: i0, template: "<ion-item\n lines=\"none\"\n [attr.disabled]=\"disabled\"\n [attr.button]=\"selectable ? true : null\"\n [attr.tabindex]=\"selectable ? null : 0\"\n detail=\"false\"\n (mousedown)=\"onMouseDown($event)\"\n>\n <div class=\"outside\" slot=\"start\">\n <ng-content select=\"[slot='outside']\"></ng-content>\n </div>\n <ng-content></ng-content>\n <ion-reorder slot=\"end\" *ngIf=\"reorderable\">\n <kirby-icon name=\"reorder\"></kirby-icon>\n </ion-reorder>\n\n <span class=\"disclosure\" slot=\"end\" *ngIf=\"disclosure\">\n <kirby-icon\n [class.rotate]=\"rotateIcon && (disclosure === 'arrow-down' || disclosure === 'arrow-up')\"\n name=\"{{ disclosure }}\"\n ></kirby-icon>\n </span>\n</ion-item>\n", styles: [":host{display:block;position:relative}:host ion-item{--padding-top: var(--item-padding-top, 0px);--padding-bottom: var(--item-padding-bottom, 0px);--min-height: 56px;--padding-start: 16px;--inner-padding-top: 8px;--inner-padding-bottom: 8px;--inner-padding-end: 16px;--background: var(--kirby-item-background, var(--kirby-white));--background-activated-opacity: .99;--background-focused: var( --kirby-item-background-focused, var(--kirby-background-color) );--background-focused-opacity: 1;font-size:16px;--transition: background-color 80ms linear 0ms}@media (hover: hover) and (pointer: fine){:host ion-item:focus-visible{box-shadow:none;--state-layer-opacity: .04;--state-layer-background-color: var(--kirby-black)}}@media (hover: hover){:host ion-item:hover{--state-layer-opacity: .04;--state-layer-background-color: var(--kirby-black);--background-hover: var(--state-layer-background-color);--background-hover-opacity: var(--state-layer-opacity)}}:host ion-item:active,:host ion-item.ion-activated{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);--background-activated: var(--state-layer-background-color);--background-activated-opacity: var(--state-layer-opacity)}@media screen and (orientation: landscape){:host ion-item{--ion-safe-area-left: 0px;--ion-safe-area-right: 0px}}:host ion-item ::ng-deep>[slot=end]{margin-inline-start:0;margin-inline-end:0;text-align:right}:host ion-item ::ng-deep>time[slot=end]{margin-inline-start:12px}:host ion-item ::ng-deep>data[slot=end],:host ion-item ::ng-deep>[detail][slot=end],:host ion-item ::ng-deep>ion-reorder[slot=end]{margin-inline-start:16px}:host ion-item ::ng-deep>h1,:host ion-item ::ng-deep>h2,:host ion-item ::ng-deep>h3,:host ion-item ::ng-deep>h4,:host ion-item ::ng-deep>h5,:host ion-item ::ng-deep>h6,:host ion-item ::ng-deep>p,:host ion-item ::ng-deep>data{font-size:16px;line-height:24px;color:var(--kirby-text-color-black);display:block;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:400}:host ion-item ::ng-deep>h1.kirby-text-bold,:host ion-item ::ng-deep>h2.kirby-text-bold,:host ion-item ::ng-deep>h3.kirby-text-bold,:host ion-item ::ng-deep>h4.kirby-text-bold,:host ion-item ::ng-deep>h5.kirby-text-bold,:host ion-item ::ng-deep>h6.kirby-text-bold,:host ion-item ::ng-deep>p.kirby-text-bold,:host ion-item ::ng-deep>data.kirby-text-bold{font-weight:700}:host ion-item ::ng-deep>p{font-size:14px}:host ion-item ::ng-deep>[subtitle],:host ion-item ::ng-deep>[detail]{font-size:12px;line-height:16px}:host ion-item ::ng-deep>[subtitle]:not(:last-child){margin-bottom:4px}:host ion-item ::ng-deep>[detail]{color:var(--kirby-text-color-semi-dark)}:host ion-item ::ng-deep>:not([slot]){width:100%}:host ion-item ::ng-deep>input[slot=end],:host ion-item ::ng-deep>kirby-form-field[slot=end] input{margin-inline-start:16px;width:auto;text-align:right}:host.sm ion-item,:host-context(kirby-card.menu-popover) :host:not([size]) ion-item{--min-height: 44px}:host.xs ion-item{--min-height: 32px;--inner-padding-top: 4px;--inner-padding-bottom: 4px}:host .outside{left:4px;margin:0;position:absolute;width:16px;z-index:1}.disclosure{padding-left:4px;color:var(--kirby-semi-dark);display:inline-flex;justify-content:center;align-items:center}.disclosure kirby-icon{transition:transform .2s}.disclosure kirby-icon.rotate{transform:rotate(180deg)}:host-context(kirby-dropdown) ion-item,:host-context(kirby-popover) ion-item{--min-height: 44px}:host-context(kirby-dropdown .focused) ion-item,:host-context(kirby-popover .focused) ion-item{--background: whitesmoke}:host(.disabled),:host([disabled]){pointer-events:none}:host(.selected) ion-item ::ng-deep>h1,:host(.selected) ion-item ::ng-deep>h2,:host(.selected) ion-item ::ng-deep>h3,:host(.selected) ion-item ::ng-deep>h4,:host(.selected) ion-item ::ng-deep>h5,:host(.selected) ion-item ::ng-deep>h6,:host(.selected) ion-item ::ng-deep>p,:host(.selected) ion-item ::ng-deep>data,:host-context(kirby-list .selected) ion-item ::ng-deep>h1,:host-context(kirby-list .selected) ion-item ::ng-deep>h2,:host-context(kirby-list .selected) ion-item ::ng-deep>h3,:host-context(kirby-list .selected) ion-item ::ng-deep>h4,:host-context(kirby-list .selected) ion-item ::ng-deep>h5,:host-context(kirby-list .selected) ion-item ::ng-deep>h6,:host-context(kirby-list .selected) ion-item ::ng-deep>p,:host-context(kirby-list .selected) ion-item ::ng-deep>data{font-weight:700}:host(.disclosure) ion-item{--inner-padding-end: 8px}:host-context(.shape-rounded .is-single) ion-item{--border-radius: 16px}:host-context(.has-header .is-single) ion-item::part(native){border-top-left-radius:0;border-top-right-radius:0}:host-context(.has-footer .is-single) ion-item::part(native){border-bottom-left-radius:0;border-bottom-right-radius:0}:host-context(.shape-rounded.has-sections .list-items kirby-list-item:first-of-type) ion-item::part(native){border-top-left-radius:16px;border-top-right-radius:16px}\n"], dependencies: [{ kind: "component", type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i1.IonReorder, selector: "ion-reorder" }, { kind: "component", type: i2.IconComponent, selector: "kirby-icon", inputs: ["size", "name", "customName"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
30
31
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ItemComponent, decorators: [{
|
|
31
32
|
type: Component,
|
|
32
|
-
args: [{ selector: 'kirby-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-item\n lines=\"none\"\n [attr.disabled]=\"disabled\"\n [attr.button]=\"selectable ? true : null\"\n [attr.tabindex]=\"selectable ? null : 0\"\n detail=\"false\"\n (mousedown)=\"onMouseDown($event)\"\n>\n <div class=\"outside\" slot=\"start\">\n <ng-content select=\"[slot='outside']\"></ng-content>\n </div>\n <ng-content></ng-content>\n <ion-reorder slot=\"end\" *ngIf=\"reorderable\">\n <kirby-icon name=\"reorder\"></kirby-icon>\n </ion-reorder>\n\n <
|
|
33
|
+
args: [{ selector: 'kirby-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-item\n lines=\"none\"\n [attr.disabled]=\"disabled\"\n [attr.button]=\"selectable ? true : null\"\n [attr.tabindex]=\"selectable ? null : 0\"\n detail=\"false\"\n (mousedown)=\"onMouseDown($event)\"\n>\n <div class=\"outside\" slot=\"start\">\n <ng-content select=\"[slot='outside']\"></ng-content>\n </div>\n <ng-content></ng-content>\n <ion-reorder slot=\"end\" *ngIf=\"reorderable\">\n <kirby-icon name=\"reorder\"></kirby-icon>\n </ion-reorder>\n\n <span class=\"disclosure\" slot=\"end\" *ngIf=\"disclosure\">\n <kirby-icon\n [class.rotate]=\"rotateIcon && (disclosure === 'arrow-down' || disclosure === 'arrow-up')\"\n name=\"{{ disclosure }}\"\n ></kirby-icon>\n </span>\n</ion-item>\n", styles: [":host{display:block;position:relative}:host ion-item{--padding-top: var(--item-padding-top, 0px);--padding-bottom: var(--item-padding-bottom, 0px);--min-height: 56px;--padding-start: 16px;--inner-padding-top: 8px;--inner-padding-bottom: 8px;--inner-padding-end: 16px;--background: var(--kirby-item-background, var(--kirby-white));--background-activated-opacity: .99;--background-focused: var( --kirby-item-background-focused, var(--kirby-background-color) );--background-focused-opacity: 1;font-size:16px;--transition: background-color 80ms linear 0ms}@media (hover: hover) and (pointer: fine){:host ion-item:focus-visible{box-shadow:none;--state-layer-opacity: .04;--state-layer-background-color: var(--kirby-black)}}@media (hover: hover){:host ion-item:hover{--state-layer-opacity: .04;--state-layer-background-color: var(--kirby-black);--background-hover: var(--state-layer-background-color);--background-hover-opacity: var(--state-layer-opacity)}}:host ion-item:active,:host ion-item.ion-activated{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);--background-activated: var(--state-layer-background-color);--background-activated-opacity: var(--state-layer-opacity)}@media screen and (orientation: landscape){:host ion-item{--ion-safe-area-left: 0px;--ion-safe-area-right: 0px}}:host ion-item ::ng-deep>[slot=end]{margin-inline-start:0;margin-inline-end:0;text-align:right}:host ion-item ::ng-deep>time[slot=end]{margin-inline-start:12px}:host ion-item ::ng-deep>data[slot=end],:host ion-item ::ng-deep>[detail][slot=end],:host ion-item ::ng-deep>ion-reorder[slot=end]{margin-inline-start:16px}:host ion-item ::ng-deep>h1,:host ion-item ::ng-deep>h2,:host ion-item ::ng-deep>h3,:host ion-item ::ng-deep>h4,:host ion-item ::ng-deep>h5,:host ion-item ::ng-deep>h6,:host ion-item ::ng-deep>p,:host ion-item ::ng-deep>data{font-size:16px;line-height:24px;color:var(--kirby-text-color-black);display:block;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:400}:host ion-item ::ng-deep>h1.kirby-text-bold,:host ion-item ::ng-deep>h2.kirby-text-bold,:host ion-item ::ng-deep>h3.kirby-text-bold,:host ion-item ::ng-deep>h4.kirby-text-bold,:host ion-item ::ng-deep>h5.kirby-text-bold,:host ion-item ::ng-deep>h6.kirby-text-bold,:host ion-item ::ng-deep>p.kirby-text-bold,:host ion-item ::ng-deep>data.kirby-text-bold{font-weight:700}:host ion-item ::ng-deep>p{font-size:14px}:host ion-item ::ng-deep>[subtitle],:host ion-item ::ng-deep>[detail]{font-size:12px;line-height:16px}:host ion-item ::ng-deep>[subtitle]:not(:last-child){margin-bottom:4px}:host ion-item ::ng-deep>[detail]{color:var(--kirby-text-color-semi-dark)}:host ion-item ::ng-deep>:not([slot]){width:100%}:host ion-item ::ng-deep>input[slot=end],:host ion-item ::ng-deep>kirby-form-field[slot=end] input{margin-inline-start:16px;width:auto;text-align:right}:host.sm ion-item,:host-context(kirby-card.menu-popover) :host:not([size]) ion-item{--min-height: 44px}:host.xs ion-item{--min-height: 32px;--inner-padding-top: 4px;--inner-padding-bottom: 4px}:host .outside{left:4px;margin:0;position:absolute;width:16px;z-index:1}.disclosure{padding-left:4px;color:var(--kirby-semi-dark);display:inline-flex;justify-content:center;align-items:center}.disclosure kirby-icon{transition:transform .2s}.disclosure kirby-icon.rotate{transform:rotate(180deg)}:host-context(kirby-dropdown) ion-item,:host-context(kirby-popover) ion-item{--min-height: 44px}:host-context(kirby-dropdown .focused) ion-item,:host-context(kirby-popover .focused) ion-item{--background: whitesmoke}:host(.disabled),:host([disabled]){pointer-events:none}:host(.selected) ion-item ::ng-deep>h1,:host(.selected) ion-item ::ng-deep>h2,:host(.selected) ion-item ::ng-deep>h3,:host(.selected) ion-item ::ng-deep>h4,:host(.selected) ion-item ::ng-deep>h5,:host(.selected) ion-item ::ng-deep>h6,:host(.selected) ion-item ::ng-deep>p,:host(.selected) ion-item ::ng-deep>data,:host-context(kirby-list .selected) ion-item ::ng-deep>h1,:host-context(kirby-list .selected) ion-item ::ng-deep>h2,:host-context(kirby-list .selected) ion-item ::ng-deep>h3,:host-context(kirby-list .selected) ion-item ::ng-deep>h4,:host-context(kirby-list .selected) ion-item ::ng-deep>h5,:host-context(kirby-list .selected) ion-item ::ng-deep>h6,:host-context(kirby-list .selected) ion-item ::ng-deep>p,:host-context(kirby-list .selected) ion-item ::ng-deep>data{font-weight:700}:host(.disclosure) ion-item{--inner-padding-end: 8px}:host-context(.shape-rounded .is-single) ion-item{--border-radius: 16px}:host-context(.has-header .is-single) ion-item::part(native){border-top-left-radius:0;border-top-right-radius:0}:host-context(.has-footer .is-single) ion-item::part(native){border-bottom-left-radius:0;border-bottom-right-radius:0}:host-context(.shape-rounded.has-sections .list-items kirby-list-item:first-of-type) ion-item::part(native){border-top-left-radius:16px;border-top-right-radius:16px}\n"] }]
|
|
33
34
|
}], propDecorators: { disabled: [{
|
|
34
35
|
type: HostBinding,
|
|
35
36
|
args: ['class.disabled']
|
|
@@ -54,6 +55,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
|
|
|
54
55
|
args: ['class']
|
|
55
56
|
}, {
|
|
56
57
|
type: Input
|
|
58
|
+
}], rotateIcon: [{
|
|
59
|
+
type: Input
|
|
57
60
|
}] } });
|
|
58
61
|
|
|
59
62
|
class LabelComponent {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kirbydesign-designsystem-item.mjs","sources":["../../../../libs/designsystem/item/src/item.component.ts","../../../../libs/designsystem/item/src/item.component.html","../../../../libs/designsystem/item/src/label/label.component.ts","../../../../libs/designsystem/item/src/label/label.component.html","../../../../libs/designsystem/item/src/item.module.ts","../../../../libs/designsystem/item/src/kirbydesign-designsystem-item.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core';\n\nexport enum ItemSize {\n XS = 'xs',\n SM = 'sm',\n MD = 'md',\n}\n\n@Component({\n selector: 'kirby-item',\n templateUrl: './item.component.html',\n styleUrls: ['./item.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ItemComponent {\n @HostBinding('class.disabled')\n @Input()\n disabled: boolean;\n @HostBinding('class.selected')\n @Input()\n selected: boolean;\n @HostBinding('class.disclosure')\n @Input()\n disclosure: 'link' | 'arrow-more' | 'arrow-down' | 'arrow-up' | null;\n @Input() selectable: boolean;\n\n @Input()\n reorderable: boolean;\n @HostBinding('class')\n @Input()\n size: ItemSize | `${ItemSize}` = ItemSize.MD;\n\n // Prevent default when inside kirby-dropdown to avoid blurring dropdown:\n onMouseDown(event: MouseEvent) {\n if (\n event.currentTarget instanceof HTMLElement &&\n event.currentTarget.closest('kirby-dropdown')\n ) {\n event.preventDefault();\n }\n }\n}\n","<ion-item\n lines=\"none\"\n [attr.disabled]=\"disabled\"\n [attr.button]=\"selectable ? true : null\"\n [attr.tabindex]=\"selectable ? null : 0\"\n detail=\"false\"\n (mousedown)=\"onMouseDown($event)\"\n>\n <div class=\"outside\" slot=\"start\">\n <ng-content select=\"[slot='outside']\"></ng-content>\n </div>\n <ng-content></ng-content>\n <ion-reorder slot=\"end\" *ngIf=\"reorderable\">\n <kirby-icon name=\"reorder\"></kirby-icon>\n </ion-reorder>\n\n <
|
|
1
|
+
{"version":3,"file":"kirbydesign-designsystem-item.mjs","sources":["../../../../libs/designsystem/item/src/item.component.ts","../../../../libs/designsystem/item/src/item.component.html","../../../../libs/designsystem/item/src/label/label.component.ts","../../../../libs/designsystem/item/src/label/label.component.html","../../../../libs/designsystem/item/src/item.module.ts","../../../../libs/designsystem/item/src/kirbydesign-designsystem-item.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core';\n\nexport enum ItemSize {\n XS = 'xs',\n SM = 'sm',\n MD = 'md',\n}\n\n@Component({\n selector: 'kirby-item',\n templateUrl: './item.component.html',\n styleUrls: ['./item.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ItemComponent {\n @HostBinding('class.disabled')\n @Input()\n disabled: boolean;\n @HostBinding('class.selected')\n @Input()\n selected: boolean;\n @HostBinding('class.disclosure')\n @Input()\n disclosure: 'link' | 'arrow-more' | 'arrow-down' | 'arrow-up' | null;\n @Input() selectable: boolean;\n\n @Input()\n reorderable: boolean;\n @HostBinding('class')\n @Input()\n size: ItemSize | `${ItemSize}` = ItemSize.MD;\n\n @Input() rotateIcon: boolean = false;\n\n // Prevent default when inside kirby-dropdown to avoid blurring dropdown:\n onMouseDown(event: MouseEvent) {\n if (\n event.currentTarget instanceof HTMLElement &&\n event.currentTarget.closest('kirby-dropdown')\n ) {\n event.preventDefault();\n }\n }\n}\n","<ion-item\n lines=\"none\"\n [attr.disabled]=\"disabled\"\n [attr.button]=\"selectable ? true : null\"\n [attr.tabindex]=\"selectable ? null : 0\"\n detail=\"false\"\n (mousedown)=\"onMouseDown($event)\"\n>\n <div class=\"outside\" slot=\"start\">\n <ng-content select=\"[slot='outside']\"></ng-content>\n </div>\n <ng-content></ng-content>\n <ion-reorder slot=\"end\" *ngIf=\"reorderable\">\n <kirby-icon name=\"reorder\"></kirby-icon>\n </ion-reorder>\n\n <span class=\"disclosure\" slot=\"end\" *ngIf=\"disclosure\">\n <kirby-icon\n [class.rotate]=\"rotateIcon && (disclosure === 'arrow-down' || disclosure === 'arrow-up')\"\n name=\"{{ disclosure }}\"\n ></kirby-icon>\n </span>\n</ion-item>\n","import { Component, HostBinding, Input } from '@angular/core';\n\n@Component({\n selector: 'kirby-label',\n templateUrl: './label.component.html',\n styleUrls: ['./label.component.scss'],\n})\nexport class LabelComponent {\n @Input()\n direction: 'vertical' | 'horizontal' = 'vertical';\n\n @HostBinding('class.horizontal')\n get _direction() {\n return this.direction === 'horizontal';\n }\n}\n","<ion-label>\n <ng-content></ng-content>\n</ion-label>\n","import { NgModule } from '@angular/core';\nimport { IonicModule } from '@ionic/angular';\nimport { CommonModule } from '@angular/common';\n\nimport { IconModule } from '@kirbydesign/designsystem/icon';\nimport { ItemComponent } from './item.component';\nimport { LabelComponent } from './label/label.component';\n\nconst declarations = [ItemComponent, LabelComponent];\n@NgModule({\n imports: [IonicModule, IconModule, CommonModule],\n declarations: [...declarations],\n exports: [...declarations],\n})\nexport class ItemModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
|
@@ -633,10 +633,10 @@ class PageComponent {
|
|
|
633
633
|
}
|
|
634
634
|
}
|
|
635
635
|
/** @nocollapse */ PageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PageComponent, deps: [{ token: i0.ElementRef }, { token: i0.Injector }, { token: i0.Renderer2 }, { token: i2.Router }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i1.ModalNavigationService }, { token: i3.ResizeObserverService }, { token: i4.TabsComponent, optional: true, skipSelf: true }, { token: PAGE_BACK_BUTTON_OVERRIDE, optional: true }, { token: i5.IonRouterOutlet, optional: true }, { token: i5.NavController, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
636
|
-
/** @nocollapse */ PageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: PageComponent, selector: "kirby-page", inputs: { title: "title", subtitle: "subtitle", toolbarTitle: "toolbarTitle", titleAlignment: "titleAlignment", defaultBackHref: "defaultBackHref", hideBackButton: "hideBackButton", titleMaxLines: "titleMaxLines", maxWidth: "maxWidth", hasInteractiveTitle: "hasInteractiveTitle", tabBarBottomHidden: "tabBarBottomHidden" }, outputs: { enter: "enter", leave: "leave", refresh: "refresh", backButtonClick: "backButtonClick", toolbarTitleClick: "toolbarTitleClick" }, host: { listeners: { "window:keyboardWillShow": "_onKeyboardWillShow($event)", "window:keyboardWillHide": "_onKeyboardWillHide()", "window:kirbySelectedTabClick": "_onSelectedTabClick()" } }, queries: [{ propertyName: "customToolbarTitleTemplate", first: true, predicate: PageToolbarTitleDirective, descendants: true, read: TemplateRef }, { propertyName: "customTitleTemplate", first: true, predicate: PageTitleDirective, descendants: true, read: TemplateRef }, { propertyName: "customSubtitleTemplate", first: true, predicate: PageSubtitleDirective, descendants: true, read: TemplateRef }, { propertyName: "stickyContentRef", first: true, predicate: PageStickyContentDirective, descendants: true, read: TemplateRef }, { propertyName: "header", first: true, predicate: HeaderComponent, descendants: true }, { propertyName: "customActions", predicate: PageActionsDirective }, { propertyName: "customContent", predicate: PageContentDirective }], viewQueries: [{ propertyName: "content", first: true, predicate: IonContent, descendants: true, static: true }, { propertyName: "ionContentElement", first: true, predicate: IonContent, descendants: true, read: ElementRef, static: true }, { propertyName: "ionHeaderElement", first: true, predicate: IonHeader, descendants: true, read: ElementRef, static: true }, { propertyName: "ionFooterElement", first: true, predicate: IonFooter, descendants: true, read: ElementRef, static: true }, { propertyName: "ionToolbarElement", first: true, predicate: IonToolbar, descendants: true, read: ElementRef, static: true }, { propertyName: "backButtonDelegate", first: true, predicate: IonBackButtonDelegate, descendants: true }, { propertyName: "pageTitle", first: true, predicate: ["pageTitle"], descendants: true, read: ElementRef }, { propertyName: "stickyContentContainer", first: true, predicate: ["stickyContentContainer"], descendants: true, read: ElementRef }, { propertyName: "simpleTitleTemplate", first: true, predicate: ["simpleTitleTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "simpleToolbarTitleTemplate", first: true, predicate: ["simpleToolbarTitleTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "ionToolbarButtonsElement", predicate: IonButtons, descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<ion-header>\n <ion-toolbar\n [class.content-scrolled]=\"isContentScrolled\"\n [class.content-pinned]=\"isStickyContentPinned\"\n >\n <ion-buttons slot=\"start\">\n <ion-back-button\n text=\"\"\n [defaultHref]=\"defaultBackHref\"\n icon=\"assets/kirby/icons/svg/arrow-back.svg\"\n [style.visibility]=\"hideBackButton ? 'hidden' : null\"\n ></ion-back-button>\n </ion-buttons>\n <ion-title [class.slide-and-fade-in]=\"toolbarTitleVisible\">\n <div class=\"toolbar-title\">\n <span\n [class.clickable]=\"hasInteractiveTitle\"\n [class.has-icon]=\"!!titleActionIconTemplate\"\n (click)=\"onTitleClick($event)\"\n >\n <ng-container *ngTemplateOutlet=\"toolbarTitleTemplate\"></ng-container>\n <ng-container *ngTemplateOutlet=\"titleActionIconTemplate\"></ng-container>\n </span>\n </div>\n </ion-title>\n <ion-buttons\n *ngIf=\"!!headerActionsTemplate\"\n class=\"hide\"\n slot=\"primary\"\n [class.fade-in]=\"toolbarActionsVisible\"\n >\n <ng-container\n *ngTemplateOutlet=\"headerActionsTemplate; injector: toolbarActionGroupInjector\"\n ></ng-container>\n </ion-buttons>\n <ion-buttons *ngIf=\"!!stickyActionsTemplate\" class=\"legacy-actions\" slot=\"primary\">\n <ng-container *ngTemplateOutlet=\"stickyActionsTemplate\"></ng-container>\n </ion-buttons>\n <ion-buttons *ngIf=\"!!fixedActionsTemplate\" class=\"legacy-actions\" slot=\"secondary\">\n <ng-container *ngTemplateOutlet=\"fixedActionsTemplate\"></ng-container>\n </ion-buttons>\n </ion-toolbar>\n</ion-header>\n\n<ion-content\n scrollEvents=\"true\"\n forceOverscroll=\"false\"\n [class]=\"getMaxWidthClasses()\"\n [class.has-header]=\"hasHeader\"\n>\n <ion-refresher\n *ngIf=\"refresh.observers.length > 0\"\n (ionRefresh)=\"delegateRefreshEvent($event)\"\n slot=\"fixed\"\n >\n <kirby-spinner></kirby-spinner>\n </ion-refresher>\n\n <!-- Page header -->\n <div class=\"page-header-container\" *ngIf=\"hasPageTitle && !hasHeader\">\n <div\n class=\"page-header\"\n [ngClass]=\"{\n 'text-center': titleAlignment === 'center',\n 'text-right': titleAlignment === 'right'\n }\"\n >\n <div #pageTitle class=\"page-title\" [class.has-actions]=\"!!pageActionsTemplate\">\n <ng-container\n *ngTemplateOutlet=\"customTitleTemplate || defaultPageTitleTemplate\"\n ></ng-container>\n <ng-container\n *ngTemplateOutlet=\"pageActionsTemplate || defaultPageActionsTemplate\"\n ></ng-container>\n </div>\n <div *ngIf=\"hasPageSubtitle\" class=\"page-subtitle\">\n <ng-container\n *ngTemplateOutlet=\"customSubtitleTemplate || defaultPageSubtitleTemplate\"\n ></ng-container>\n </div>\n </div>\n </div>\n\n <!-- Header -->\n <div class=\"page-header-container\" *ngIf=\"hasHeader\">\n <ng-content select=\"kirby-header\"></ng-content>\n </div>\n\n <!-- Sticky content -->\n <ng-container *ngIf=\"stickyContentTemplate\">\n <div\n #stickyContentContainer\n class=\"sticky-content-container\"\n [class.content-pinned]=\"isStickyContentPinned\"\n >\n <div>\n <ng-container *ngTemplateOutlet=\"stickyContentTemplate\"></ng-container>\n </div>\n </div>\n </ng-container>\n\n <!-- Content -->\n <div class=\"content-inner\">\n <ng-container\n *ngTemplateOutlet=\"customContentTemplate || defaultContentTemplate\"\n ></ng-container>\n </div>\n\n <div slot=\"fixed\" class=\"fixed-content\" *ngIf=\"fixedContentTemplate\">\n <div class=\"content-inner\">\n <ng-container *ngTemplateOutlet=\"fixedContentTemplate\"></ng-container>\n </div>\n </div>\n</ion-content>\n\n<ion-footer>\n <ng-content select=\"kirby-page-footer\"></ng-content>\n</ion-footer>\n\n<ng-template #defaultPageTitleTemplate>\n <h1 [kirbyFitHeading]=\"fitHeadingConfig\">\n <ng-container *ngTemplateOutlet=\"simpleTitleTemplate\"></ng-container>\n </h1>\n</ng-template>\n<ng-template #defaultPageSubtitleTemplate>\n <ng-container *ngTemplateOutlet=\"simpleSubtitleTemplate\"></ng-container>\n</ng-template>\n<ng-template #defaultPageActionsTemplate>\n <ng-content select=\"kirby-page-actions\"></ng-content>\n</ng-template>\n\n<ng-template #defaultContentTemplate>\n <ng-content select=\"kirby-page-content\"></ng-content>\n</ng-template>\n\n<ng-template #simpleTitleTemplate>{{ title }}</ng-template>\n<ng-template #simpleSubtitleTemplate>{{ subtitle }}</ng-template>\n<ng-template #simpleToolbarTitleTemplate>{{ toolbarTitle }}</ng-template>\n", styles: ["ion-header,ion-toolbar{--background: var(--kirby-background-color);margin:0 auto}ion-toolbar{--border-width: 0 !important;--padding-start: 16px;--padding-end: 16px;--padding-top: 0;--padding-bottom: 0;--ion-toolbar-color: var(--kirby-black);--min-height: 56px}@media (min-width: 768px){ion-toolbar{--padding-start: 24px;--padding-end: 24px;--min-height: 72px}}ion-toolbar:before{content:\"\";position:absolute;left:0;right:0;bottom:0;height:1px}ion-toolbar:before,ion-toolbar::part(background){transition:background-color 50ms linear}ion-toolbar.content-scrolled{--background: #f3f3f3}ion-toolbar.content-scrolled:before,ion-toolbar.content-scrolled::part(background){transition-duration:.2s}ion-toolbar.content-scrolled:not(.content-pinned):before{background-color:var(--kirby-medium)}ion-toolbar.content-pinned:before{transition:none}ion-toolbar ion-buttons[slot=start]{margin-right:8px}ion-toolbar ion-buttons[slot=primary],ion-toolbar ion-buttons[slot=secondary]{margin-left:8px}ion-toolbar ion-buttons[slot=secondary]{order:6}ion-toolbar ion-title{visibility:hidden;opacity:0;transform:translateY(10px);transition-property:opacity,transform;transition-duration:.15s;transition-timing-function:ease;padding-inline:calc(var(--action-buttons-width, 48px) + var(--padding-start))}ion-toolbar ion-title.slide-and-fade-in{visibility:visible;opacity:1;transform:translateY(0)}ion-toolbar ion-title .toolbar-title{text-overflow:ellipsis;white-space:nowrap;pointer-events:auto;overflow:hidden;font-weight:700}ion-toolbar ion-title .toolbar-title span.clickable{cursor:pointer}ion-toolbar ion-title .toolbar-title span.has-icon{display:inline-flex;flex-direction:row;align-items:center;justify-content:center}ion-toolbar ion-title .toolbar-title ::ng-deep>*{text-overflow:ellipsis;white-space:nowrap;pointer-events:auto;overflow:hidden}.hide{visibility:hidden;opacity:0;transition:opacity .1s linear}.hide.fade-in{visibility:inherit;opacity:1}ion-title{box-sizing:border-box;font-size:16px;font-weight:400}ion-back-button{--color: var(--kirby-black);--background: var(--kirby-white);--icon-font-size: 24px;height:40px;width:40px;opacity:1}@media (hover: hover){ion-back-button:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);--background-hover: var(--state-layer-background-color);--background-hover-opacity: var(--state-layer-opacity)}}ion-back-button:active,ion-back-button.ion-activated{--state-layer-opacity: .16;--state-layer-background-color: var(--kirby-black);--background-activated: var(--state-layer-background-color);--background-activated-opacity: var(--state-layer-opacity)}ion-back-button::part(icon){margin-inline:0}ion-back-button::part(native){opacity:1;border-radius:999px;overflow:hidden}ion-back-button::part(native):after{transition:all 80ms linear 0ms}.page-header-container{max-width:var(--page-content-max-width, 720px);margin:0 auto}.page-header{margin-left:16px;margin-top:8px;margin-bottom:var(--kirby-page-title-margin-bottom, 40px)}.page-header .page-title.has-actions{display:flex;justify-content:space-between;align-items:flex-start}.page-header .page-title h1,.page-header .page-title h2,.page-header .page-title h3,.page-header .page-title h4,.page-header .page-title h5,.page-header .page-title h6{margin:0}.page-header .page-subtitle{margin-top:8px}.page-header.text-center{text-align:center;margin-left:0}.page-header.text-right{text-align:right}ion-content{--padding-top: 12px;--padding-start: var(--page-content-padding-start, 16px);--padding-end: var(--page-content-padding-end, 16px);--background: var(--kirby-background-color);--color: var(--kirby-black)}@media (min-width: 632px){ion-content{--padding-start: var(--page-content-padding-start, 48px);--padding-end: var(--page-content-padding-end, 48px)}}ion-content.has-header{--padding-top: 0}ion-content.max-width-standard{--page-content-max-width: 792px}ion-content.max-width-optimized{--page-content-max-width: 1092px}ion-content.max-width-full{--page-content-max-width: 100%}ion-content .content-inner{max-width:var(--page-content-max-width, 720px);margin:0 auto;padding-bottom:40px}ion-content .fixed-content{width:100%;position:absolute;bottom:0;transform:initial}ion-content .fixed-content .content-inner{position:relative}.sticky-content-container{position:sticky;top:-13px;left:0;right:0;padding-top:1px;margin-block-end:24px;z-index:10}.sticky-content-container div{max-width:var(--page-content-max-width, 720px);margin:0 auto}.sticky-content-container:before,.sticky-content-container:after{content:\"\";position:absolute;left:calc(-1 * var(--padding-start));right:calc(-1 * var(--padding-end));bottom:0}.sticky-content-container:before{top:0;background-color:var(--background)}.sticky-content-container:after{height:1px}.sticky-content-container.content-pinned:before{background-color:#f3f3f3}.sticky-content-container.content-pinned:after{background-color:var(--kirby-medium)}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.IonBackButton, selector: "ion-back-button", inputs: ["color", "defaultHref", "disabled", "icon", "mode", "routerAnimation", "text", "type"] }, { kind: "component", type: i5.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i5.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i5.IonFooter, selector: "ion-footer", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i5.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i5.IonRefresher, selector: "ion-refresher", inputs: ["closeDuration", "disabled", "pullFactor", "pullMax", "pullMin", "snapbackDuration"] }, { kind: "component", type: i5.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: i5.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "directive", type: i5.IonBackButtonDelegate, selector: "ion-back-button", inputs: ["defaultHref", "routerAnimation"] }, { kind: "directive", type: i3.FitHeadingDirective, selector: "h1[kirbyFitHeading],h2[kirbyFitHeading],h3[kirbyFitHeading]", inputs: ["kirbyFitHeading"] }, { kind: "component", type: i7.SpinnerComponent, selector: "kirby-spinner" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
636
|
+
/** @nocollapse */ PageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: PageComponent, selector: "kirby-page", inputs: { title: "title", subtitle: "subtitle", toolbarTitle: "toolbarTitle", titleAlignment: "titleAlignment", defaultBackHref: "defaultBackHref", hideBackButton: "hideBackButton", titleMaxLines: "titleMaxLines", maxWidth: "maxWidth", hasInteractiveTitle: "hasInteractiveTitle", tabBarBottomHidden: "tabBarBottomHidden" }, outputs: { enter: "enter", leave: "leave", refresh: "refresh", backButtonClick: "backButtonClick", toolbarTitleClick: "toolbarTitleClick" }, host: { listeners: { "window:keyboardWillShow": "_onKeyboardWillShow($event)", "window:keyboardWillHide": "_onKeyboardWillHide()", "window:kirbySelectedTabClick": "_onSelectedTabClick()" } }, queries: [{ propertyName: "customToolbarTitleTemplate", first: true, predicate: PageToolbarTitleDirective, descendants: true, read: TemplateRef }, { propertyName: "customTitleTemplate", first: true, predicate: PageTitleDirective, descendants: true, read: TemplateRef }, { propertyName: "customSubtitleTemplate", first: true, predicate: PageSubtitleDirective, descendants: true, read: TemplateRef }, { propertyName: "stickyContentRef", first: true, predicate: PageStickyContentDirective, descendants: true, read: TemplateRef }, { propertyName: "header", first: true, predicate: HeaderComponent, descendants: true }, { propertyName: "customActions", predicate: PageActionsDirective }, { propertyName: "customContent", predicate: PageContentDirective }], viewQueries: [{ propertyName: "content", first: true, predicate: IonContent, descendants: true, static: true }, { propertyName: "ionContentElement", first: true, predicate: IonContent, descendants: true, read: ElementRef, static: true }, { propertyName: "ionHeaderElement", first: true, predicate: IonHeader, descendants: true, read: ElementRef, static: true }, { propertyName: "ionFooterElement", first: true, predicate: IonFooter, descendants: true, read: ElementRef, static: true }, { propertyName: "ionToolbarElement", first: true, predicate: IonToolbar, descendants: true, read: ElementRef, static: true }, { propertyName: "backButtonDelegate", first: true, predicate: IonBackButtonDelegate, descendants: true }, { propertyName: "pageTitle", first: true, predicate: ["pageTitle"], descendants: true, read: ElementRef }, { propertyName: "stickyContentContainer", first: true, predicate: ["stickyContentContainer"], descendants: true, read: ElementRef }, { propertyName: "simpleTitleTemplate", first: true, predicate: ["simpleTitleTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "simpleToolbarTitleTemplate", first: true, predicate: ["simpleToolbarTitleTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "ionToolbarButtonsElement", predicate: IonButtons, descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<ion-header>\n <ion-toolbar\n [class.content-scrolled]=\"isContentScrolled\"\n [class.content-pinned]=\"isStickyContentPinned\"\n >\n <ion-buttons slot=\"start\">\n <ion-back-button\n text=\"\"\n [defaultHref]=\"defaultBackHref\"\n icon=\"assets/kirby/icons/svg/arrow-back.svg\"\n [style.visibility]=\"hideBackButton ? 'hidden' : null\"\n ></ion-back-button>\n </ion-buttons>\n <ion-title [class.slide-and-fade-in]=\"toolbarTitleVisible\">\n <div class=\"toolbar-title\">\n <ng-container *ngIf=\"!titleActionIconTemplate && !hasInteractiveTitle\">\n <ng-container *ngTemplateOutlet=\"toolbarTitleTemplate\"></ng-container>\n </ng-container>\n <span\n *ngIf=\"!!titleActionIconTemplate || hasInteractiveTitle\"\n [class.clickable]=\"hasInteractiveTitle\"\n [class.has-icon]=\"!!titleActionIconTemplate\"\n (click)=\"onTitleClick($event)\"\n >\n <span>\n <ng-container *ngTemplateOutlet=\"toolbarTitleTemplate\"></ng-container>\n </span>\n <ng-container *ngTemplateOutlet=\"titleActionIconTemplate\"></ng-container>\n </span>\n </div>\n </ion-title>\n <ion-buttons\n *ngIf=\"!!headerActionsTemplate\"\n class=\"hide\"\n slot=\"primary\"\n [class.fade-in]=\"toolbarActionsVisible\"\n >\n <ng-container\n *ngTemplateOutlet=\"headerActionsTemplate; injector: toolbarActionGroupInjector\"\n ></ng-container>\n </ion-buttons>\n <ion-buttons *ngIf=\"!!stickyActionsTemplate\" class=\"legacy-actions\" slot=\"primary\">\n <ng-container *ngTemplateOutlet=\"stickyActionsTemplate\"></ng-container>\n </ion-buttons>\n <ion-buttons *ngIf=\"!!fixedActionsTemplate\" class=\"legacy-actions\" slot=\"secondary\">\n <ng-container *ngTemplateOutlet=\"fixedActionsTemplate\"></ng-container>\n </ion-buttons>\n </ion-toolbar>\n</ion-header>\n\n<ion-content\n scrollEvents=\"true\"\n forceOverscroll=\"false\"\n [class]=\"getMaxWidthClasses()\"\n [class.has-header]=\"hasHeader\"\n>\n <ion-refresher\n *ngIf=\"refresh.observers.length > 0\"\n (ionRefresh)=\"delegateRefreshEvent($event)\"\n slot=\"fixed\"\n >\n <kirby-spinner></kirby-spinner>\n </ion-refresher>\n\n <!-- Page header -->\n <div class=\"page-header-container\" *ngIf=\"hasPageTitle && !hasHeader\">\n <div\n class=\"page-header\"\n [ngClass]=\"{\n 'text-center': titleAlignment === 'center',\n 'text-right': titleAlignment === 'right'\n }\"\n >\n <div #pageTitle class=\"page-title\" [class.has-actions]=\"!!pageActionsTemplate\">\n <ng-container\n *ngTemplateOutlet=\"customTitleTemplate || defaultPageTitleTemplate\"\n ></ng-container>\n <ng-container\n *ngTemplateOutlet=\"pageActionsTemplate || defaultPageActionsTemplate\"\n ></ng-container>\n </div>\n <div *ngIf=\"hasPageSubtitle\" class=\"page-subtitle\">\n <ng-container\n *ngTemplateOutlet=\"customSubtitleTemplate || defaultPageSubtitleTemplate\"\n ></ng-container>\n </div>\n </div>\n </div>\n\n <!-- Header -->\n <div class=\"page-header-container\" *ngIf=\"hasHeader\">\n <ng-content select=\"kirby-header\"></ng-content>\n </div>\n\n <!-- Sticky content -->\n <ng-container *ngIf=\"stickyContentTemplate\">\n <div\n #stickyContentContainer\n class=\"sticky-content-container\"\n [class.content-pinned]=\"isStickyContentPinned\"\n >\n <div>\n <ng-container *ngTemplateOutlet=\"stickyContentTemplate\"></ng-container>\n </div>\n </div>\n </ng-container>\n\n <!-- Content -->\n <div class=\"content-inner\">\n <ng-container\n *ngTemplateOutlet=\"customContentTemplate || defaultContentTemplate\"\n ></ng-container>\n </div>\n\n <div slot=\"fixed\" class=\"fixed-content\" *ngIf=\"fixedContentTemplate\">\n <div class=\"content-inner\">\n <ng-container *ngTemplateOutlet=\"fixedContentTemplate\"></ng-container>\n </div>\n </div>\n</ion-content>\n\n<ion-footer>\n <ng-content select=\"kirby-page-footer\"></ng-content>\n</ion-footer>\n\n<ng-template #defaultPageTitleTemplate>\n <h1 [kirbyFitHeading]=\"fitHeadingConfig\">\n <ng-container *ngTemplateOutlet=\"simpleTitleTemplate\"></ng-container>\n </h1>\n</ng-template>\n<ng-template #defaultPageSubtitleTemplate>\n <ng-container *ngTemplateOutlet=\"simpleSubtitleTemplate\"></ng-container>\n</ng-template>\n<ng-template #defaultPageActionsTemplate>\n <ng-content select=\"kirby-page-actions\"></ng-content>\n</ng-template>\n\n<ng-template #defaultContentTemplate>\n <ng-content select=\"kirby-page-content\"></ng-content>\n</ng-template>\n\n<ng-template #simpleTitleTemplate>{{ title }}</ng-template>\n<ng-template #simpleSubtitleTemplate>{{ subtitle }}</ng-template>\n<ng-template #simpleToolbarTitleTemplate>{{ toolbarTitle }}</ng-template>\n", styles: ["ion-header,ion-toolbar{--background: var(--kirby-background-color);margin:0 auto}ion-toolbar{--border-width: 0 !important;--padding-start: 16px;--padding-end: 16px;--padding-top: 0;--padding-bottom: 0;--ion-toolbar-color: var(--kirby-black);--min-height: 56px}@media (min-width: 768px){ion-toolbar{--padding-start: 24px;--padding-end: 24px;--min-height: 72px}}ion-toolbar:before{content:\"\";position:absolute;left:0;right:0;bottom:0;height:1px}ion-toolbar:before,ion-toolbar::part(background){transition:background-color 50ms linear}ion-toolbar.content-scrolled{--background: #f3f3f3}ion-toolbar.content-scrolled:before,ion-toolbar.content-scrolled::part(background){transition-duration:.2s}ion-toolbar.content-scrolled:not(.content-pinned):before{background-color:var(--kirby-medium)}ion-toolbar.content-pinned:before{transition:none}ion-toolbar ion-buttons[slot=start]{margin-right:8px}ion-toolbar ion-buttons[slot=primary],ion-toolbar ion-buttons[slot=secondary]{margin-left:8px}ion-toolbar ion-buttons[slot=secondary]{order:6}ion-toolbar ion-title{visibility:hidden;opacity:0;transform:translateY(10px);transition-property:opacity,transform;transition-duration:.15s;transition-timing-function:ease;padding-inline:calc(var(--action-buttons-width, 48px) + var(--padding-start))}ion-toolbar ion-title.slide-and-fade-in{visibility:visible;opacity:1;transform:translateY(0)}ion-toolbar ion-title .toolbar-title,ion-toolbar ion-title .toolbar-title>span.has-icon>span{text-overflow:ellipsis;white-space:nowrap;pointer-events:auto;overflow:hidden}ion-toolbar ion-title .toolbar-title{font-weight:700}ion-toolbar ion-title .toolbar-title span.clickable{cursor:pointer}ion-toolbar ion-title .toolbar-title span.has-icon{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;max-width:100%}ion-toolbar ion-title .toolbar-title ::ng-deep>*{text-overflow:ellipsis;white-space:nowrap;pointer-events:auto;overflow:hidden}.hide{visibility:hidden;opacity:0;transition:opacity .1s linear}.hide.fade-in{visibility:inherit;opacity:1}ion-title{box-sizing:border-box;font-size:16px;font-weight:400}ion-back-button{--color: var(--kirby-black);--background: var(--kirby-white);--icon-font-size: 24px;height:40px;width:40px;opacity:1}@media (hover: hover){ion-back-button:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);--background-hover: var(--state-layer-background-color);--background-hover-opacity: var(--state-layer-opacity)}}ion-back-button:active,ion-back-button.ion-activated{--state-layer-opacity: .16;--state-layer-background-color: var(--kirby-black);--background-activated: var(--state-layer-background-color);--background-activated-opacity: var(--state-layer-opacity)}ion-back-button::part(icon){margin-inline:0}ion-back-button::part(native){opacity:1;border-radius:999px;overflow:hidden}ion-back-button::part(native):after{transition:all 80ms linear 0ms}.page-header-container{max-width:var(--page-content-max-width, 720px);margin:0 auto}.page-header{margin-left:16px;margin-top:8px;margin-bottom:var(--kirby-page-title-margin-bottom, 40px)}.page-header .page-title.has-actions{display:flex;justify-content:space-between;align-items:flex-start}.page-header .page-title h1,.page-header .page-title h2,.page-header .page-title h3,.page-header .page-title h4,.page-header .page-title h5,.page-header .page-title h6{margin:0}.page-header .page-subtitle{margin-top:8px}.page-header.text-center{text-align:center;margin-left:0}.page-header.text-right{text-align:right}ion-content{--padding-top: 12px;--padding-start: var(--page-content-padding-start, 16px);--padding-end: var(--page-content-padding-end, 16px);--background: var(--kirby-background-color);--color: var(--kirby-black)}@media (min-width: 632px){ion-content{--padding-start: var(--page-content-padding-start, 48px);--padding-end: var(--page-content-padding-end, 48px)}}ion-content.has-header{--padding-top: 0}ion-content.max-width-standard{--page-content-max-width: 792px}ion-content.max-width-optimized{--page-content-max-width: 1092px}ion-content.max-width-full{--page-content-max-width: 100%}ion-content .content-inner{max-width:var(--page-content-max-width, 720px);margin:0 auto;padding-bottom:40px}ion-content .fixed-content{width:100%;position:absolute;bottom:0;transform:initial}ion-content .fixed-content .content-inner{position:relative}.sticky-content-container{position:sticky;top:-13px;left:0;right:0;padding-top:1px;margin-block-end:24px;z-index:10}.sticky-content-container div{max-width:var(--page-content-max-width, 720px);margin:0 auto}.sticky-content-container:before,.sticky-content-container:after{content:\"\";position:absolute;left:calc(-1 * var(--padding-start));right:calc(-1 * var(--padding-end));bottom:0}.sticky-content-container:before{top:0;background-color:var(--background)}.sticky-content-container:after{height:1px}.sticky-content-container.content-pinned:before{background-color:#f3f3f3}.sticky-content-container.content-pinned:after{background-color:var(--kirby-medium)}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i5.IonBackButton, selector: "ion-back-button", inputs: ["color", "defaultHref", "disabled", "icon", "mode", "routerAnimation", "text", "type"] }, { kind: "component", type: i5.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i5.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i5.IonFooter, selector: "ion-footer", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i5.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i5.IonRefresher, selector: "ion-refresher", inputs: ["closeDuration", "disabled", "pullFactor", "pullMax", "pullMin", "snapbackDuration"] }, { kind: "component", type: i5.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: i5.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "directive", type: i5.IonBackButtonDelegate, selector: "ion-back-button", inputs: ["defaultHref", "routerAnimation"] }, { kind: "directive", type: i3.FitHeadingDirective, selector: "h1[kirbyFitHeading],h2[kirbyFitHeading],h3[kirbyFitHeading]", inputs: ["kirbyFitHeading"] }, { kind: "component", type: i7.SpinnerComponent, selector: "kirby-spinner" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
637
637
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PageComponent, decorators: [{
|
|
638
638
|
type: Component,
|
|
639
|
-
args: [{ selector: 'kirby-page', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-header>\n <ion-toolbar\n [class.content-scrolled]=\"isContentScrolled\"\n [class.content-pinned]=\"isStickyContentPinned\"\n >\n <ion-buttons slot=\"start\">\n <ion-back-button\n text=\"\"\n [defaultHref]=\"defaultBackHref\"\n icon=\"assets/kirby/icons/svg/arrow-back.svg\"\n [style.visibility]=\"hideBackButton ? 'hidden' : null\"\n ></ion-back-button>\n </ion-buttons>\n <ion-title [class.slide-and-fade-in]=\"toolbarTitleVisible\">\n <div class=\"toolbar-title\">\n <span\n [class.clickable]=\"hasInteractiveTitle\"\n [class.has-icon]=\"!!titleActionIconTemplate\"\n (click)=\"onTitleClick($event)\"\n >\n <ng-container *ngTemplateOutlet=\"toolbarTitleTemplate\"></ng-container>\n <ng-container *ngTemplateOutlet=\"titleActionIconTemplate\"></ng-container>\n </span>\n </div>\n </ion-title>\n <ion-buttons\n *ngIf=\"!!headerActionsTemplate\"\n class=\"hide\"\n slot=\"primary\"\n [class.fade-in]=\"toolbarActionsVisible\"\n >\n <ng-container\n *ngTemplateOutlet=\"headerActionsTemplate; injector: toolbarActionGroupInjector\"\n ></ng-container>\n </ion-buttons>\n <ion-buttons *ngIf=\"!!stickyActionsTemplate\" class=\"legacy-actions\" slot=\"primary\">\n <ng-container *ngTemplateOutlet=\"stickyActionsTemplate\"></ng-container>\n </ion-buttons>\n <ion-buttons *ngIf=\"!!fixedActionsTemplate\" class=\"legacy-actions\" slot=\"secondary\">\n <ng-container *ngTemplateOutlet=\"fixedActionsTemplate\"></ng-container>\n </ion-buttons>\n </ion-toolbar>\n</ion-header>\n\n<ion-content\n scrollEvents=\"true\"\n forceOverscroll=\"false\"\n [class]=\"getMaxWidthClasses()\"\n [class.has-header]=\"hasHeader\"\n>\n <ion-refresher\n *ngIf=\"refresh.observers.length > 0\"\n (ionRefresh)=\"delegateRefreshEvent($event)\"\n slot=\"fixed\"\n >\n <kirby-spinner></kirby-spinner>\n </ion-refresher>\n\n <!-- Page header -->\n <div class=\"page-header-container\" *ngIf=\"hasPageTitle && !hasHeader\">\n <div\n class=\"page-header\"\n [ngClass]=\"{\n 'text-center': titleAlignment === 'center',\n 'text-right': titleAlignment === 'right'\n }\"\n >\n <div #pageTitle class=\"page-title\" [class.has-actions]=\"!!pageActionsTemplate\">\n <ng-container\n *ngTemplateOutlet=\"customTitleTemplate || defaultPageTitleTemplate\"\n ></ng-container>\n <ng-container\n *ngTemplateOutlet=\"pageActionsTemplate || defaultPageActionsTemplate\"\n ></ng-container>\n </div>\n <div *ngIf=\"hasPageSubtitle\" class=\"page-subtitle\">\n <ng-container\n *ngTemplateOutlet=\"customSubtitleTemplate || defaultPageSubtitleTemplate\"\n ></ng-container>\n </div>\n </div>\n </div>\n\n <!-- Header -->\n <div class=\"page-header-container\" *ngIf=\"hasHeader\">\n <ng-content select=\"kirby-header\"></ng-content>\n </div>\n\n <!-- Sticky content -->\n <ng-container *ngIf=\"stickyContentTemplate\">\n <div\n #stickyContentContainer\n class=\"sticky-content-container\"\n [class.content-pinned]=\"isStickyContentPinned\"\n >\n <div>\n <ng-container *ngTemplateOutlet=\"stickyContentTemplate\"></ng-container>\n </div>\n </div>\n </ng-container>\n\n <!-- Content -->\n <div class=\"content-inner\">\n <ng-container\n *ngTemplateOutlet=\"customContentTemplate || defaultContentTemplate\"\n ></ng-container>\n </div>\n\n <div slot=\"fixed\" class=\"fixed-content\" *ngIf=\"fixedContentTemplate\">\n <div class=\"content-inner\">\n <ng-container *ngTemplateOutlet=\"fixedContentTemplate\"></ng-container>\n </div>\n </div>\n</ion-content>\n\n<ion-footer>\n <ng-content select=\"kirby-page-footer\"></ng-content>\n</ion-footer>\n\n<ng-template #defaultPageTitleTemplate>\n <h1 [kirbyFitHeading]=\"fitHeadingConfig\">\n <ng-container *ngTemplateOutlet=\"simpleTitleTemplate\"></ng-container>\n </h1>\n</ng-template>\n<ng-template #defaultPageSubtitleTemplate>\n <ng-container *ngTemplateOutlet=\"simpleSubtitleTemplate\"></ng-container>\n</ng-template>\n<ng-template #defaultPageActionsTemplate>\n <ng-content select=\"kirby-page-actions\"></ng-content>\n</ng-template>\n\n<ng-template #defaultContentTemplate>\n <ng-content select=\"kirby-page-content\"></ng-content>\n</ng-template>\n\n<ng-template #simpleTitleTemplate>{{ title }}</ng-template>\n<ng-template #simpleSubtitleTemplate>{{ subtitle }}</ng-template>\n<ng-template #simpleToolbarTitleTemplate>{{ toolbarTitle }}</ng-template>\n", styles: ["ion-header,ion-toolbar{--background: var(--kirby-background-color);margin:0 auto}ion-toolbar{--border-width: 0 !important;--padding-start: 16px;--padding-end: 16px;--padding-top: 0;--padding-bottom: 0;--ion-toolbar-color: var(--kirby-black);--min-height: 56px}@media (min-width: 768px){ion-toolbar{--padding-start: 24px;--padding-end: 24px;--min-height: 72px}}ion-toolbar:before{content:\"\";position:absolute;left:0;right:0;bottom:0;height:1px}ion-toolbar:before,ion-toolbar::part(background){transition:background-color 50ms linear}ion-toolbar.content-scrolled{--background: #f3f3f3}ion-toolbar.content-scrolled:before,ion-toolbar.content-scrolled::part(background){transition-duration:.2s}ion-toolbar.content-scrolled:not(.content-pinned):before{background-color:var(--kirby-medium)}ion-toolbar.content-pinned:before{transition:none}ion-toolbar ion-buttons[slot=start]{margin-right:8px}ion-toolbar ion-buttons[slot=primary],ion-toolbar ion-buttons[slot=secondary]{margin-left:8px}ion-toolbar ion-buttons[slot=secondary]{order:6}ion-toolbar ion-title{visibility:hidden;opacity:0;transform:translateY(10px);transition-property:opacity,transform;transition-duration:.15s;transition-timing-function:ease;padding-inline:calc(var(--action-buttons-width, 48px) + var(--padding-start))}ion-toolbar ion-title.slide-and-fade-in{visibility:visible;opacity:1;transform:translateY(0)}ion-toolbar ion-title .toolbar-title{text-overflow:ellipsis;white-space:nowrap;pointer-events:auto;overflow:hidden;font-weight:700}ion-toolbar ion-title .toolbar-title span.clickable{cursor:pointer}ion-toolbar ion-title .toolbar-title span.has-icon{display:inline-flex;flex-direction:row;align-items:center;justify-content:center}ion-toolbar ion-title .toolbar-title ::ng-deep>*{text-overflow:ellipsis;white-space:nowrap;pointer-events:auto;overflow:hidden}.hide{visibility:hidden;opacity:0;transition:opacity .1s linear}.hide.fade-in{visibility:inherit;opacity:1}ion-title{box-sizing:border-box;font-size:16px;font-weight:400}ion-back-button{--color: var(--kirby-black);--background: var(--kirby-white);--icon-font-size: 24px;height:40px;width:40px;opacity:1}@media (hover: hover){ion-back-button:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);--background-hover: var(--state-layer-background-color);--background-hover-opacity: var(--state-layer-opacity)}}ion-back-button:active,ion-back-button.ion-activated{--state-layer-opacity: .16;--state-layer-background-color: var(--kirby-black);--background-activated: var(--state-layer-background-color);--background-activated-opacity: var(--state-layer-opacity)}ion-back-button::part(icon){margin-inline:0}ion-back-button::part(native){opacity:1;border-radius:999px;overflow:hidden}ion-back-button::part(native):after{transition:all 80ms linear 0ms}.page-header-container{max-width:var(--page-content-max-width, 720px);margin:0 auto}.page-header{margin-left:16px;margin-top:8px;margin-bottom:var(--kirby-page-title-margin-bottom, 40px)}.page-header .page-title.has-actions{display:flex;justify-content:space-between;align-items:flex-start}.page-header .page-title h1,.page-header .page-title h2,.page-header .page-title h3,.page-header .page-title h4,.page-header .page-title h5,.page-header .page-title h6{margin:0}.page-header .page-subtitle{margin-top:8px}.page-header.text-center{text-align:center;margin-left:0}.page-header.text-right{text-align:right}ion-content{--padding-top: 12px;--padding-start: var(--page-content-padding-start, 16px);--padding-end: var(--page-content-padding-end, 16px);--background: var(--kirby-background-color);--color: var(--kirby-black)}@media (min-width: 632px){ion-content{--padding-start: var(--page-content-padding-start, 48px);--padding-end: var(--page-content-padding-end, 48px)}}ion-content.has-header{--padding-top: 0}ion-content.max-width-standard{--page-content-max-width: 792px}ion-content.max-width-optimized{--page-content-max-width: 1092px}ion-content.max-width-full{--page-content-max-width: 100%}ion-content .content-inner{max-width:var(--page-content-max-width, 720px);margin:0 auto;padding-bottom:40px}ion-content .fixed-content{width:100%;position:absolute;bottom:0;transform:initial}ion-content .fixed-content .content-inner{position:relative}.sticky-content-container{position:sticky;top:-13px;left:0;right:0;padding-top:1px;margin-block-end:24px;z-index:10}.sticky-content-container div{max-width:var(--page-content-max-width, 720px);margin:0 auto}.sticky-content-container:before,.sticky-content-container:after{content:\"\";position:absolute;left:calc(-1 * var(--padding-start));right:calc(-1 * var(--padding-end));bottom:0}.sticky-content-container:before{top:0;background-color:var(--background)}.sticky-content-container:after{height:1px}.sticky-content-container.content-pinned:before{background-color:#f3f3f3}.sticky-content-container.content-pinned:after{background-color:var(--kirby-medium)}\n"] }]
|
|
639
|
+
args: [{ selector: 'kirby-page', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-header>\n <ion-toolbar\n [class.content-scrolled]=\"isContentScrolled\"\n [class.content-pinned]=\"isStickyContentPinned\"\n >\n <ion-buttons slot=\"start\">\n <ion-back-button\n text=\"\"\n [defaultHref]=\"defaultBackHref\"\n icon=\"assets/kirby/icons/svg/arrow-back.svg\"\n [style.visibility]=\"hideBackButton ? 'hidden' : null\"\n ></ion-back-button>\n </ion-buttons>\n <ion-title [class.slide-and-fade-in]=\"toolbarTitleVisible\">\n <div class=\"toolbar-title\">\n <ng-container *ngIf=\"!titleActionIconTemplate && !hasInteractiveTitle\">\n <ng-container *ngTemplateOutlet=\"toolbarTitleTemplate\"></ng-container>\n </ng-container>\n <span\n *ngIf=\"!!titleActionIconTemplate || hasInteractiveTitle\"\n [class.clickable]=\"hasInteractiveTitle\"\n [class.has-icon]=\"!!titleActionIconTemplate\"\n (click)=\"onTitleClick($event)\"\n >\n <span>\n <ng-container *ngTemplateOutlet=\"toolbarTitleTemplate\"></ng-container>\n </span>\n <ng-container *ngTemplateOutlet=\"titleActionIconTemplate\"></ng-container>\n </span>\n </div>\n </ion-title>\n <ion-buttons\n *ngIf=\"!!headerActionsTemplate\"\n class=\"hide\"\n slot=\"primary\"\n [class.fade-in]=\"toolbarActionsVisible\"\n >\n <ng-container\n *ngTemplateOutlet=\"headerActionsTemplate; injector: toolbarActionGroupInjector\"\n ></ng-container>\n </ion-buttons>\n <ion-buttons *ngIf=\"!!stickyActionsTemplate\" class=\"legacy-actions\" slot=\"primary\">\n <ng-container *ngTemplateOutlet=\"stickyActionsTemplate\"></ng-container>\n </ion-buttons>\n <ion-buttons *ngIf=\"!!fixedActionsTemplate\" class=\"legacy-actions\" slot=\"secondary\">\n <ng-container *ngTemplateOutlet=\"fixedActionsTemplate\"></ng-container>\n </ion-buttons>\n </ion-toolbar>\n</ion-header>\n\n<ion-content\n scrollEvents=\"true\"\n forceOverscroll=\"false\"\n [class]=\"getMaxWidthClasses()\"\n [class.has-header]=\"hasHeader\"\n>\n <ion-refresher\n *ngIf=\"refresh.observers.length > 0\"\n (ionRefresh)=\"delegateRefreshEvent($event)\"\n slot=\"fixed\"\n >\n <kirby-spinner></kirby-spinner>\n </ion-refresher>\n\n <!-- Page header -->\n <div class=\"page-header-container\" *ngIf=\"hasPageTitle && !hasHeader\">\n <div\n class=\"page-header\"\n [ngClass]=\"{\n 'text-center': titleAlignment === 'center',\n 'text-right': titleAlignment === 'right'\n }\"\n >\n <div #pageTitle class=\"page-title\" [class.has-actions]=\"!!pageActionsTemplate\">\n <ng-container\n *ngTemplateOutlet=\"customTitleTemplate || defaultPageTitleTemplate\"\n ></ng-container>\n <ng-container\n *ngTemplateOutlet=\"pageActionsTemplate || defaultPageActionsTemplate\"\n ></ng-container>\n </div>\n <div *ngIf=\"hasPageSubtitle\" class=\"page-subtitle\">\n <ng-container\n *ngTemplateOutlet=\"customSubtitleTemplate || defaultPageSubtitleTemplate\"\n ></ng-container>\n </div>\n </div>\n </div>\n\n <!-- Header -->\n <div class=\"page-header-container\" *ngIf=\"hasHeader\">\n <ng-content select=\"kirby-header\"></ng-content>\n </div>\n\n <!-- Sticky content -->\n <ng-container *ngIf=\"stickyContentTemplate\">\n <div\n #stickyContentContainer\n class=\"sticky-content-container\"\n [class.content-pinned]=\"isStickyContentPinned\"\n >\n <div>\n <ng-container *ngTemplateOutlet=\"stickyContentTemplate\"></ng-container>\n </div>\n </div>\n </ng-container>\n\n <!-- Content -->\n <div class=\"content-inner\">\n <ng-container\n *ngTemplateOutlet=\"customContentTemplate || defaultContentTemplate\"\n ></ng-container>\n </div>\n\n <div slot=\"fixed\" class=\"fixed-content\" *ngIf=\"fixedContentTemplate\">\n <div class=\"content-inner\">\n <ng-container *ngTemplateOutlet=\"fixedContentTemplate\"></ng-container>\n </div>\n </div>\n</ion-content>\n\n<ion-footer>\n <ng-content select=\"kirby-page-footer\"></ng-content>\n</ion-footer>\n\n<ng-template #defaultPageTitleTemplate>\n <h1 [kirbyFitHeading]=\"fitHeadingConfig\">\n <ng-container *ngTemplateOutlet=\"simpleTitleTemplate\"></ng-container>\n </h1>\n</ng-template>\n<ng-template #defaultPageSubtitleTemplate>\n <ng-container *ngTemplateOutlet=\"simpleSubtitleTemplate\"></ng-container>\n</ng-template>\n<ng-template #defaultPageActionsTemplate>\n <ng-content select=\"kirby-page-actions\"></ng-content>\n</ng-template>\n\n<ng-template #defaultContentTemplate>\n <ng-content select=\"kirby-page-content\"></ng-content>\n</ng-template>\n\n<ng-template #simpleTitleTemplate>{{ title }}</ng-template>\n<ng-template #simpleSubtitleTemplate>{{ subtitle }}</ng-template>\n<ng-template #simpleToolbarTitleTemplate>{{ toolbarTitle }}</ng-template>\n", styles: ["ion-header,ion-toolbar{--background: var(--kirby-background-color);margin:0 auto}ion-toolbar{--border-width: 0 !important;--padding-start: 16px;--padding-end: 16px;--padding-top: 0;--padding-bottom: 0;--ion-toolbar-color: var(--kirby-black);--min-height: 56px}@media (min-width: 768px){ion-toolbar{--padding-start: 24px;--padding-end: 24px;--min-height: 72px}}ion-toolbar:before{content:\"\";position:absolute;left:0;right:0;bottom:0;height:1px}ion-toolbar:before,ion-toolbar::part(background){transition:background-color 50ms linear}ion-toolbar.content-scrolled{--background: #f3f3f3}ion-toolbar.content-scrolled:before,ion-toolbar.content-scrolled::part(background){transition-duration:.2s}ion-toolbar.content-scrolled:not(.content-pinned):before{background-color:var(--kirby-medium)}ion-toolbar.content-pinned:before{transition:none}ion-toolbar ion-buttons[slot=start]{margin-right:8px}ion-toolbar ion-buttons[slot=primary],ion-toolbar ion-buttons[slot=secondary]{margin-left:8px}ion-toolbar ion-buttons[slot=secondary]{order:6}ion-toolbar ion-title{visibility:hidden;opacity:0;transform:translateY(10px);transition-property:opacity,transform;transition-duration:.15s;transition-timing-function:ease;padding-inline:calc(var(--action-buttons-width, 48px) + var(--padding-start))}ion-toolbar ion-title.slide-and-fade-in{visibility:visible;opacity:1;transform:translateY(0)}ion-toolbar ion-title .toolbar-title,ion-toolbar ion-title .toolbar-title>span.has-icon>span{text-overflow:ellipsis;white-space:nowrap;pointer-events:auto;overflow:hidden}ion-toolbar ion-title .toolbar-title{font-weight:700}ion-toolbar ion-title .toolbar-title span.clickable{cursor:pointer}ion-toolbar ion-title .toolbar-title span.has-icon{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;max-width:100%}ion-toolbar ion-title .toolbar-title ::ng-deep>*{text-overflow:ellipsis;white-space:nowrap;pointer-events:auto;overflow:hidden}.hide{visibility:hidden;opacity:0;transition:opacity .1s linear}.hide.fade-in{visibility:inherit;opacity:1}ion-title{box-sizing:border-box;font-size:16px;font-weight:400}ion-back-button{--color: var(--kirby-black);--background: var(--kirby-white);--icon-font-size: 24px;height:40px;width:40px;opacity:1}@media (hover: hover){ion-back-button:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);--background-hover: var(--state-layer-background-color);--background-hover-opacity: var(--state-layer-opacity)}}ion-back-button:active,ion-back-button.ion-activated{--state-layer-opacity: .16;--state-layer-background-color: var(--kirby-black);--background-activated: var(--state-layer-background-color);--background-activated-opacity: var(--state-layer-opacity)}ion-back-button::part(icon){margin-inline:0}ion-back-button::part(native){opacity:1;border-radius:999px;overflow:hidden}ion-back-button::part(native):after{transition:all 80ms linear 0ms}.page-header-container{max-width:var(--page-content-max-width, 720px);margin:0 auto}.page-header{margin-left:16px;margin-top:8px;margin-bottom:var(--kirby-page-title-margin-bottom, 40px)}.page-header .page-title.has-actions{display:flex;justify-content:space-between;align-items:flex-start}.page-header .page-title h1,.page-header .page-title h2,.page-header .page-title h3,.page-header .page-title h4,.page-header .page-title h5,.page-header .page-title h6{margin:0}.page-header .page-subtitle{margin-top:8px}.page-header.text-center{text-align:center;margin-left:0}.page-header.text-right{text-align:right}ion-content{--padding-top: 12px;--padding-start: var(--page-content-padding-start, 16px);--padding-end: var(--page-content-padding-end, 16px);--background: var(--kirby-background-color);--color: var(--kirby-black)}@media (min-width: 632px){ion-content{--padding-start: var(--page-content-padding-start, 48px);--padding-end: var(--page-content-padding-end, 48px)}}ion-content.has-header{--padding-top: 0}ion-content.max-width-standard{--page-content-max-width: 792px}ion-content.max-width-optimized{--page-content-max-width: 1092px}ion-content.max-width-full{--page-content-max-width: 100%}ion-content .content-inner{max-width:var(--page-content-max-width, 720px);margin:0 auto;padding-bottom:40px}ion-content .fixed-content{width:100%;position:absolute;bottom:0;transform:initial}ion-content .fixed-content .content-inner{position:relative}.sticky-content-container{position:sticky;top:-13px;left:0;right:0;padding-top:1px;margin-block-end:24px;z-index:10}.sticky-content-container div{max-width:var(--page-content-max-width, 720px);margin:0 auto}.sticky-content-container:before,.sticky-content-container:after{content:\"\";position:absolute;left:calc(-1 * var(--padding-start));right:calc(-1 * var(--padding-end));bottom:0}.sticky-content-container:before{top:0;background-color:var(--background)}.sticky-content-container:after{height:1px}.sticky-content-container.content-pinned:before{background-color:#f3f3f3}.sticky-content-container.content-pinned:after{background-color:var(--kirby-medium)}\n"] }]
|
|
640
640
|
}], ctorParameters: function () {
|
|
641
641
|
return [{ type: i0.ElementRef }, { type: i0.Injector }, { type: i0.Renderer2 }, { type: i2.Router }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i1.ModalNavigationService }, { type: i3.ResizeObserverService }, { type: i4.TabsComponent, decorators: [{
|
|
642
642
|
type: Optional
|