@baloise/ds-core 20.0.0-next.7 → 20.0.0-next.8

package/dist/collection/components/stack/stack.host.css

@@ -1 +1 @@
-.stack,.stack-content{display:flex;justify-content:flex-start;align-items:flex-start;flex-flow:column nowrap}.stack{gap:1rem}.stack-content{flex:1;height:100%;gap:.25rem}.stack>.stack,.stack>.stack-content{align-self:stretch}.stack.is-horizontal>.stack-content{align-self:center}.stack.has-wrap,.stack-content.has-wrap{flex-wrap:wrap}.stack.as-row,.stack.is-horizontal,.stack.has-direction-row,.stack-content.as-row,.stack-content.is-horizontal,.stack-content.has-direction-row{flex-flow:row nowrap;align-items:center}.stack.as-row-reverse,.stack.is-horizontal-reverse,.stack.has-direction-row-reverse,.stack-content.as-row-reverse,.stack-content.is-horizontal-reverse,.stack-content.has-direction-row-reverse{flex-flow:row-reverse nowrap;align-items:center}.stack.as-col-reverse,.stack.is-vertical-reverse,.stack.has-direction-column-reverse,.stack-content.as-col-reverse,.stack-content.is-vertical-reverse,.stack-content.has-direction-column-reverse{flex-flow:column-reverse nowrap}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-left,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-start,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-left,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-start{justify-content:flex-start;align-items:flex-start}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-center,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-center{justify-content:flex-start;align-items:center}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-right,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-end,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-right,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-end{justify-content:flex-start;align-items:flex-end}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-start,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-left,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-start,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-start,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-left,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-start{justify-content:center;align-items:flex-start}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center{justify-content:center;align-items:center}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-end,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-right,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-end,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-end,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-right,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-end{justify-content:center;align-items:flex-end}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-left,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-start,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-left,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-start{justify-content:flex-end;align-items:flex-start}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-center,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-center{justify-content:flex-end;align-items:center}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-right,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-end,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-right,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-end{justify-content:flex-end;align-items:flex-end}.stack.as-row.align-top-left,.stack.as-row.align-top-start,.stack.is-horizontal.align-top-left,.stack.is-horizontal.align-top-start,.stack.has-direction-row.align-top-left,.stack.has-direction-row.align-top-start,.stack.as-row-reverse.align-top-left,.stack.as-row-reverse.align-top-start,.stack.is-horizontal-reverse.align-top-left,.stack.is-horizontal-reverse.align-top-start,.stack.has-direction-row-reverse.align-top-left,.stack.has-direction-row-reverse.align-top-start,.stack-content.as-row.align-top-left,.stack-content.as-row.align-top-start,.stack-content.is-horizontal.align-top-left,.stack-content.is-horizontal.align-top-start,.stack-content.has-direction-row.align-top-left,.stack-content.has-direction-row.align-top-start,.stack-content.as-row-reverse.align-top-left,.stack-content.as-row-reverse.align-top-start,.stack-content.is-horizontal-reverse.align-top-left,.stack-content.is-horizontal-reverse.align-top-start,.stack-content.has-direction-row-reverse.align-top-left,.stack-content.has-direction-row-reverse.align-top-start{align-items:flex-start;justify-content:flex-start}.stack.as-row.align-top,.stack.as-row.align-top-center,.stack.is-horizontal.align-top,.stack.is-horizontal.align-top-center,.stack.has-direction-row.align-top,.stack.has-direction-row.align-top-center,.stack.as-row-reverse.align-top,.stack.as-row-reverse.align-top-center,.stack.is-horizontal-reverse.align-top,.stack.is-horizontal-reverse.align-top-center,.stack.has-direction-row-reverse.align-top,.stack.has-direction-row-reverse.align-top-center,.stack-content.as-row.align-top,.stack-content.as-row.align-top-center,.stack-content.is-horizontal.align-top,.stack-content.is-horizontal.align-top-center,.stack-content.has-direction-row.align-top,.stack-content.has-direction-row.align-top-center,.stack-content.as-row-reverse.align-top,.stack-content.as-row-reverse.align-top-center,.stack-content.is-horizontal-reverse.align-top,.stack-content.is-horizontal-reverse.align-top-center,.stack-content.has-direction-row-reverse.align-top,.stack-content.has-direction-row-reverse.align-top-center{align-items:flex-start;justify-content:center}.stack.as-row.align-top-right,.stack.as-row.align-top-end,.stack.is-horizontal.align-top-right,.stack.is-horizontal.align-top-end,.stack.has-direction-row.align-top-right,.stack.has-direction-row.align-top-end,.stack.as-row-reverse.align-top-right,.stack.as-row-reverse.align-top-end,.stack.is-horizontal-reverse.align-top-right,.stack.is-horizontal-reverse.align-top-end,.stack.has-direction-row-reverse.align-top-right,.stack.has-direction-row-reverse.align-top-end,.stack-content.as-row.align-top-right,.stack-content.as-row.align-top-end,.stack-content.is-horizontal.align-top-right,.stack-content.is-horizontal.align-top-end,.stack-content.has-direction-row.align-top-right,.stack-content.has-direction-row.align-top-end,.stack-content.as-row-reverse.align-top-right,.stack-content.as-row-reverse.align-top-end,.stack-content.is-horizontal-reverse.align-top-right,.stack-content.is-horizontal-reverse.align-top-end,.stack-content.has-direction-row-reverse.align-top-right,.stack-content.has-direction-row-reverse.align-top-end{align-items:flex-start;justify-content:flex-end}.stack.as-row.align-start,.stack.as-row.align-center-left,.stack.as-row.align-center-start,.stack.is-horizontal.align-start,.stack.is-horizontal.align-center-left,.stack.is-horizontal.align-center-start,.stack.has-direction-row.align-start,.stack.has-direction-row.align-center-left,.stack.has-direction-row.align-center-start,.stack.as-row-reverse.align-start,.stack.as-row-reverse.align-center-left,.stack.as-row-reverse.align-center-start,.stack.is-horizontal-reverse.align-start,.stack.is-horizontal-reverse.align-center-left,.stack.is-horizontal-reverse.align-center-start,.stack.has-direction-row-reverse.align-start,.stack.has-direction-row-reverse.align-center-left,.stack.has-direction-row-reverse.align-center-start,.stack-content.as-row.align-start,.stack-content.as-row.align-center-left,.stack-content.as-row.align-center-start,.stack-content.is-horizontal.align-start,.stack-content.is-horizontal.align-center-left,.stack-content.is-horizontal.align-center-start,.stack-content.has-direction-row.align-start,.stack-content.has-direction-row.align-center-left,.stack-content.has-direction-row.align-center-start,.stack-content.as-row-reverse.align-start,.stack-content.as-row-reverse.align-center-left,.stack-content.as-row-reverse.align-center-start,.stack-content.is-horizontal-reverse.align-start,.stack-content.is-horizontal-reverse.align-center-left,.stack-content.is-horizontal-reverse.align-center-start,.stack-content.has-direction-row-reverse.align-start,.stack-content.has-direction-row-reverse.align-center-left,.stack-content.has-direction-row-reverse.align-center-start{align-items:center;justify-content:flex-start}.stack.as-row.align-center,.stack.is-horizontal.align-center,.stack.has-direction-row.align-center,.stack.as-row-reverse.align-center,.stack.is-horizontal-reverse.align-center,.stack.has-direction-row-reverse.align-center,.stack-content.as-row.align-center,.stack-content.is-horizontal.align-center,.stack-content.has-direction-row.align-center,.stack-content.as-row-reverse.align-center,.stack-content.is-horizontal-reverse.align-center,.stack-content.has-direction-row-reverse.align-center{align-items:center;justify-content:center}.stack.as-row.align-end,.stack.as-row.align-center-right,.stack.as-row.align-center-end,.stack.is-horizontal.align-end,.stack.is-horizontal.align-center-right,.stack.is-horizontal.align-center-end,.stack.has-direction-row.align-end,.stack.has-direction-row.align-center-right,.stack.has-direction-row.align-center-end,.stack.as-row-reverse.align-end,.stack.as-row-reverse.align-center-right,.stack.as-row-reverse.align-center-end,.stack.is-horizontal-reverse.align-end,.stack.is-horizontal-reverse.align-center-right,.stack.is-horizontal-reverse.align-center-end,.stack.has-direction-row-reverse.align-end,.stack.has-direction-row-reverse.align-center-right,.stack.has-direction-row-reverse.align-center-end,.stack-content.as-row.align-end,.stack-content.as-row.align-center-right,.stack-content.as-row.align-center-end,.stack-content.is-horizontal.align-end,.stack-content.is-horizontal.align-center-right,.stack-content.is-horizontal.align-center-end,.stack-content.has-direction-row.align-end,.stack-content.has-direction-row.align-center-right,.stack-content.has-direction-row.align-center-end,.stack-content.as-row-reverse.align-end,.stack-content.as-row-reverse.align-center-right,.stack-content.as-row-reverse.align-center-end,.stack-content.is-horizontal-reverse.align-end,.stack-content.is-horizontal-reverse.align-center-right,.stack-content.is-horizontal-reverse.align-center-end,.stack-content.has-direction-row-reverse.align-end,.stack-content.has-direction-row-reverse.align-center-right,.stack-content.has-direction-row-reverse.align-center-end{align-items:center;justify-content:flex-end}.stack.as-row.align-bottom-left,.stack.as-row.align-bottom-start,.stack.is-horizontal.align-bottom-left,.stack.is-horizontal.align-bottom-start,.stack.has-direction-row.align-bottom-left,.stack.has-direction-row.align-bottom-start,.stack.as-row-reverse.align-bottom-left,.stack.as-row-reverse.align-bottom-start,.stack.is-horizontal-reverse.align-bottom-left,.stack.is-horizontal-reverse.align-bottom-start,.stack.has-direction-row-reverse.align-bottom-left,.stack.has-direction-row-reverse.align-bottom-start,.stack-content.as-row.align-bottom-left,.stack-content.as-row.align-bottom-start,.stack-content.is-horizontal.align-bottom-left,.stack-content.is-horizontal.align-bottom-start,.stack-content.has-direction-row.align-bottom-left,.stack-content.has-direction-row.align-bottom-start,.stack-content.as-row-reverse.align-bottom-left,.stack-content.as-row-reverse.align-bottom-start,.stack-content.is-horizontal-reverse.align-bottom-left,.stack-content.is-horizontal-reverse.align-bottom-start,.stack-content.has-direction-row-reverse.align-bottom-left,.stack-content.has-direction-row-reverse.align-bottom-start{align-items:flex-end;justify-content:flex-start}.stack.as-row.align-bottom,.stack.as-row.align-bottom-center,.stack.is-horizontal.align-bottom,.stack.is-horizontal.align-bottom-center,.stack.has-direction-row.align-bottom,.stack.has-direction-row.align-bottom-center,.stack.as-row-reverse.align-bottom,.stack.as-row-reverse.align-bottom-center,.stack.is-horizontal-reverse.align-bottom,.stack.is-horizontal-reverse.align-bottom-center,.stack.has-direction-row-reverse.align-bottom,.stack.has-direction-row-reverse.align-bottom-center,.stack-content.as-row.align-bottom,.stack-content.as-row.align-bottom-center,.stack-content.is-horizontal.align-bottom,.stack-content.is-horizontal.align-bottom-center,.stack-content.has-direction-row.align-bottom,.stack-content.has-direction-row.align-bottom-center,.stack-content.as-row-reverse.align-bottom,.stack-content.as-row-reverse.align-bottom-center,.stack-content.is-horizontal-reverse.align-bottom,.stack-content.is-horizontal-reverse.align-bottom-center,.stack-content.has-direction-row-reverse.align-bottom,.stack-content.has-direction-row-reverse.align-bottom-center{align-items:flex-end;justify-content:center}.stack.as-row.align-bottom-right,.stack.as-row.align-bottom-end,.stack.is-horizontal.align-bottom-right,.stack.is-horizontal.align-bottom-end,.stack.has-direction-row.align-bottom-right,.stack.has-direction-row.align-bottom-end,.stack.as-row-reverse.align-bottom-right,.stack.as-row-reverse.align-bottom-end,.stack.is-horizontal-reverse.align-bottom-right,.stack.is-horizontal-reverse.align-bottom-end,.stack.has-direction-row-reverse.align-bottom-right,.stack.has-direction-row-reverse.align-bottom-end,.stack-content.as-row.align-bottom-right,.stack-content.as-row.align-bottom-end,.stack-content.is-horizontal.align-bottom-right,.stack-content.is-horizontal.align-bottom-end,.stack-content.has-direction-row.align-bottom-right,.stack-content.has-direction-row.align-bottom-end,.stack-content.as-row-reverse.align-bottom-right,.stack-content.as-row-reverse.align-bottom-end,.stack-content.is-horizontal-reverse.align-bottom-right,.stack-content.is-horizontal-reverse.align-bottom-end,.stack-content.has-direction-row-reverse.align-bottom-right,.stack-content.has-direction-row-reverse.align-bottom-end{align-items:flex-end;justify-content:flex-end}.stack-content,.stack-content.align-top-left,.stack-content.align-top-start,.stack-content.align-start,.stack-content.align-center-left,.stack-content.align-center-start,.stack-content.align-bottom-left,.stack-content.align-bottom-start{text-align:left}.stack-content.align-top,.stack-content.align-top-center,.stack-content.align-center,.stack-content.align-bottom,.stack-content.align-bottom-center{text-align:center}.stack-content.align-top-right,.stack-content.align-top-end,.stack-content.align-end,.stack-content.align-center-right,.stack-content.align-center-end,.stack-content.align-bottom-right,.stack-content.align-bottom-end{text-align:right}.stack-content.text-left{text-align:left}.stack-content.text-center{text-align:center}.stack-content.text-right{text-align:right}.stack.fit-content,.stack-content.fit-content{flex:unset;width:fit-content}.stack.p-2xs,.stack-content.p-2xs{padding:var(--ds-alias-space-2xs-device)}.stack.p-xs,.stack-content.p-xs{padding:var(--ds-alias-space-xs-device)}.stack.p-sm,.stack-content.p-sm{padding:var(--ds-alias-space-sm-device)}.stack.p-base,.stack-content.p-base{padding:var(--ds-alias-space-base-device)}.stack.p-md,.stack-content.p-md{padding:var(--ds-alias-space-md-device)}.stack.p-lg,.stack-content.p-lg{padding:var(--ds-alias-space-lg-device)}.stack.p-xl,.stack-content.p-xl{padding:var(--ds-alias-space-xl-device)}.stack.p-2xl,.stack-content.p-2xl{padding:var(--ds-alias-space-2xl-device)}.stack.px-2xs,.stack-content.px-2xs{padding-left:var(--ds-alias-space-2xs-device);padding-right:var(--ds-alias-space-2xs-device)}.stack.px-xs,.stack-content.px-xs{padding-left:var(--ds-alias-space-xs-device);padding-right:var(--ds-alias-space-xs-device)}.stack.px-sm,.stack-content.px-sm{padding-left:var(--ds-alias-space-sm-device);padding-right:var(--ds-alias-space-sm-device)}.stack.px-base,.stack-content.px-base{padding-left:var(--ds-alias-space-base-device);padding-right:var(--ds-alias-space-base-device)}.stack.px-md,.stack-content.px-md{padding-left:var(--ds-alias-space-md-device);padding-right:var(--ds-alias-space-md-device)}.stack.px-lg,.stack-content.px-lg{padding-left:var(--ds-alias-space-lg-device);padding-right:var(--ds-alias-space-lg-device)}.stack.px-xl,.stack-content.px-xl{padding-left:var(--ds-alias-space-xl-device);padding-right:var(--ds-alias-space-xl-device)}.stack.px-2xl,.stack-content.px-2xl{padding-left:var(--ds-alias-space-2xl-device);padding-right:var(--ds-alias-space-2xl-device)}.stack.py-2xs,.stack-content.py-2xs{padding-top:var(--ds-alias-space-2xs-device);padding-bottom:var(--ds-alias-space-2xs-device)}.stack.py-xs,.stack-content.py-xs{padding-top:var(--ds-alias-space-xs-device);padding-bottom:var(--ds-alias-space-xs-device)}.stack.py-sm,.stack-content.py-sm{padding-top:var(--ds-alias-space-sm-device);padding-bottom:var(--ds-alias-space-sm-device)}.stack.py-base,.stack-content.py-base{padding-top:var(--ds-alias-space-base-device);padding-bottom:var(--ds-alias-space-base-device)}.stack.py-md,.stack-content.py-md{padding-top:var(--ds-alias-space-md-device);padding-bottom:var(--ds-alias-space-md-device)}.stack.py-lg,.stack-content.py-lg{padding-top:var(--ds-alias-space-lg-device);padding-bottom:var(--ds-alias-space-lg-device)}.stack.py-xl,.stack-content.py-xl{padding-top:var(--ds-alias-space-xl-device);padding-bottom:var(--ds-alias-space-xl-device)}.stack.py-2xl,.stack-content.py-2xl{padding-top:var(--ds-alias-space-2xl-device);padding-bottom:var(--ds-alias-space-2xl-device)}.stack.p-none,.stack-content.p-none{padding:0}.stack.px-none,.stack-content.px-none{padding-left:0;padding-right:0}.stack.py-none,.stack-content.py-none{padding-top:0;padding-bottom:0}.stack.gap-auto,.stack.gap-x-auto,.stack.gap-col-auto,.stack.gap-y-auto,.stack.gap-row-auto,.stack.has-space-auto,.stack.has-space-col-auto,.stack.has-space-row-auto,.stack-content.gap-auto,.stack-content.gap-x-auto,.stack-content.gap-col-auto,.stack-content.gap-y-auto,.stack-content.gap-row-auto,.stack-content.has-space-auto,.stack-content.has-space-col-auto,.stack-content.has-space-row-auto{justify-content:space-between}.stack.gap-none,.stack.has-space-none,.stack-content.gap-none,.stack-content.has-space-none{gap:0}@media screen and (min-width: 769px){.stack.gap-none,.stack.has-space-none,.stack-content.gap-none,.stack-content.has-space-none{gap:0}}@media screen and (min-width: 1024px){.stack.gap-none,.stack.has-space-none,.stack-content.gap-none,.stack-content.has-space-none{gap:0}}.stack.gap-x-none,.stack.gap-col-none,.stack.has-space-col-none,.stack-content.gap-x-none,.stack-content.gap-col-none,.stack-content.has-space-col-none{column-gap:0}@media screen and (min-width: 769px){.stack.gap-x-none,.stack.gap-col-none,.stack.has-space-col-none,.stack-content.gap-x-none,.stack-content.gap-col-none,.stack-content.has-space-col-none{column-gap:0}}@media screen and (min-width: 1024px){.stack.gap-x-none,.stack.gap-col-none,.stack.has-space-col-none,.stack-content.gap-x-none,.stack-content.gap-col-none,.stack-content.has-space-col-none{column-gap:0}}.stack.gap-y-none,.stack.gap-row-none,.stack.has-space-row-none,.stack-content.gap-y-none,.stack-content.gap-row-none,.stack-content.has-space-row-none{row-gap:0}@media screen and (min-width: 769px){.stack.gap-y-none,.stack.gap-row-none,.stack.has-space-row-none,.stack-content.gap-y-none,.stack-content.gap-row-none,.stack-content.has-space-row-none{row-gap:0}}@media screen and (min-width: 1024px){.stack.gap-y-none,.stack.gap-row-none,.stack.has-space-row-none,.stack-content.gap-y-none,.stack-content.gap-row-none,.stack-content.has-space-row-none{row-gap:0}}.stack.gap-2xs,.stack.has-space-2xs,.stack-content.gap-2xs,.stack-content.has-space-2xs{gap:var(--ds-alias-space-2xs-device)}.stack.gap-xs,.stack.has-space-xs,.stack-content.gap-xs,.stack-content.has-space-xs{gap:var(--ds-alias-space-xs-device)}.stack.gap-sm,.stack.has-space-sm,.stack-content.gap-sm,.stack-content.has-space-sm{gap:var(--ds-alias-space-sm-device)}.stack.gap-base,.stack.has-space-base,.stack-content.gap-base,.stack-content.has-space-base{gap:var(--ds-alias-space-base-device)}.stack.gap-md,.stack.has-space-md,.stack-content.gap-md,.stack-content.has-space-md{gap:var(--ds-alias-space-md-device)}.stack.gap-lg,.stack.has-space-lg,.stack-content.gap-lg,.stack-content.has-space-lg{gap:var(--ds-alias-space-lg-device)}.stack.gap-xl,.stack.has-space-xl,.stack-content.gap-xl,.stack-content.has-space-xl{gap:var(--ds-alias-space-xl-device)}.stack.gap-2xl,.stack.has-space-2xl,.stack-content.gap-2xl,.stack-content.has-space-2xl{gap:var(--ds-alias-space-2xl-device)}.stack.gap-x-2xs,.stack.gap-col-2xs,.stack.has-space-col-2xs,.stack-content.gap-x-2xs,.stack-content.gap-col-2xs,.stack-content.has-space-col-2xs{column-gap:var(--ds-alias-space-2xs-device)}.stack.gap-x-xs,.stack.gap-col-xs,.stack.has-space-col-xs,.stack-content.gap-x-xs,.stack-content.gap-col-xs,.stack-content.has-space-col-xs{column-gap:var(--ds-alias-space-xs-device)}.stack.gap-x-sm,.stack.gap-col-sm,.stack.has-space-col-sm,.stack-content.gap-x-sm,.stack-content.gap-col-sm,.stack-content.has-space-col-sm{column-gap:var(--ds-alias-space-sm-device)}.stack.gap-x-base,.stack.gap-col-base,.stack.has-space-col-base,.stack-content.gap-x-base,.stack-content.gap-col-base,.stack-content.has-space-col-base{column-gap:var(--ds-alias-space-base-device)}.stack.gap-x-md,.stack.gap-col-md,.stack.has-space-col-md,.stack-content.gap-x-md,.stack-content.gap-col-md,.stack-content.has-space-col-md{column-gap:var(--ds-alias-space-md-device)}.stack.gap-x-lg,.stack.gap-col-lg,.stack.has-space-col-lg,.stack-content.gap-x-lg,.stack-content.gap-col-lg,.stack-content.has-space-col-lg{column-gap:var(--ds-alias-space-lg-device)}.stack.gap-x-xl,.stack.gap-col-xl,.stack.has-space-col-xl,.stack-content.gap-x-xl,.stack-content.gap-col-xl,.stack-content.has-space-col-xl{column-gap:var(--ds-alias-space-xl-device)}.stack.gap-x-2xl,.stack.gap-col-2xl,.stack.has-space-col-2xl,.stack-content.gap-x-2xl,.stack-content.gap-col-2xl,.stack-content.has-space-col-2xl{column-gap:var(--ds-alias-space-2xl-device)}.stack.gap-y-2xs,.stack.gap-row-2xs,.stack.has-space-row-2xs,.stack-content.gap-y-2xs,.stack-content.gap-row-2xs,.stack-content.has-space-row-2xs{row-gap:var(--ds-alias-space-2xs-device)}.stack.gap-y-xs,.stack.gap-row-xs,.stack.has-space-row-xs,.stack-content.gap-y-xs,.stack-content.gap-row-xs,.stack-content.has-space-row-xs{row-gap:var(--ds-alias-space-xs-device)}.stack.gap-y-sm,.stack.gap-row-sm,.stack.has-space-row-sm,.stack-content.gap-y-sm,.stack-content.gap-row-sm,.stack-content.has-space-row-sm{row-gap:var(--ds-alias-space-sm-device)}.stack.gap-y-base,.stack.gap-row-base,.stack.has-space-row-base,.stack-content.gap-y-base,.stack-content.gap-row-base,.stack-content.has-space-row-base{row-gap:var(--ds-alias-space-base-device)}.stack.gap-y-md,.stack.gap-row-md,.stack.has-space-row-md,.stack-content.gap-y-md,.stack-content.gap-row-md,.stack-content.has-space-row-md{row-gap:var(--ds-alias-space-md-device)}.stack.gap-y-lg,.stack.gap-row-lg,.stack.has-space-row-lg,.stack-content.gap-y-lg,.stack-content.gap-row-lg,.stack-content.has-space-row-lg{row-gap:var(--ds-alias-space-lg-device)}.stack.gap-y-xl,.stack.gap-row-xl,.stack.has-space-row-xl,.stack-content.gap-y-xl,.stack-content.gap-row-xl,.stack-content.has-space-row-xl{row-gap:var(--ds-alias-space-xl-device)}.stack.gap-y-2xl,.stack.gap-row-2xl,.stack.has-space-row-2xl,.stack-content.gap-y-2xl,.stack-content.gap-row-2xl,.stack-content.has-space-row-2xl{row-gap:var(--ds-alias-space-2xl-device)}.stack>ds-radio{margin-top:-0.25rem}ds-content>ds-text,.stack-content>ds-text,ds-content>.text,.stack-content>.text,.stack>ds-text,.stack>ds-label,.stack>ds-heading,.stack>ds-heading:not(:last-child),.stack>.label,.stack>.heading,.stack>.heading:not(:last-child),.stack>.title,.stack>.title:not(:last-child),.stack>.subtitle,.stack>.subtitle:not(:last-child),.stack>.link,.stack>.is-link,.stack>p{margin:0}:host{position:static}
+.stack,.stack-content{display:flex;justify-content:flex-start;align-items:flex-start;flex-flow:column nowrap}.stack{gap:1rem}.stack-content{flex:1;height:100%;gap:.25rem}.stack>.stack,.stack>.stack-content{align-self:stretch}.stack.is-horizontal>.stack-content{align-self:center}.stack.has-wrap,.stack-content.has-wrap{flex-wrap:wrap}.stack.as-row,.stack.is-horizontal,.stack.has-direction-row,.stack-content.as-row,.stack-content.is-horizontal,.stack-content.has-direction-row{flex-flow:row nowrap;align-items:center}.stack.as-row-reverse,.stack.is-horizontal-reverse,.stack.has-direction-row-reverse,.stack-content.as-row-reverse,.stack-content.is-horizontal-reverse,.stack-content.has-direction-row-reverse{flex-flow:row-reverse nowrap;align-items:center}.stack.as-col-reverse,.stack.is-vertical-reverse,.stack.has-direction-column-reverse,.stack-content.as-col-reverse,.stack-content.is-vertical-reverse,.stack-content.has-direction-column-reverse{flex-flow:column-reverse nowrap}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-left,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-start,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-left,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-start{justify-content:flex-start;align-items:flex-start}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-center,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-center{justify-content:flex-start;align-items:center}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-right,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-end,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-right,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-top-end{justify-content:flex-start;align-items:flex-end}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-start,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-left,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-start,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-start,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-left,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-start{justify-content:center;align-items:flex-start}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center{justify-content:center;align-items:center}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-end,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-right,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-end,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-end,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-right,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-center-end{justify-content:center;align-items:flex-end}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-left,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-start,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-left,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-start{justify-content:flex-end;align-items:flex-start}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-center,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-center{justify-content:flex-end;align-items:center}.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-right,.stack:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-end,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-right,.stack-content:not(.as-row,.as-row-reverse,.has-direction-row,.has-direction-row-reverse,.is-horizontal,.is-horizontal-reverse).align-bottom-end{justify-content:flex-end;align-items:flex-end}.stack.as-row.align-top-left,.stack.as-row.align-top-start,.stack.is-horizontal.align-top-left,.stack.is-horizontal.align-top-start,.stack.has-direction-row.align-top-left,.stack.has-direction-row.align-top-start,.stack.as-row-reverse.align-top-left,.stack.as-row-reverse.align-top-start,.stack.is-horizontal-reverse.align-top-left,.stack.is-horizontal-reverse.align-top-start,.stack.has-direction-row-reverse.align-top-left,.stack.has-direction-row-reverse.align-top-start,.stack-content.as-row.align-top-left,.stack-content.as-row.align-top-start,.stack-content.is-horizontal.align-top-left,.stack-content.is-horizontal.align-top-start,.stack-content.has-direction-row.align-top-left,.stack-content.has-direction-row.align-top-start,.stack-content.as-row-reverse.align-top-left,.stack-content.as-row-reverse.align-top-start,.stack-content.is-horizontal-reverse.align-top-left,.stack-content.is-horizontal-reverse.align-top-start,.stack-content.has-direction-row-reverse.align-top-left,.stack-content.has-direction-row-reverse.align-top-start{align-items:flex-start;justify-content:flex-start}.stack.as-row.align-top,.stack.as-row.align-top-center,.stack.is-horizontal.align-top,.stack.is-horizontal.align-top-center,.stack.has-direction-row.align-top,.stack.has-direction-row.align-top-center,.stack.as-row-reverse.align-top,.stack.as-row-reverse.align-top-center,.stack.is-horizontal-reverse.align-top,.stack.is-horizontal-reverse.align-top-center,.stack.has-direction-row-reverse.align-top,.stack.has-direction-row-reverse.align-top-center,.stack-content.as-row.align-top,.stack-content.as-row.align-top-center,.stack-content.is-horizontal.align-top,.stack-content.is-horizontal.align-top-center,.stack-content.has-direction-row.align-top,.stack-content.has-direction-row.align-top-center,.stack-content.as-row-reverse.align-top,.stack-content.as-row-reverse.align-top-center,.stack-content.is-horizontal-reverse.align-top,.stack-content.is-horizontal-reverse.align-top-center,.stack-content.has-direction-row-reverse.align-top,.stack-content.has-direction-row-reverse.align-top-center{align-items:flex-start;justify-content:center}.stack.as-row.align-top-right,.stack.as-row.align-top-end,.stack.is-horizontal.align-top-right,.stack.is-horizontal.align-top-end,.stack.has-direction-row.align-top-right,.stack.has-direction-row.align-top-end,.stack.as-row-reverse.align-top-right,.stack.as-row-reverse.align-top-end,.stack.is-horizontal-reverse.align-top-right,.stack.is-horizontal-reverse.align-top-end,.stack.has-direction-row-reverse.align-top-right,.stack.has-direction-row-reverse.align-top-end,.stack-content.as-row.align-top-right,.stack-content.as-row.align-top-end,.stack-content.is-horizontal.align-top-right,.stack-content.is-horizontal.align-top-end,.stack-content.has-direction-row.align-top-right,.stack-content.has-direction-row.align-top-end,.stack-content.as-row-reverse.align-top-right,.stack-content.as-row-reverse.align-top-end,.stack-content.is-horizontal-reverse.align-top-right,.stack-content.is-horizontal-reverse.align-top-end,.stack-content.has-direction-row-reverse.align-top-right,.stack-content.has-direction-row-reverse.align-top-end{align-items:flex-start;justify-content:flex-end}.stack.as-row.align-start,.stack.as-row.align-center-left,.stack.as-row.align-center-start,.stack.is-horizontal.align-start,.stack.is-horizontal.align-center-left,.stack.is-horizontal.align-center-start,.stack.has-direction-row.align-start,.stack.has-direction-row.align-center-left,.stack.has-direction-row.align-center-start,.stack.as-row-reverse.align-start,.stack.as-row-reverse.align-center-left,.stack.as-row-reverse.align-center-start,.stack.is-horizontal-reverse.align-start,.stack.is-horizontal-reverse.align-center-left,.stack.is-horizontal-reverse.align-center-start,.stack.has-direction-row-reverse.align-start,.stack.has-direction-row-reverse.align-center-left,.stack.has-direction-row-reverse.align-center-start,.stack-content.as-row.align-start,.stack-content.as-row.align-center-left,.stack-content.as-row.align-center-start,.stack-content.is-horizontal.align-start,.stack-content.is-horizontal.align-center-left,.stack-content.is-horizontal.align-center-start,.stack-content.has-direction-row.align-start,.stack-content.has-direction-row.align-center-left,.stack-content.has-direction-row.align-center-start,.stack-content.as-row-reverse.align-start,.stack-content.as-row-reverse.align-center-left,.stack-content.as-row-reverse.align-center-start,.stack-content.is-horizontal-reverse.align-start,.stack-content.is-horizontal-reverse.align-center-left,.stack-content.is-horizontal-reverse.align-center-start,.stack-content.has-direction-row-reverse.align-start,.stack-content.has-direction-row-reverse.align-center-left,.stack-content.has-direction-row-reverse.align-center-start{align-items:center;justify-content:flex-start}.stack.as-row.align-center,.stack.is-horizontal.align-center,.stack.has-direction-row.align-center,.stack.as-row-reverse.align-center,.stack.is-horizontal-reverse.align-center,.stack.has-direction-row-reverse.align-center,.stack-content.as-row.align-center,.stack-content.is-horizontal.align-center,.stack-content.has-direction-row.align-center,.stack-content.as-row-reverse.align-center,.stack-content.is-horizontal-reverse.align-center,.stack-content.has-direction-row-reverse.align-center{align-items:center;justify-content:center}.stack.as-row.align-end,.stack.as-row.align-center-right,.stack.as-row.align-center-end,.stack.is-horizontal.align-end,.stack.is-horizontal.align-center-right,.stack.is-horizontal.align-center-end,.stack.has-direction-row.align-end,.stack.has-direction-row.align-center-right,.stack.has-direction-row.align-center-end,.stack.as-row-reverse.align-end,.stack.as-row-reverse.align-center-right,.stack.as-row-reverse.align-center-end,.stack.is-horizontal-reverse.align-end,.stack.is-horizontal-reverse.align-center-right,.stack.is-horizontal-reverse.align-center-end,.stack.has-direction-row-reverse.align-end,.stack.has-direction-row-reverse.align-center-right,.stack.has-direction-row-reverse.align-center-end,.stack-content.as-row.align-end,.stack-content.as-row.align-center-right,.stack-content.as-row.align-center-end,.stack-content.is-horizontal.align-end,.stack-content.is-horizontal.align-center-right,.stack-content.is-horizontal.align-center-end,.stack-content.has-direction-row.align-end,.stack-content.has-direction-row.align-center-right,.stack-content.has-direction-row.align-center-end,.stack-content.as-row-reverse.align-end,.stack-content.as-row-reverse.align-center-right,.stack-content.as-row-reverse.align-center-end,.stack-content.is-horizontal-reverse.align-end,.stack-content.is-horizontal-reverse.align-center-right,.stack-content.is-horizontal-reverse.align-center-end,.stack-content.has-direction-row-reverse.align-end,.stack-content.has-direction-row-reverse.align-center-right,.stack-content.has-direction-row-reverse.align-center-end{align-items:center;justify-content:flex-end}.stack.as-row.align-bottom-left,.stack.as-row.align-bottom-start,.stack.is-horizontal.align-bottom-left,.stack.is-horizontal.align-bottom-start,.stack.has-direction-row.align-bottom-left,.stack.has-direction-row.align-bottom-start,.stack.as-row-reverse.align-bottom-left,.stack.as-row-reverse.align-bottom-start,.stack.is-horizontal-reverse.align-bottom-left,.stack.is-horizontal-reverse.align-bottom-start,.stack.has-direction-row-reverse.align-bottom-left,.stack.has-direction-row-reverse.align-bottom-start,.stack-content.as-row.align-bottom-left,.stack-content.as-row.align-bottom-start,.stack-content.is-horizontal.align-bottom-left,.stack-content.is-horizontal.align-bottom-start,.stack-content.has-direction-row.align-bottom-left,.stack-content.has-direction-row.align-bottom-start,.stack-content.as-row-reverse.align-bottom-left,.stack-content.as-row-reverse.align-bottom-start,.stack-content.is-horizontal-reverse.align-bottom-left,.stack-content.is-horizontal-reverse.align-bottom-start,.stack-content.has-direction-row-reverse.align-bottom-left,.stack-content.has-direction-row-reverse.align-bottom-start{align-items:flex-end;justify-content:flex-start}.stack.as-row.align-bottom,.stack.as-row.align-bottom-center,.stack.is-horizontal.align-bottom,.stack.is-horizontal.align-bottom-center,.stack.has-direction-row.align-bottom,.stack.has-direction-row.align-bottom-center,.stack.as-row-reverse.align-bottom,.stack.as-row-reverse.align-bottom-center,.stack.is-horizontal-reverse.align-bottom,.stack.is-horizontal-reverse.align-bottom-center,.stack.has-direction-row-reverse.align-bottom,.stack.has-direction-row-reverse.align-bottom-center,.stack-content.as-row.align-bottom,.stack-content.as-row.align-bottom-center,.stack-content.is-horizontal.align-bottom,.stack-content.is-horizontal.align-bottom-center,.stack-content.has-direction-row.align-bottom,.stack-content.has-direction-row.align-bottom-center,.stack-content.as-row-reverse.align-bottom,.stack-content.as-row-reverse.align-bottom-center,.stack-content.is-horizontal-reverse.align-bottom,.stack-content.is-horizontal-reverse.align-bottom-center,.stack-content.has-direction-row-reverse.align-bottom,.stack-content.has-direction-row-reverse.align-bottom-center{align-items:flex-end;justify-content:center}.stack.as-row.align-bottom-right,.stack.as-row.align-bottom-end,.stack.is-horizontal.align-bottom-right,.stack.is-horizontal.align-bottom-end,.stack.has-direction-row.align-bottom-right,.stack.has-direction-row.align-bottom-end,.stack.as-row-reverse.align-bottom-right,.stack.as-row-reverse.align-bottom-end,.stack.is-horizontal-reverse.align-bottom-right,.stack.is-horizontal-reverse.align-bottom-end,.stack.has-direction-row-reverse.align-bottom-right,.stack.has-direction-row-reverse.align-bottom-end,.stack-content.as-row.align-bottom-right,.stack-content.as-row.align-bottom-end,.stack-content.is-horizontal.align-bottom-right,.stack-content.is-horizontal.align-bottom-end,.stack-content.has-direction-row.align-bottom-right,.stack-content.has-direction-row.align-bottom-end,.stack-content.as-row-reverse.align-bottom-right,.stack-content.as-row-reverse.align-bottom-end,.stack-content.is-horizontal-reverse.align-bottom-right,.stack-content.is-horizontal-reverse.align-bottom-end,.stack-content.has-direction-row-reverse.align-bottom-right,.stack-content.has-direction-row-reverse.align-bottom-end{align-items:flex-end;justify-content:flex-end}.stack-content,.stack-content.align-top-left,.stack-content.align-top-start,.stack-content.align-start,.stack-content.align-center-left,.stack-content.align-center-start,.stack-content.align-bottom-left,.stack-content.align-bottom-start{text-align:left}.stack-content.align-top,.stack-content.align-top-center,.stack-content.align-center,.stack-content.align-bottom,.stack-content.align-bottom-center{text-align:center}.stack-content.align-top-right,.stack-content.align-top-end,.stack-content.align-end,.stack-content.align-center-right,.stack-content.align-center-end,.stack-content.align-bottom-right,.stack-content.align-bottom-end{text-align:right}.stack-content.text-left{text-align:left !important}.stack-content.text-center{text-align:center !important}.stack-content.text-right{text-align:right !important}.stack.fit-content,.stack-content.fit-content{flex:unset;width:fit-content}.stack.p-2xs,.stack-content.p-2xs{padding:var(--ds-alias-space-2xs-device)}.stack.p-xs,.stack-content.p-xs{padding:var(--ds-alias-space-xs-device)}.stack.p-sm,.stack-content.p-sm{padding:var(--ds-alias-space-sm-device)}.stack.p-base,.stack-content.p-base{padding:var(--ds-alias-space-base-device)}.stack.p-md,.stack-content.p-md{padding:var(--ds-alias-space-md-device)}.stack.p-lg,.stack-content.p-lg{padding:var(--ds-alias-space-lg-device)}.stack.p-xl,.stack-content.p-xl{padding:var(--ds-alias-space-xl-device)}.stack.p-2xl,.stack-content.p-2xl{padding:var(--ds-alias-space-2xl-device)}.stack.px-2xs,.stack-content.px-2xs{padding-left:var(--ds-alias-space-2xs-device);padding-right:var(--ds-alias-space-2xs-device)}.stack.px-xs,.stack-content.px-xs{padding-left:var(--ds-alias-space-xs-device);padding-right:var(--ds-alias-space-xs-device)}.stack.px-sm,.stack-content.px-sm{padding-left:var(--ds-alias-space-sm-device);padding-right:var(--ds-alias-space-sm-device)}.stack.px-base,.stack-content.px-base{padding-left:var(--ds-alias-space-base-device);padding-right:var(--ds-alias-space-base-device)}.stack.px-md,.stack-content.px-md{padding-left:var(--ds-alias-space-md-device);padding-right:var(--ds-alias-space-md-device)}.stack.px-lg,.stack-content.px-lg{padding-left:var(--ds-alias-space-lg-device);padding-right:var(--ds-alias-space-lg-device)}.stack.px-xl,.stack-content.px-xl{padding-left:var(--ds-alias-space-xl-device);padding-right:var(--ds-alias-space-xl-device)}.stack.px-2xl,.stack-content.px-2xl{padding-left:var(--ds-alias-space-2xl-device);padding-right:var(--ds-alias-space-2xl-device)}.stack.py-2xs,.stack-content.py-2xs{padding-top:var(--ds-alias-space-2xs-device);padding-bottom:var(--ds-alias-space-2xs-device)}.stack.py-xs,.stack-content.py-xs{padding-top:var(--ds-alias-space-xs-device);padding-bottom:var(--ds-alias-space-xs-device)}.stack.py-sm,.stack-content.py-sm{padding-top:var(--ds-alias-space-sm-device);padding-bottom:var(--ds-alias-space-sm-device)}.stack.py-base,.stack-content.py-base{padding-top:var(--ds-alias-space-base-device);padding-bottom:var(--ds-alias-space-base-device)}.stack.py-md,.stack-content.py-md{padding-top:var(--ds-alias-space-md-device);padding-bottom:var(--ds-alias-space-md-device)}.stack.py-lg,.stack-content.py-lg{padding-top:var(--ds-alias-space-lg-device);padding-bottom:var(--ds-alias-space-lg-device)}.stack.py-xl,.stack-content.py-xl{padding-top:var(--ds-alias-space-xl-device);padding-bottom:var(--ds-alias-space-xl-device)}.stack.py-2xl,.stack-content.py-2xl{padding-top:var(--ds-alias-space-2xl-device);padding-bottom:var(--ds-alias-space-2xl-device)}.stack.p-none,.stack-content.p-none{padding:0}.stack.px-none,.stack-content.px-none{padding-left:0;padding-right:0}.stack.py-none,.stack-content.py-none{padding-top:0;padding-bottom:0}.stack.gap-auto,.stack.gap-x-auto,.stack.gap-col-auto,.stack.gap-y-auto,.stack.gap-row-auto,.stack.has-space-auto,.stack.has-space-col-auto,.stack.has-space-row-auto,.stack-content.gap-auto,.stack-content.gap-x-auto,.stack-content.gap-col-auto,.stack-content.gap-y-auto,.stack-content.gap-row-auto,.stack-content.has-space-auto,.stack-content.has-space-col-auto,.stack-content.has-space-row-auto{justify-content:space-between}.stack.gap-none,.stack.has-space-none,.stack-content.gap-none,.stack-content.has-space-none{gap:0}@media screen and (min-width: 769px){.stack.gap-none,.stack.has-space-none,.stack-content.gap-none,.stack-content.has-space-none{gap:0}}@media screen and (min-width: 1024px){.stack.gap-none,.stack.has-space-none,.stack-content.gap-none,.stack-content.has-space-none{gap:0}}.stack.gap-x-none,.stack.gap-col-none,.stack.has-space-col-none,.stack-content.gap-x-none,.stack-content.gap-col-none,.stack-content.has-space-col-none{column-gap:0}@media screen and (min-width: 769px){.stack.gap-x-none,.stack.gap-col-none,.stack.has-space-col-none,.stack-content.gap-x-none,.stack-content.gap-col-none,.stack-content.has-space-col-none{column-gap:0}}@media screen and (min-width: 1024px){.stack.gap-x-none,.stack.gap-col-none,.stack.has-space-col-none,.stack-content.gap-x-none,.stack-content.gap-col-none,.stack-content.has-space-col-none{column-gap:0}}.stack.gap-y-none,.stack.gap-row-none,.stack.has-space-row-none,.stack-content.gap-y-none,.stack-content.gap-row-none,.stack-content.has-space-row-none{row-gap:0}@media screen and (min-width: 769px){.stack.gap-y-none,.stack.gap-row-none,.stack.has-space-row-none,.stack-content.gap-y-none,.stack-content.gap-row-none,.stack-content.has-space-row-none{row-gap:0}}@media screen and (min-width: 1024px){.stack.gap-y-none,.stack.gap-row-none,.stack.has-space-row-none,.stack-content.gap-y-none,.stack-content.gap-row-none,.stack-content.has-space-row-none{row-gap:0}}.stack.gap-2xs,.stack.has-space-2xs,.stack-content.gap-2xs,.stack-content.has-space-2xs{gap:var(--ds-alias-space-2xs-device)}.stack.gap-xs,.stack.has-space-xs,.stack-content.gap-xs,.stack-content.has-space-xs{gap:var(--ds-alias-space-xs-device)}.stack.gap-sm,.stack.has-space-sm,.stack-content.gap-sm,.stack-content.has-space-sm{gap:var(--ds-alias-space-sm-device)}.stack.gap-base,.stack.has-space-base,.stack-content.gap-base,.stack-content.has-space-base{gap:var(--ds-alias-space-base-device)}.stack.gap-md,.stack.has-space-md,.stack-content.gap-md,.stack-content.has-space-md{gap:var(--ds-alias-space-md-device)}.stack.gap-lg,.stack.has-space-lg,.stack-content.gap-lg,.stack-content.has-space-lg{gap:var(--ds-alias-space-lg-device)}.stack.gap-xl,.stack.has-space-xl,.stack-content.gap-xl,.stack-content.has-space-xl{gap:var(--ds-alias-space-xl-device)}.stack.gap-2xl,.stack.has-space-2xl,.stack-content.gap-2xl,.stack-content.has-space-2xl{gap:var(--ds-alias-space-2xl-device)}.stack.gap-x-2xs,.stack.gap-col-2xs,.stack.has-space-col-2xs,.stack-content.gap-x-2xs,.stack-content.gap-col-2xs,.stack-content.has-space-col-2xs{column-gap:var(--ds-alias-space-2xs-device)}.stack.gap-x-xs,.stack.gap-col-xs,.stack.has-space-col-xs,.stack-content.gap-x-xs,.stack-content.gap-col-xs,.stack-content.has-space-col-xs{column-gap:var(--ds-alias-space-xs-device)}.stack.gap-x-sm,.stack.gap-col-sm,.stack.has-space-col-sm,.stack-content.gap-x-sm,.stack-content.gap-col-sm,.stack-content.has-space-col-sm{column-gap:var(--ds-alias-space-sm-device)}.stack.gap-x-base,.stack.gap-col-base,.stack.has-space-col-base,.stack-content.gap-x-base,.stack-content.gap-col-base,.stack-content.has-space-col-base{column-gap:var(--ds-alias-space-base-device)}.stack.gap-x-md,.stack.gap-col-md,.stack.has-space-col-md,.stack-content.gap-x-md,.stack-content.gap-col-md,.stack-content.has-space-col-md{column-gap:var(--ds-alias-space-md-device)}.stack.gap-x-lg,.stack.gap-col-lg,.stack.has-space-col-lg,.stack-content.gap-x-lg,.stack-content.gap-col-lg,.stack-content.has-space-col-lg{column-gap:var(--ds-alias-space-lg-device)}.stack.gap-x-xl,.stack.gap-col-xl,.stack.has-space-col-xl,.stack-content.gap-x-xl,.stack-content.gap-col-xl,.stack-content.has-space-col-xl{column-gap:var(--ds-alias-space-xl-device)}.stack.gap-x-2xl,.stack.gap-col-2xl,.stack.has-space-col-2xl,.stack-content.gap-x-2xl,.stack-content.gap-col-2xl,.stack-content.has-space-col-2xl{column-gap:var(--ds-alias-space-2xl-device)}.stack.gap-y-2xs,.stack.gap-row-2xs,.stack.has-space-row-2xs,.stack-content.gap-y-2xs,.stack-content.gap-row-2xs,.stack-content.has-space-row-2xs{row-gap:var(--ds-alias-space-2xs-device)}.stack.gap-y-xs,.stack.gap-row-xs,.stack.has-space-row-xs,.stack-content.gap-y-xs,.stack-content.gap-row-xs,.stack-content.has-space-row-xs{row-gap:var(--ds-alias-space-xs-device)}.stack.gap-y-sm,.stack.gap-row-sm,.stack.has-space-row-sm,.stack-content.gap-y-sm,.stack-content.gap-row-sm,.stack-content.has-space-row-sm{row-gap:var(--ds-alias-space-sm-device)}.stack.gap-y-base,.stack.gap-row-base,.stack.has-space-row-base,.stack-content.gap-y-base,.stack-content.gap-row-base,.stack-content.has-space-row-base{row-gap:var(--ds-alias-space-base-device)}.stack.gap-y-md,.stack.gap-row-md,.stack.has-space-row-md,.stack-content.gap-y-md,.stack-content.gap-row-md,.stack-content.has-space-row-md{row-gap:var(--ds-alias-space-md-device)}.stack.gap-y-lg,.stack.gap-row-lg,.stack.has-space-row-lg,.stack-content.gap-y-lg,.stack-content.gap-row-lg,.stack-content.has-space-row-lg{row-gap:var(--ds-alias-space-lg-device)}.stack.gap-y-xl,.stack.gap-row-xl,.stack.has-space-row-xl,.stack-content.gap-y-xl,.stack-content.gap-row-xl,.stack-content.has-space-row-xl{row-gap:var(--ds-alias-space-xl-device)}.stack.gap-y-2xl,.stack.gap-row-2xl,.stack.has-space-row-2xl,.stack-content.gap-y-2xl,.stack-content.gap-row-2xl,.stack-content.has-space-row-2xl{row-gap:var(--ds-alias-space-2xl-device)}.stack>ds-radio{margin-top:-0.25rem}ds-content>ds-text,.stack-content>ds-text,ds-content>.text,.stack-content>.text,.stack>ds-text,.stack>ds-label,.stack>ds-heading,.stack>ds-heading:not(:last-child),.stack>.label,.stack>.heading,.stack>.heading:not(:last-child),.stack>.title,.stack>.title:not(:last-child),.stack>.subtitle,.stack>.subtitle:not(:last-child),.stack>.link,.stack>.is-link,.stack>p{margin:0}:host{position:static}

