@kirbydesign/designsystem 5.2.1 → 5.2.2

package/bundles/kirbydesign-designsystem.umd.js

@@ -5888,7 +5888,7 @@
         { type: i0.Component, args: [{
                     selector: 'kirby-item',
                     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</ion-item>\n",
-                    styles: [":host{display:block;position:relative}:host ion-item{--padding-top:var(--item-padding-top);--padding-bottom:var(--item-padding-bottom);font-size:14px;--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:var(--kirby-item-background-activated,var(--kirby-white-shade));--background-activated-opacity:0.99;--background-focused:var(--kirby-item-background-focused,var(--kirby-background-color));--background-focused-opacity:1;--background-hover:var(--kirby-item-background-hover,var(--kirby-background-color));--background-hover-opacity:1}@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>[detail][slot=end],:host ion-item ::ng-deep>data[slot=end],:host ion-item ::ng-deep>ion-reorder[slot=end]{margin-inline-start:16px}:host ion-item ::ng-deep>data,: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{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>data.kirby-text-bold,: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{font-weight:700}:host ion-item ::ng-deep>p{font-size:14px}:host ion-item ::ng-deep>[detail],:host ion-item ::ng-deep>[subtitle]{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{--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}:host-context(kirby-dropdown) ion-item,:host-context(kirby-popover) ion-item{--min-height:44px}:host-context(kirby-list-item:first-of-type) ion-item{--padding-top:8px}:host-context(kirby-list-item:first-of-type kirby-card) ion-item{--padding-top:0}:host-context(kirby-list-item:last-of-type) ion-item{--padding-bottom:8px}:host-context(kirby-list-item:last-of-type kirby-card) ion-item{--padding-bottom:0}:host(.selected) ion-item ::ng-deep>data,: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-context(kirby-list .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{font-weight:700}: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}"]
+                    styles: [":host{display:block;position:relative}:host ion-item{--padding-top:var(--item-padding-top,0px);--padding-bottom:var(--item-padding-bottom,0px);font-size:14px;--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:var(--kirby-item-background-activated,var(--kirby-white-shade));--background-activated-opacity:0.99;--background-focused:var(--kirby-item-background-focused,var(--kirby-background-color));--background-focused-opacity:1;--background-hover:var(--kirby-item-background-hover,var(--kirby-background-color));--background-hover-opacity:1}@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>[detail][slot=end],:host ion-item ::ng-deep>data[slot=end],:host ion-item ::ng-deep>ion-reorder[slot=end]{margin-inline-start:16px}:host ion-item ::ng-deep>data,: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{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>data.kirby-text-bold,: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{font-weight:700}:host ion-item ::ng-deep>p{font-size:14px}:host ion-item ::ng-deep>[detail],:host ion-item ::ng-deep>[subtitle]{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{--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}:host-context(kirby-dropdown) ion-item,:host-context(kirby-popover) ion-item{--min-height:44px}:host-context(kirby-list-item:first-of-type) ion-item{--padding-top:8px}:host-context(kirby-list-item:first-of-type kirby-card) ion-item{--padding-top:0}:host-context(kirby-list-item:last-of-type) ion-item{--padding-bottom:8px}:host-context(kirby-list-item:last-of-type kirby-card) ion-item{--padding-bottom:0}:host(.selected) ion-item ::ng-deep>data,: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-context(kirby-list .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{font-weight:700}: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}"]
                 },] }
     ];
     ItemComponent.propDecorators = {