package/dist/collection/components/stack/stack.interfaces.js

@@ -46,7 +46,6 @@ export const STACK_PADDINGS = [
     'xx-large',
 ];
 export const STACK_ALIGNMENTS = [
-    '',
     'top start',
     'top center',
     'top end',
@@ -57,4 +56,4 @@ export const STACK_ALIGNMENTS = [
     'bottom center',
     'bottom end',
 ];
-export const STACK_DIRECTIONS = ['', 'row', 'column', 'row-reverse', 'column-reverse'];
+export const STACK_DIRECTIONS = ['row', 'column', 'row-reverse', 'column-reverse'];

package/dist/collection/components/stack/stack.js

@@ -12,23 +12,6 @@ import { STACK_SPACES, STACK_PADDINGS, STACK_ALIGNMENTS, STACK_DIRECTIONS, } fro
  */
 export class Stack {
     constructor() {
-        /**
-         * PUBLIC PROPERTY API
-         * ------------------------------------------------------
-         */
-        /**
-         * Defines the text positioning like center, right or default to start.
-         */
-        this.align = '';
-        /**
-         * @internal
-         * Please use align instead.
-         */
-        this.alignment = '';
-        /**
-         * Defines the direction of the child elements. Default is column.
-         */
-        this.direction = '';
         /**
          * Defines the width of the stack to be exactly the width of the content.
          */
@@ -62,11 +45,11 @@ export class Stack {
         const p = normalizeDeprecatedTShirtSize(this.p) || '';
         const px = normalizeDeprecatedTShirtSize(this.px) || '';
         const py = normalizeDeprecatedTShirtSize(this.py) || '';
-        let alignValue = hasValue(this.align) ? this.align.split(' ').join('-') : undefined;
-        if (hasValue(this.alignment)) {
+        let alignValue = this.align ? this.align.split(' ').join('-') : undefined;
+        if (this.alignment) {
             alignValue = this.alignment.split(' ').join('-');
         }
-        return (h(Host, { key: 'a5289c398e7099be2acc01e0860094b35c41f275', class: {
+        return (h(Host, { key: 'dd0bd9e7c80b67577eb65ff49703788eff026835', class: {
                 'stack': true,
                 'as-row': this.direction === 'row',
                 'as-col': this.direction === 'column',
@@ -79,7 +62,7 @@ export class Stack {
                 [`p-${p}`]: hasValue(this.p),
                 [`px-${px}`]: hasValue(this.px),
                 [`py-${py}`]: hasValue(this.py),
-            } }, h("slot", { key: '2ea7be17d54af58bcaff6b452c8c656ce43cb441' })));
+            } }, h("slot", { key: 'efab6583321216d1b9674b3d959ca347d9aacfb6' })));
     }
     static get is() { return "ds-stack"; }
     static get originalStyleUrls() {
@@ -99,7 +82,7 @@ export class Stack {
                 "mutable": false,
                 "complexType": {
                     "original": "StackAlignment",
-                    "resolved": "\"\" | \"bottom center\" | \"bottom end\" | \"bottom start\" | \"center\" | \"end\" | \"start\" | \"top center\" | \"top end\" | \"top start\"",
+                    "resolved": "\"bottom center\" | \"bottom end\" | \"bottom start\" | \"center\" | \"end\" | \"start\" | \"top center\" | \"top end\" | \"top start\" | undefined",
                     "references": {
                         "StackAlignment": {
                             "location": "import",
@@ -110,7 +93,7 @@ export class Stack {
                     }
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": "Defines the text positioning like center, right or default to start."
@@ -118,15 +101,14 @@ export class Stack {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "attribute": "align",
-                "defaultValue": "''"
+                "attribute": "align"
             },
             "alignment": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
                     "original": "StackAlignment",
-                    "resolved": "\"\" | \"bottom center\" | \"bottom end\" | \"bottom start\" | \"center\" | \"end\" | \"start\" | \"top center\" | \"top end\" | \"top start\"",
+                    "resolved": "\"bottom center\" | \"bottom end\" | \"bottom start\" | \"center\" | \"end\" | \"start\" | \"top center\" | \"top end\" | \"top start\" | undefined",
                     "references": {
                         "StackAlignment": {
                             "location": "import",
@@ -137,7 +119,7 @@ export class Stack {
                     }
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [{
                             "name": "internal",
@@ -148,15 +130,14 @@ export class Stack {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "attribute": "alignment",
-                "defaultValue": "''"
+                "attribute": "alignment"
             },
             "direction": {
                 "type": "string",
                 "mutable": true,
                 "complexType": {
                     "original": "StackDirection",
-                    "resolved": "\"\" | \"column\" | \"column-reverse\" | \"row\" | \"row-reverse\"",
+                    "resolved": "\"column\" | \"column-reverse\" | \"row\" | \"row-reverse\" | undefined",
                     "references": {
                         "StackDirection": {
                             "location": "import",
@@ -167,7 +148,7 @@ export class Stack {
                     }
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": "Defines the direction of the child elements. Default is column."
@@ -175,8 +156,7 @@ export class Stack {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "attribute": "direction",
-                "defaultValue": "''"
+                "attribute": "direction"
             },
             "fitContent": {
                 "type": "boolean",

package/dist/collection/components/tag/tag.host.css

@@ -1 +1 @@
-:host{--_tag-position: var(--tag-position, var(--mod-tag-position, static));--_tag-top: var(--tag-top, var(--mod-tag-top));--_tag-right: var(--tag-right, var(--mod-tag-right));--_tag-bottom: var(--tag-bottom, var(--mod-tag-bottom));--_tag-left: var(--tag-left, var(--mod-tag-left));position:var(--_tag-position);top:var(--_tag-top);right:var(--_tag-right);bottom:var(--_tag-bottom);left:var(--_tag-left);--_tag-m: var(--tag-m, var(--mod-tag-m, 0));--_tag-my: var(--tag-my, var(--mod-tag-my));--_tag-mx: var(--tag-mx, var(--mod-tag-mx));--_tag-ml: var(--tag-ml, var(--mod-tag-ml));--_tag-mr: var(--tag-mr, var(--mod-tag-mr));--_tag-mt: var(--tag-mt, var(--mod-tag-mt));--_tag-mb: var(--tag-mb, var(--mod-tag-mb));margin:var(--_tag-m);margin-inline:var(--_tag-mx);margin-block:var(--_tag-my);margin-left:var(--_tag-ml);margin-right:var(--_tag-mr);margin-top:var(--_tag-mt);margin-bottom:var(--_tag-mb);--_tag-min-height: var(--tag-min-height, var(--mod-tag-min-height, 2rem));--_tag-gap: var(--tag-gap, var(--mod-tag-gap, 0.25rem));--_tag-px: var(--tag-px, var(--mod-tag-px, var(--ds-tag-space-padding-x-base)));--_tag-py: var(--tag-py, var(--mod-tag-py, var(--ds-tag-space-padding-y-base)));--_tag-radius: var(--tag-radius, var(--mod-tag-radius, var(--ds-tag-radius-base)));--_tag-color: var(--tag-color, var(--mod-tag-color, var(--ds-tag-default-color-text-base)));--_tag-bg: var(--tag-bg, var(--mod-tag-bg, var(--ds-tag-default-color-bg-base)));--_tag-line-height: var(--tag-line-height, var(--mod-tag-line-height, 1));--_tag-font-family: var(--tag-font-family, var(--mod-tag-font-family, var(--ds-tag-font-family)));--_tag-font-size: var(--tag-font-size, var(--mod-tag-font-size, var(--ds-tag-font-size-base)));--_tag-font-weight: var(--tag-font-weight, var(--mod-tag-font-weight, var(--ds-tag-font-weight-base)));--_tag-close-mr: var(--tag-close-mr, var(--mod-tag-close-mr, -0.25rem))}:host{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;display:inline-flex;align-items:center;justify-content:center;vertical-align:bottom;box-sizing:border-box;gap:var(--_tag-gap);width:fit-content;min-height:var(--_tag-min-height);padding-block:var(--_tag-py);padding-inline:var(--_tag-px);border-radius:var(--_tag-radius);color:var(--_tag-color);background-color:var(--_tag-bg);font-family:var(--_tag-font-family);line-height:var(--_tag-line-height);font-size:var(--_tag-font-size);font-weight:var(--_tag-font-weight)}:host>.close,:host>ds-close{--close-mr: var(--_tag-close-mr)}:host>ds-icon{--icon-size: 0.875rem}:host::part(label){display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;gap:var(--_tag-gap)}:host(.is-primary){--icon-color: var(--ds-tag-primary-color-text-base);--mod-tag-color: var(--ds-tag-primary-color-text-base);--mod-tag-bg: var(--ds-tag-primary-color-bg-base)}:host(.is-grey){--icon-color: var(--ds-tag-grey-color-text-base);--mod-tag-color: var(--ds-tag-grey-color-text-base);--mod-tag-bg: var(--ds-tag-grey-color-bg-base)}:host(.is-success){--icon-color: var(--ds-tag-success-color-text-base);--mod-tag-color: var(--ds-tag-success-color-text-base);--mod-tag-bg: var(--ds-tag-success-color-bg-base)}:host(.is-info){--icon-color: var(--ds-tag-info-color-text-base);--mod-tag-color: var(--ds-tag-info-color-text-base);--mod-tag-bg: var(--ds-tag-info-color-bg-base)}:host(.is-warning){--icon-color: var(--ds-tag-warning-color-text-base);--mod-tag-color: var(--ds-tag-warning-color-text-base);--mod-tag-bg: var(--ds-tag-warning-color-bg-base)}:host(.is-danger){--icon-color: var(--ds-tag-danger-color-text-base);--mod-tag-color: var(--ds-tag-danger-color-text-base);--mod-tag-bg: var(--ds-tag-danger-color-bg-base)}:host(.is-purple){--icon-color: var(--ds-tag-purple-color-text-base);--mod-tag-color: var(--ds-tag-purple-color-text-base);--mod-tag-bg: var(--ds-tag-purple-color-bg-base)}:host(.is-red){--icon-color: var(--ds-tag-red-color-text-base);--mod-tag-color: var(--ds-tag-red-color-text-base);--mod-tag-bg: var(--ds-tag-red-color-bg-base)}:host(.is-yellow){--icon-color: var(--ds-tag-yellow-color-text-base);--mod-tag-color: var(--ds-tag-yellow-color-text-base);--mod-tag-bg: var(--ds-tag-yellow-color-bg-base)}:host(.is-green){--icon-color: var(--ds-tag-green-color-text-base);--mod-tag-color: var(--ds-tag-green-color-text-base);--mod-tag-bg: var(--ds-tag-green-color-bg-base)}:host(.is-purple-dark){--icon-color: var(--ds-tag-purple-dark-color-text-base);--mod-tag-color: var(--ds-tag-purple-dark-color-text-base);--mod-tag-bg: var(--ds-tag-purple-dark-color-bg-base)}:host(.is-red-dark){--icon-color: var(--ds-tag-red-dark-color-text-base);--mod-tag-color: var(--ds-tag-red-dark-color-text-base);--mod-tag-bg: var(--ds-tag-red-dark-color-bg-base)}:host(.is-yellow-dark){--icon-color: var(--ds-tag-yellow-dark-color-text-base);--mod-tag-color: var(--ds-tag-yellow-dark-color-text-base);--mod-tag-bg: var(--ds-tag-yellow-dark-color-bg-base)}:host(.is-green-dark){--icon-color: var(--ds-tag-green-dark-color-text-base);--mod-tag-color: var(--ds-tag-green-dark-color-text-base);--mod-tag-bg: var(--ds-tag-green-dark-color-bg-base)}:host(.is-purple-light){--icon-color: var(--ds-tag-purple-light-color-text-base);--mod-tag-color: var(--ds-tag-purple-light-color-text-base);--mod-tag-bg: var(--ds-tag-purple-light-color-bg-base)}:host(.is-red-light){--icon-color: var(--ds-tag-red-light-color-text-base);--mod-tag-color: var(--ds-tag-red-light-color-text-base);--mod-tag-bg: var(--ds-tag-red-light-color-bg-base)}:host(.is-yellow-light){--icon-color: var(--ds-tag-yellow-light-color-text-base);--mod-tag-color: var(--ds-tag-yellow-light-color-text-base);--mod-tag-bg: var(--ds-tag-yellow-light-color-bg-base)}:host(.is-green-light){--icon-color: var(--ds-tag-green-light-color-text-base);--mod-tag-color: var(--ds-tag-green-light-color-text-base);--mod-tag-bg: var(--ds-tag-green-light-color-bg-base)}:host(.is-primary){--close-color-icon: var(--ds-close-color-icon-inverted);--close-color-background-hover: var(--ds-close-color-background-inverted-hover);--close-color-background-active: var(--ds-close-color-background-inverted-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-grey){--close-color-icon: var(--ds-close-color-icon-inverted);--close-color-background-hover: var(--ds-close-color-background-inverted-hover);--close-color-background-active: var(--ds-close-color-background-inverted-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-info){--close-color-icon: var(--ds-close-color-icon-inverted);--close-color-background-hover: var(--ds-close-color-background-inverted-hover);--close-color-background-active: var(--ds-close-color-background-inverted-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-success){--close-color-icon: var(--ds-close-color-icon-inverted);--close-color-background-hover: var(--ds-close-color-background-inverted-hover);--close-color-background-active: var(--ds-close-color-background-inverted-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-danger){--close-color-icon: var(--ds-close-color-icon-inverted);--close-color-background-hover: var(--ds-close-color-background-inverted-hover);--close-color-background-active: var(--ds-close-color-background-inverted-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-purple-dark){--close-color-icon: var(--ds-close-color-icon-inverted);--close-color-background-hover: var(--ds-close-color-background-inverted-hover);--close-color-background-active: var(--ds-close-color-background-inverted-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-red-dark){--close-color-icon: var(--ds-close-color-icon-inverted);--close-color-background-hover: var(--ds-close-color-background-inverted-hover);--close-color-background-active: var(--ds-close-color-background-inverted-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-yellow-dark){--close-color-icon: var(--ds-close-color-icon-inverted);--close-color-background-hover: var(--ds-close-color-background-inverted-hover);--close-color-background-active: var(--ds-close-color-background-inverted-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-green-dark){--close-color-icon: var(--ds-close-color-icon-inverted);--close-color-background-hover: var(--ds-close-color-background-inverted-hover);--close-color-background-active: var(--ds-close-color-background-inverted-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-square){--mod-tag-radius: var(--ds-tag-radius-square)}:host(.is-pill){--mod-tag-radius: var(--ds-tag-radius-pill)}:host(.is-sm){--mod-tag-min-height: 1.5rem;--mod-tag-py: var(--ds-tag-space-padding-y-sm);--mod-tag-px: var(--ds-tag-space-padding-x-sm);--mod-tag-font-size: var(--ds-tag-font-size-sm);--mod-tag-font-weight: var(--ds-tag-font-weight-sm)}:host(.is-sm)>.close,:host(.is-sm)>ds-close{--close-padding: 0.25rem;--close-size-icon: 10px}:host(.is-md){--mod-tag-min-height: 2.5rem;--mod-tag-py: var(--ds-tag-space-padding-y-md);--mod-tag-px: var(--ds-tag-space-padding-x-md);--mod-tag-font-size: var(--ds-tag-font-size-md);--mod-tag-font-weight: var(--ds-tag-font-weight-md)}:host(.is-lg){--mod-tag-min-height: 3rem;--mod-tag-py: var(--ds-tag-space-padding-y-lg);--mod-tag-px: var(--ds-tag-space-padding-x-lg);--mod-tag-font-size: var(--ds-tag-font-size-lg);--mod-tag-font-weight: var(--ds-tag-font-weight-lg)}:host{display:inline-flex}
+:host{--_tag-position: var(--tag-position, var(--mod-tag-position, static));--_tag-top: var(--tag-top, var(--mod-tag-top));--_tag-right: var(--tag-right, var(--mod-tag-right));--_tag-bottom: var(--tag-bottom, var(--mod-tag-bottom));--_tag-left: var(--tag-left, var(--mod-tag-left));position:var(--_tag-position);top:var(--_tag-top);right:var(--_tag-right);bottom:var(--_tag-bottom);left:var(--_tag-left);--_tag-m: var(--tag-m, var(--mod-tag-m, 0));--_tag-my: var(--tag-my, var(--mod-tag-my));--_tag-mx: var(--tag-mx, var(--mod-tag-mx));--_tag-ml: var(--tag-ml, var(--mod-tag-ml));--_tag-mr: var(--tag-mr, var(--mod-tag-mr));--_tag-mt: var(--tag-mt, var(--mod-tag-mt));--_tag-mb: var(--tag-mb, var(--mod-tag-mb));margin:var(--_tag-m);margin-inline:var(--_tag-mx);margin-block:var(--_tag-my);margin-left:var(--_tag-ml);margin-right:var(--_tag-mr);margin-top:var(--_tag-mt);margin-bottom:var(--_tag-mb);--_tag-min-height: var(--tag-min-height, var(--mod-tag-min-height, 2rem));--_tag-gap: var(--tag-gap, var(--mod-tag-gap, 0.25rem));--_tag-px: var(--tag-px, var(--mod-tag-px, var(--ds-tag-space-padding-x-base)));--_tag-py: var(--tag-py, var(--mod-tag-py, var(--ds-tag-space-padding-y-base)));--_tag-radius: var(--tag-radius, var(--mod-tag-radius, var(--ds-tag-radius-base)));--_tag-color: var(--tag-color, var(--mod-tag-color, var(--ds-tag-base-color-text-base)));--_tag-bg: var(--tag-bg, var(--mod-tag-bg, var(--ds-tag-base-color-bg-base)));--_tag-line-height: var(--tag-line-height, var(--mod-tag-line-height, 1));--_tag-font-family: var(--tag-font-family, var(--mod-tag-font-family, var(--ds-tag-font-family)));--_tag-font-size: var(--tag-font-size, var(--mod-tag-font-size, var(--ds-tag-font-size-base)));--_tag-font-weight: var(--tag-font-weight, var(--mod-tag-font-weight, var(--ds-tag-font-weight-base)));--_tag-close-mr: var(--tag-close-mr, var(--mod-tag-close-mr, -0.25rem))}:host{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;display:inline-flex;align-items:center;justify-content:center;vertical-align:bottom;box-sizing:border-box;gap:var(--_tag-gap);width:fit-content;min-height:var(--_tag-min-height);padding-block:var(--_tag-py);padding-inline:var(--_tag-px);border-radius:var(--_tag-radius);color:var(--_tag-color);background-color:var(--_tag-bg);font-family:var(--_tag-font-family);line-height:var(--_tag-line-height);font-size:var(--_tag-font-size);font-weight:var(--_tag-font-weight)}:host>.close,:host>ds-close{--close-mr: var(--_tag-close-mr)}:host>ds-icon{--icon-size: 0.875rem}:host::part(label){display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;gap:var(--_tag-gap)}:host(.is-primary){--icon-color: var(--ds-tag-primary-color-text-base);--mod-tag-color: var(--ds-tag-primary-color-text-base);--mod-tag-bg: var(--ds-tag-primary-color-bg-base)}:host(.is-grey){--icon-color: var(--ds-tag-grey-color-text-base);--mod-tag-color: var(--ds-tag-grey-color-text-base);--mod-tag-bg: var(--ds-tag-grey-color-bg-base)}:host(.is-success){--icon-color: var(--ds-tag-success-color-text-base);--mod-tag-color: var(--ds-tag-success-color-text-base);--mod-tag-bg: var(--ds-tag-success-color-bg-base)}:host(.is-info){--icon-color: var(--ds-tag-info-color-text-base);--mod-tag-color: var(--ds-tag-info-color-text-base);--mod-tag-bg: var(--ds-tag-info-color-bg-base)}:host(.is-warning){--icon-color: var(--ds-tag-warning-color-text-base);--mod-tag-color: var(--ds-tag-warning-color-text-base);--mod-tag-bg: var(--ds-tag-warning-color-bg-base)}:host(.is-danger){--icon-color: var(--ds-tag-danger-color-text-base);--mod-tag-color: var(--ds-tag-danger-color-text-base);--mod-tag-bg: var(--ds-tag-danger-color-bg-base)}:host(.is-purple){--icon-color: var(--ds-tag-purple-color-text-base);--mod-tag-color: var(--ds-tag-purple-color-text-base);--mod-tag-bg: var(--ds-tag-purple-color-bg-base)}:host(.is-red){--icon-color: var(--ds-tag-red-color-text-base);--mod-tag-color: var(--ds-tag-red-color-text-base);--mod-tag-bg: var(--ds-tag-red-color-bg-base)}:host(.is-yellow){--icon-color: var(--ds-tag-yellow-color-text-base);--mod-tag-color: var(--ds-tag-yellow-color-text-base);--mod-tag-bg: var(--ds-tag-yellow-color-bg-base)}:host(.is-green){--icon-color: var(--ds-tag-green-color-text-base);--mod-tag-color: var(--ds-tag-green-color-text-base);--mod-tag-bg: var(--ds-tag-green-color-bg-base)}:host(.is-purple-dark){--icon-color: var(--ds-tag-purple-dark-color-text-base);--mod-tag-color: var(--ds-tag-purple-dark-color-text-base);--mod-tag-bg: var(--ds-tag-purple-dark-color-bg-base)}:host(.is-red-dark){--icon-color: var(--ds-tag-red-dark-color-text-base);--mod-tag-color: var(--ds-tag-red-dark-color-text-base);--mod-tag-bg: var(--ds-tag-red-dark-color-bg-base)}:host(.is-yellow-dark){--icon-color: var(--ds-tag-yellow-dark-color-text-base);--mod-tag-color: var(--ds-tag-yellow-dark-color-text-base);--mod-tag-bg: var(--ds-tag-yellow-dark-color-bg-base)}:host(.is-green-dark){--icon-color: var(--ds-tag-green-dark-color-text-base);--mod-tag-color: var(--ds-tag-green-dark-color-text-base);--mod-tag-bg: var(--ds-tag-green-dark-color-bg-base)}:host(.is-purple-light){--icon-color: var(--ds-tag-purple-light-color-text-base);--mod-tag-color: var(--ds-tag-purple-light-color-text-base);--mod-tag-bg: var(--ds-tag-purple-light-color-bg-base)}:host(.is-red-light){--icon-color: var(--ds-tag-red-light-color-text-base);--mod-tag-color: var(--ds-tag-red-light-color-text-base);--mod-tag-bg: var(--ds-tag-red-light-color-bg-base)}:host(.is-yellow-light){--icon-color: var(--ds-tag-yellow-light-color-text-base);--mod-tag-color: var(--ds-tag-yellow-light-color-text-base);--mod-tag-bg: var(--ds-tag-yellow-light-color-bg-base)}:host(.is-green-light){--icon-color: var(--ds-tag-green-light-color-text-base);--mod-tag-color: var(--ds-tag-green-light-color-text-base);--mod-tag-bg: var(--ds-tag-green-light-color-bg-base)}:host(.is-primary){--close-color-icon: var(--ds-close-inverted-icon-color-base);--close-color-background-hover: var(--ds-close-inverted-color-background-hover);--close-color-background-active: var(--ds-close-inverted-color-background-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-grey){--close-color-icon: var(--ds-close-inverted-icon-color-base);--close-color-background-hover: var(--ds-close-inverted-color-background-hover);--close-color-background-active: var(--ds-close-inverted-color-background-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-info){--close-color-icon: var(--ds-close-inverted-icon-color-base);--close-color-background-hover: var(--ds-close-inverted-color-background-hover);--close-color-background-active: var(--ds-close-inverted-color-background-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-success){--close-color-icon: var(--ds-close-inverted-icon-color-base);--close-color-background-hover: var(--ds-close-inverted-color-background-hover);--close-color-background-active: var(--ds-close-inverted-color-background-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-danger){--close-color-icon: var(--ds-close-inverted-icon-color-base);--close-color-background-hover: var(--ds-close-inverted-color-background-hover);--close-color-background-active: var(--ds-close-inverted-color-background-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-purple-dark){--close-color-icon: var(--ds-close-inverted-icon-color-base);--close-color-background-hover: var(--ds-close-inverted-color-background-hover);--close-color-background-active: var(--ds-close-inverted-color-background-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-red-dark){--close-color-icon: var(--ds-close-inverted-icon-color-base);--close-color-background-hover: var(--ds-close-inverted-color-background-hover);--close-color-background-active: var(--ds-close-inverted-color-background-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-yellow-dark){--close-color-icon: var(--ds-close-inverted-icon-color-base);--close-color-background-hover: var(--ds-close-inverted-color-background-hover);--close-color-background-active: var(--ds-close-inverted-color-background-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-green-dark){--close-color-icon: var(--ds-close-inverted-icon-color-base);--close-color-background-hover: var(--ds-close-inverted-color-background-hover);--close-color-background-active: var(--ds-close-inverted-color-background-active);--close-color-focus: var(--ds-alias-interaction-focus-color-inverted)}:host(.is-square){--mod-tag-radius: var(--ds-tag-radius-square)}:host(.is-pill){--mod-tag-radius: var(--ds-tag-radius-pill)}:host(.is-sm){--mod-tag-min-height: 1.5rem;--mod-tag-py: var(--ds-tag-space-padding-y-sm);--mod-tag-px: var(--ds-tag-space-padding-x-sm);--mod-tag-font-size: var(--ds-tag-font-size-sm);--mod-tag-font-weight: var(--ds-tag-font-weight-sm)}:host(.is-sm)>.close,:host(.is-sm)>ds-close{--close-padding: 0.25rem;--close-size-icon: 10px}:host(.is-md){--mod-tag-min-height: 2.5rem;--mod-tag-py: var(--ds-tag-space-padding-y-md);--mod-tag-px: var(--ds-tag-space-padding-x-md);--mod-tag-font-size: var(--ds-tag-font-size-md);--mod-tag-font-weight: var(--ds-tag-font-weight-md)}:host(.is-lg){--mod-tag-min-height: 3rem;--mod-tag-py: var(--ds-tag-space-padding-y-lg);--mod-tag-px: var(--ds-tag-space-padding-x-lg);--mod-tag-font-size: var(--ds-tag-font-size-lg);--mod-tag-font-weight: var(--ds-tag-font-weight-lg)}:host{display:inline-flex}

package/dist/collection/components/textarea/test/textarea.visual.play.js

@@ -3,13 +3,13 @@
  */
 import { expectScreenshot, screenshot, test } from "../../../../../../playwright/src/index";
 const TAG = 'textarea';
-const VARIANTS = ['basic', 'disabled', 'invalid', 'valid', 'warning', 'rows', 'long-content'];
+const VARIANTS = ['basic', 'disabled', 'invalid', 'invalid-slot', 'valid', 'warning', 'rows', 'long-content'];
 const image = screenshot(TAG);
 test.describe('style', () => {
     test.beforeEach('Setup', async ({ page }) => {
         await page.setupVisualTest(`/components/${TAG}/test/${TAG}.style.html`);
     });
-    VARIANTS.filter(v => !['rows', 'long-content'].includes(v)).forEach(variant => {
+    VARIANTS.filter(v => !['rows', 'long-content', 'invalid-slot'].includes(v)).forEach(variant => {
         test(variant, async ({ page }) => {
             const el = page.getByTestId(variant);
             await expectScreenshot(el, image(`style-${variant}`));

package/dist/collection/components/textarea/textarea.js

@@ -3,7 +3,7 @@
  */
 import { __decorate, __metadata } from "tslib";
 import { h, } from "@stencil/core";
-import { inheritAttributes, FormControl, debounceEvent, Logger, OneOf, Type, } from "../../utils/index";
+import { inheritAttributes, FormControl, debounceEvent, Logger, OneOf, Type, watchInvalidTextSlot, } from "../../utils/index";
 import { defaultConfig, ListenToConfig } from "../../global/index";
 import { Field } from "../input/field.util";
 import { INPUT_COLORS, INPUT_INPUT_MODES } from "../input/input.interfaces";
@@ -12,6 +12,7 @@ import { TEXTAREA_WRAPS, } from "./textarea.interfaces";
  * Textarea renders a multi-line text input field with validation, resizing, and optional help/error messaging.
  *
  * @slot - The textarea field content and surrounding elements.
+ * @slot invalid-text - Overrides the `invalidText` prop with custom markup, shown instead of the description when `invalid` is `true`.
  * @part textarea - The native HTML textarea element.
  * @part prefix - The prefix wrapper (if used).
  * @part suffix - The suffix wrapper (if used).
@@ -22,6 +23,7 @@ export class Textarea {
         this.inheritedAttributes = {};
         this.control = new FormControl(this);
         this.focused = false;
+        this.hasInvalidTextSlotContent = false;
         this.language = defaultConfig.language;
         this.region = defaultConfig.region;
         /**
@@ -130,6 +132,13 @@ export class Textarea {
     connectedCallback() {
         this.debounceChanged();
         this.control.connectedCallback();
+        this.disconnectInvalidTextSlotWatcher = watchInvalidTextSlot(this.el, hasContent => {
+            this.hasInvalidTextSlotContent = hasContent;
+        });
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.disconnectInvalidTextSlotWatcher) === null || _a === void 0 ? void 0 : _a.call(this);
     }
     componentWillLoad() {
         this.inheritedAttributes = inheritAttributes(this.el, ['aria-label', 'tabindex', 'title', 'data-hj-allow']);
@@ -182,7 +191,8 @@ export class Textarea {
      * ------------------------------------------------------
      */
     render() {
-        return (h(Field, { key: '2e1e2729ed8faa5ccc854162ce77328251481a13', inputId: 'textarea', disabled: this.disabled, color: this.color, invalid: this.invalid, label: this.label, description: this.description, invalidText: this.invalidText, required: this.required, language: this.language }, h("textarea", Object.assign({ key: '8c037403989369aa837282250192ca463157262a', id: "textarea", part: "textarea", name: this.name, ref: el => (this.control.nativeEl = el), "aria-describedby": "description", "aria-invalid": this.invalid === true ? 'true' : 'false', disabled: this.disabled, autoCapitalize: this.autocapitalize, autocomplete: this.autocomplete, autofocus: this.autofocus, minLength: this.minLength, maxLength: this.maxLength, placeholder: this.placeholder || '', readonly: this.readonly, required: this.required, inputMode: this.inputmode, cols: this.cols, rows: this.rows, wrap: this.wrap ? this.wrap : undefined, onClick: ev => this.handleClick(ev), onFocus: ev => this.handleFocus(ev), onBlur: ev => this.handleBlur(ev), onInput: ev => this.handleInput(ev), onKeyPress: ev => this.dsKeyPress.emit(ev) }, this.inheritedAttributes))));
+        const isInvalid = this.invalid || this.hasInvalidTextSlotContent;
+        return (h(Field, { key: '49d0b6396fe85413e395b50d5e09efca92db51f8', inputId: 'textarea', disabled: this.disabled, color: this.color, invalid: isInvalid, label: this.label, description: this.description, invalidText: this.invalidText, required: this.required, language: this.language }, h("textarea", Object.assign({ key: '0a963e803a8e9341869b3b25336c092d8f25b65e', id: "textarea", part: "textarea", name: this.name, ref: el => (this.control.nativeEl = el), "aria-describedby": "description", "aria-invalid": isInvalid ? 'true' : 'false', disabled: this.disabled, autoCapitalize: this.autocapitalize, autocomplete: this.autocomplete, autofocus: this.autofocus, minLength: this.minLength, maxLength: this.maxLength, placeholder: this.placeholder || '', readonly: this.readonly, required: this.required, inputMode: this.inputmode, cols: this.cols, rows: this.rows, wrap: this.wrap ? this.wrap : undefined, onClick: ev => this.handleClick(ev), onFocus: ev => this.handleFocus(ev), onBlur: ev => this.handleBlur(ev), onInput: ev => this.handleInput(ev), onKeyPress: ev => this.dsKeyPress.emit(ev) }, this.inheritedAttributes))));
     }
     static get is() { return "ds-textarea"; }
     static get encapsulation() { return "shadow"; }
@@ -668,6 +678,7 @@ export class Textarea {
     static get states() {
         return {
             "focused": {},
+            "hasInvalidTextSlotContent": {},
             "language": {},
             "region": {}
         };

package/dist/collection/global/constants/version.constant.js

@@ -2,4 +2,4 @@
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
 // generated by .build/version.js
-export const VERSION = '20.0.0-next.7';
+export const VERSION = '20.0.0-next.8';

package/dist/collection/global/global.js

@@ -2,6 +2,8 @@
  * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
  */
 import { initializeDesignSystem } from "./initialize";
+import { initializeTokenPreview } from "./token-preview";
 export default function () {
     initializeDesignSystem();
+    initializeTokenPreview();
 }

package/dist/collection/global/token-preview.js

@@ -0,0 +1,75 @@
+/*!
+ * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
+ */
+/**
+ * Live token preview: applies token changes posted by an embedding parent window (Toky's live
+ * preview sidebar) directly to `document.documentElement.style`, so a component's rendered
+ * output reflects in-progress token edits without a rebuild. No-ops outside an iframe, so it
+ * never activates during normal component consumption or Playwright visual-regression runs.
+ * No origin allowlist yet - MVP is localhost-only (see packages/core/CONTEXT.md).
+ */
+export const initializeTokenPreview = (win = window) => {
+    if (win.parent === win) {
+        return;
+    }
+    const appliedProperties = new Set();
+    const injectedBrandStylesheets = new Set();
+    const applyTokens = (tokens) => {
+        for (const { name, value } of tokens) {
+            if (value === null) {
+                win.document.documentElement.style.removeProperty(name);
+                appliedProperties.delete(name);
+            }
+            else {
+                win.document.documentElement.style.setProperty(name, value);
+                appliedProperties.add(name);
+            }
+        }
+    };
+    const applyBrand = (brand) => {
+        if (!brand || brand === 'Base') {
+            delete win.document.documentElement.dataset['theme'];
+            return;
+        }
+        const href = `/assets/tokens/${brand.toLowerCase()}.tokens.css`;
+        if (!injectedBrandStylesheets.has(href)) {
+            const link = win.document.createElement('link');
+            link.rel = 'stylesheet';
+            link.href = href;
+            win.document.head.appendChild(link);
+            injectedBrandStylesheets.add(href);
+        }
+        // packages/tokens emits the brand stylesheet's selector lowercased (config.brand.ts:
+        // `[data-theme="${mode.toLowerCase()}"]`) - matching that here is what makes the injected
+        // stylesheet above actually apply.
+        win.document.documentElement.dataset['theme'] = brand.toLowerCase();
+    };
+    const reset = () => {
+        for (const name of appliedProperties) {
+            win.document.documentElement.style.removeProperty(name);
+        }
+        appliedProperties.clear();
+        delete win.document.documentElement.dataset['theme'];
+    };
+    win.addEventListener('message', (event) => {
+        if (event.source !== win.parent) {
+            return;
+        }
+        const message = event.data;
+        if (!message || message.source !== 'ds-token-preview') {
+            return;
+        }
+        switch (message.type) {
+            case 'set-tokens':
+                applyTokens(message.tokens);
+                break;
+            case 'set-brand':
+                applyBrand(message.brand);
+                break;
+            case 'reset':
+                reset();
+                break;
+        }
+    });
+    win.parent.postMessage({ source: 'ds-token-preview', type: 'ready' }, '*');
+};

package/dist/collection/global/token-preview.types.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/utils/index.js

@@ -13,6 +13,7 @@ export * from './form-control';
 export * from './has-value';
 export * from './helpers';
 export * from './is-iso-date';
+export * from './invalid-text-slot';
 export * from './is-value-empty';
 export * from './log';
 export * from './number';

package/dist/collection/utils/invalid-text-slot.js

@@ -0,0 +1,31 @@
+/*!
+ * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
+ */
+/**
+ * Watches the host's `slot="invalid-text"` light-DOM child for content, calling
+ * `onChange` whenever "has non-empty content" flips. Covers both the node being
+ * added/removed/replaced and its text being mutated in place (e.g. AEM writing a
+ * validation message into an otherwise-empty node it owns).
+ *
+ * Returns a disconnect function to call from `disconnectedCallback`.
+ */
+export function watchInvalidTextSlot(el, onChange) {
+    let contentObserver;
+    const check = () => {
+        var _a;
+        const slotted = el.querySelector(':scope > [slot="invalid-text"]');
+        onChange(!!slotted && ((_a = slotted.textContent) !== null && _a !== void 0 ? _a : '').trim().length > 0);
+        contentObserver === null || contentObserver === void 0 ? void 0 : contentObserver.disconnect();
+        if (slotted) {
+            contentObserver = new MutationObserver(check);
+            contentObserver.observe(slotted, { childList: true, characterData: true, subtree: true });
+        }
+    };
+    const hostObserver = new MutationObserver(check);
+    hostObserver.observe(el, { childList: true });
+    check();
+    return () => {
+        hostObserver.disconnect();
+        contentObserver === null || contentObserver === void 0 ? void 0 : contentObserver.disconnect();
+    };
+}