npm - @designsystem-se/af - Versions diffs - 36.0.2-beta.1 → 36.0.3-beta.0 - Mend

@designsystem-se/af 36.0.2-beta.1 → 36.0.3-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (401) hide show

package/dist/collection/components/_header/header-avatar/header-avatar.css CHANGED Viewed

@@ -5,15 +5,22 @@ License: none (public domain)
 :root {
   --digi--grayscale--0: #ffffff;
   --digi--grayscale--50: #fbfbfb;
+  --digi--grayscale--75: #f5f5f5;
   --digi--grayscale--100: #f4f4f4;
   --digi--grayscale--200: #ededed;
   --digi--grayscale--300: #e4e4e4;
   --digi--grayscale--400: #dddddd;
   --digi--grayscale--500: #cacaca;
+  --digi--grayscale--550: #c5c5c5;
   --digi--grayscale--600: #acacac;
+  --digi--grayscale--650: #9c9c9c;
   --digi--grayscale--700: #757575;
   --digi--grayscale--800: #5c5c5c;
+  --digi--grayscale--850: #515151;
+  --digi--grayscale--875: #414141;
   --digi--grayscale--900: #333333;
+  --digi--grayscale--950: #212121;
+  --digi--grayscale--975: #2c2c2c;
   --digi--grayscale--1000: #000000;
   --digi--sentiment--informative--200: #e9e9ff;
   --digi--sentiment--informative--500: #0A4DD1;
@@ -350,107 +357,6 @@ License: none (public domain)
   --digi--typography--button--font-size--desktop: var(--digi--global--typography--font-size--base);
   --digi--typography--button--font-size--desktop-large: var(--digi--global--typography--font-size--large);
   --digi--typography--button--font-weight--desktop: var(--digi--global--typography--font-weight--semibold);
-  --digi--color--logotype-color: var(--digi--color--logotype-color--light);
-  --digi--color--infographic--lineart: var(--digi--color--infographic--lineart--light);
-  --digi--color--infographic--background: var(--digi--color--infographic--background--light);
-  --digi--color--infographic--brand--primary: var(--digi--color--infographic--brand--primary--light);
-  --digi--color--infographic--brand--secondary: var(--digi--color--infographic--brand--secondary--light);
-  --digi--color--infographic--brand--tertiary: var(--digi--color--infographic--brand--tertiary--light);
-  --digi--color--text--primary: var(--digi--color--text--primary--light);
-  --digi--color--text--secondary: var(--digi--color--text--secondary--light);
-  --digi--color--text--description: var(--digi--color--text--description--light);
-  --digi--color--text--interactive--primary: var(--digi--color--text--interactive--primary--light);
-  --digi--color--text--interactive--secondary: var(--digi--color--text--interactive--secondary--light);
-  --digi--color--text--interactive--tertiary: var(--digi--color--text--interactive--tertiary--light);
-  --digi--color--text--interactive--brand-primary: var(--digi--color--text--interactive--brand-primary--light);
-  --digi--color--text--interactive--brand-secondary: var(--digi--color--text--interactive--brand-secondary--light);
-  --digi--color--text--interactive--visited: var(--digi--color--text--interactive--visited--light);
-  --digi--color--background--primary: var(--digi--color--background--primary--light);
-  --digi--color--background--secondary: var(--digi--color--background--secondary--light);
-  --digi--color--background--secondary-muted: var(--digi--color--background--secondary-muted--light);
-  --digi--color--background--secondary-accent: var(--digi--color--background--secondary-accent--light);
-  --digi--color--background--pop-out: var(--digi--color--background--pop-out--light);
-  --digi--color--background--brand-primary: var(--digi--color--background--brand-primary--light);
-  --digi--color--background--transparent: var(--digi--color--background--transparent--light);
-  --digi--color--background--notification: var(--digi--color--background--notification--light);
-  --digi--color--background--interactive--default--primary: var(--digi--color--background--interactive--default--primary--light);
-  --digi--color--background--interactive--default--primary-inverted: var(--digi--color--background--interactive--default--primary-inverted--light);
-  --digi--color--background--interactive--default--secondary: var(--digi--color--background--interactive--default--secondary--light);
-  --digi--color--background--interactive--default--secondary-inverted: var(--digi--color--background--interactive--default--secondary-inverted--light);
-  --digi--color--background--interactive--default--tertiary: var(--digi--color--background--interactive--default--tertiary--light);
-  --digi--color--background--interactive--default--quaternary: var(--digi--color--background--interactive--default--quaternary--light);
-  --digi--color--background--interactive--default--input-elements: var(--digi--color--background--interactive--default--input-elements--light);
-  --digi--color--background--interactive--default--pop-out: var(--digi--color--background--interactive--default--pop-out--light);
-  --digi--color--background--interactive--hover--primary: var(--digi--color--background--interactive--hover--primary--light);
-  --digi--color--background--interactive--hover--secondary: var(--digi--color--background--interactive--hover--secondary--light);
-  --digi--color--background--interactive--hover--tertiary: var(--digi--color--background--interactive--hover--tertiary--light);
-  --digi--color--background--interactive--hover--quarternary: var(--digi--color--background--interactive--hover--quarternary--light);
-  --digi--color--background--interactive--hover--inverted: var(--digi--color--background--interactive--hover--inverted--light);
-  --digi--color--background--interactive--selected--primary: var(--digi--color--background--interactive--selected--primary--light);
-  --digi--color--background--interactive--selected--secondary: var(--digi--color--background--interactive--selected--secondary--light);
-  --digi--color--background--interactive--selected--tertiary: var(--digi--color--background--interactive--selected--tertiary--light);
-  --digi--color--background--interactive--selected--on-menu-minus-button: var(--digi--color--background--interactive--selected--on-menu-minus-button--light);
-  --digi--color--background--interactive--validation--success: var(--digi--color--background--interactive--validation--success--light);
-  --digi--color--background--interactive--validation--warning: var(--digi--color--background--interactive--validation--warning--light);
-  --digi--color--background--interactive--validation--error: var(--digi--color--background--interactive--validation--error--light);
-  --digi--color--background--sentiment--error--primary: var(--digi--color--background--sentiment--error--primary--light);
-  --digi--color--background--sentiment--error--secondary: var(--digi--color--background--sentiment--error--secondary--light);
-  --digi--color--background--sentiment--error--tertiary: var(--digi--color--background--sentiment--error--tertiary--light);
-  --digi--color--background--sentiment--success--primary: var(--digi--color--background--sentiment--success--primary--light);
-  --digi--color--background--sentiment--success--secondary: var(--digi--color--background--sentiment--success--secondary--light);
-  --digi--color--background--sentiment--success--tertiary: var(--digi--color--background--sentiment--success--tertiary--light);
-  --digi--color--background--sentiment--warning--primary: var(--digi--color--background--sentiment--warning--primary--light);
-  --digi--color--background--sentiment--warning--secondary: var(--digi--color--background--sentiment--warning--secondary--light);
-  --digi--color--background--sentiment--warning--tertiary: var(--digi--color--background--sentiment--warning--tertiary--light);
-  --digi--color--background--sentiment--warning--quarternary: var(--digi--color--background--sentiment--warning--quarternary--light);
-  --digi--color--background--sentiment--info--primary: var(--digi--color--background--sentiment--info--primary--light);
-  --digi--color--background--sentiment--info--secondary: var(--digi--color--background--sentiment--info--secondary--light);
-  --digi--color--background--sentiment--info--tertiary: var(--digi--color--background--sentiment--info--tertiary--light);
-  --digi--color--background--sentiment--neutral--primary: var(--digi--color--background--sentiment--neutral--primary--light);
-  --digi--color--background--sentiment--neutral--secondary: var(--digi--color--background--sentiment--neutral--secondary--light);
-  --digi--color--background--sentiment--neutral--tertiary: var(--digi--color--background--sentiment--neutral--tertiary--light);
-  --digi--color--background--sentiment--beta--primary: var(--digi--color--background--sentiment--beta--primary--light);
-  --digi--color--background--sentiment--beta--secondary: var(--digi--color--background--sentiment--beta--secondary--light);
-  --digi--color--border--notification: var(--digi--color--border--notification--light);
-  --digi--color--border--transparent: var(--digi--color--border--transparent--light);
-  --digi--color--border--interactive--default--primary: var(--digi--color--border--interactive--default--primary--light);
-  --digi--color--border--interactive--default--on-input: var(--digi--color--border--interactive--default--on-input--light);
-  --digi--color--border--interactive--default--on-input-nuance: var(--digi--color--border--interactive--default--on-input-nuance--light);
-  --digi--color--border--interactive--default--inverted: var(--digi--color--border--interactive--default--inverted--light);
-  --digi--color--border--interactive--hover--primary: var(--digi--color--border--interactive--hover--primary--light);
-  --digi--color--border--interactive--hover--secondary: var(--digi--color--border--interactive--hover--secondary--light);
-  --digi--color--border--interactive--hover--inverted: var(--digi--color--border--interactive--hover--inverted--light);
-  --digi--color--border--interactive--validation--success: var(--digi--color--border--interactive--validation--success--light);
-  --digi--color--border--interactive--validation--warning: var(--digi--color--border--interactive--validation--warning--light);
-  --digi--color--border--interactive--validation--error: var(--digi--color--border--interactive--validation--error--light);
-  --digi--color--border--interactive--selected--primary: var(--digi--color--border--interactive--selected--primary--light);
-  --digi--color--border--interactive--selected--secondary: var(--digi--color--border--interactive--selected--secondary--light);
-  --digi--color--border--sentiment--error: var(--digi--color--border--sentiment--error--light);
-  --digi--color--border--sentiment--success: var(--digi--color--border--sentiment--success--light);
-  --digi--color--border--sentiment--warning: var(--digi--color--border--sentiment--warning--light);
-  --digi--color--border--sentiment--info: var(--digi--color--border--sentiment--info--light);
-  --digi--color--border--accent--primary: var(--digi--color--border--accent--primary--light);
-  --digi--color--border--accent--secondary: var(--digi--color--border--accent--secondary--light);
-  --digi--color--marking--navigation--selected: var(--digi--color--marking--navigation--selected--light);
-  --digi--color--marking--navigation--level-active: var(--digi--color--marking--navigation--level-active--light);
-  --digi--color--marking--navigation--level-inactive: var(--digi--color--marking--navigation--level-inactive--light);
-  --digi--color--marking--indication--primary: var(--digi--color--marking--indication--primary--light);
-  --digi--color--marking--indication--secondary: var(--digi--color--marking--indication--secondary--light);
-  --digi--color--marking--indication--tertiary: var(--digi--color--marking--indication--tertiary--light);
-  --digi--color--divider--primary: var(--digi--color--divider--primary--light);
-  --digi--color--divider--secondary: var(--digi--color--divider--secondary--light);
-  --digi--color--divider--on-brand-primary: var(--digi--color--divider--on-brand-primary--light);
-  --digi--color--divider--cta: var(--digi--color--divider--cta--light);
-  --digi--color--icon--primary: var(--digi--color--icon--primary--light);
-  --digi--color--icon--secondary: var(--digi--color--icon--secondary--light);
-  --digi--color--icon--cta: var(--digi--color--icon--cta--light);
-  --digi--color--icon--brand-primary: var(--digi--color--icon--brand-primary--light);
-  --digi--color--icon--brand-secondary: var(--digi--color--icon--brand-secondary--light);
-  --digi--color--icon--validation--success: var(--digi--color--icon--validation--success--light);
-  --digi--color--icon--validation--warning: var(--digi--color--icon--validation--warning--light);
-  --digi--color--icon--validation--error: var(--digi--color--icon--validation--error--light);
-  --digi--color--misc--spinner-path: var(--digi--color--misc--spinner-path--light);
-  --digi--color--misc--skeleton: var(--digi--color--misc--skeleton--light);
   --digi--amethyst--500: #822998;
   --digi--granskott--150: #f2faf2;
   --digi--granskott--200: #ebf8eb;
@@ -473,6 +379,113 @@ License: none (public domain)
   --digi--rallarros--300: #f8ddf5;
   --digi--rallarros--500: #ce1cbd;
   --digi--sapphire--500: #1616b2;
+  --digi--color--logotype-color--dark: var(--digi--granskott--700);
+  --digi--color--infographic--lineart--dark: var(--digi--grayscale--900);
+  --digi--color--infographic--background--dark: var(--digi--grayscale--0);
+  --digi--color--infographic--brand--primary--dark: var(--digi--granskott--700);
+  --digi--color--infographic--brand--secondary--dark: var(--digi--granskott--250);
+  --digi--color--infographic--brand--tertiary--dark: var(--digi--rallarros--500);
+  --digi--color--text--primary--dark: var(--digi--grayscale--75);
+  --digi--color--text--primary-stay--dark: var(--digi--grayscale--850);
+  --digi--color--text--secondary--dark: var(--digi--grayscale--75);
+  --digi--color--text--secondary-stay--dark: var(--digi--grayscale--0);
+  --digi--color--text--description--dark: var(--digi--grayscale--100);
+  --digi--color--text--interactive--primary--dark: var(--digi--norrsken--500);
+  --digi--color--text--interactive--secondary--dark: var(--digi--grayscale--900);
+  --digi--color--text--interactive--tertiary--dark: var(--digi--grayscale--75);
+  --digi--color--text--interactive--brand-primary--dark: var(--digi--natthimmel--75);
+  --digi--color--text--interactive--brand-secondary--dark: var(--digi--norrsken--500);
+  --digi--color--text--interactive--visited--dark: #CB6DE3;
+  --digi--color--background--primary--dark: var(--digi--grayscale--975);
+  --digi--color--background--primary-elevated--dark: var(--digi--grayscale--850);
+  --digi--color--background--secondary--dark: var(--digi--grayscale--950);
+  --digi--color--background--secondary-elevated--dark: var(--digi--grayscale--875);
+  --digi--color--background--secondary-muted--dark: var(--digi--grayscale--900);
+  --digi--color--background--secondary-accent--dark: var(--digi--grayscale--850);
+  --digi--color--background--pop-out--dark: var(--digi--grayscale--850);
+  --digi--color--background--brand-primary--dark: var(--digi--grayscale--900);
+  --digi--color--background--transparent--dark: var(--digi--misc--transparent);
+  --digi--color--background--notification--dark: var(--digi--sentiment--error--500);
+  --digi--color--background--interactive--default--primary--dark: var(--digi--grayscale--50);
+  --digi--color--background--interactive--default--primary-inverted--dark: var(--digi--norrsken--500);
+  --digi--color--background--interactive--default--secondary--dark: var(--digi--misc--transparent);
+  --digi--color--background--interactive--default--secondary-inverted--dark: var(--digi--misc--transparent);
+  --digi--color--background--interactive--default--tertiary--dark: var(--digi--grayscale--875);
+  --digi--color--background--interactive--default--quaternary--dark: var(--digi--grayscale--850);
+  --digi--color--background--interactive--default--input-elements--dark: var(--digi--misc--transparent);
+  --digi--color--background--interactive--default--pop-out--dark: var(--digi--grayscale--650);
+  --digi--color--background--interactive--hover--primary--dark: var(--digi--grayscale--650);
+  --digi--color--background--interactive--hover--secondary--dark: var(--digi--grayscale--875);
+  --digi--color--background--interactive--hover--tertiary--dark: var(--digi--grayscale--850);
+  --digi--color--background--interactive--hover--quarternary--dark: var(--digi--grayscale--875);
+  --digi--color--background--interactive--hover--inverted--dark: var(--digi--norrsken--400);
+  --digi--color--background--interactive--hover--quinary--dark: var(--digi--grayscale--850);
+  --digi--color--background--interactive--selected--primary--dark: var(--digi--misc--transparent);
+  --digi--color--background--interactive--selected--secondary--dark: var(--digi--misc--transparent);
+  --digi--color--background--interactive--selected--tertiary--dark: var(--digi--grayscale--875);
+  --digi--color--background--interactive--selected--on-menu-minus-button--dark: var(--digi--grayscale--650);
+  --digi--color--background--interactive--validation--success--dark: var(--digi--misc--transparent);
+  --digi--color--background--interactive--validation--warning--dark: var(--digi--misc--transparent);
+  --digi--color--background--interactive--validation--error--dark: var(--digi--misc--transparent);
+  --digi--color--background--sentiment--error--primary--dark: var(--digi--sentiment--error--500);
+  --digi--color--background--sentiment--error--secondary--dark: var(--digi--sentiment--error--700);
+  --digi--color--background--sentiment--error--tertiary--dark: var(--digi--sentiment--error--200);
+  --digi--color--background--sentiment--error--tertiary-discreet--dark: var(--digi--grayscale--850);
+  --digi--color--background--sentiment--success--primary--dark: var(--digi--sentiment--success--500);
+  --digi--color--background--sentiment--success--secondary--dark: var(--digi--sentiment--success--700);
+  --digi--color--background--sentiment--success--tertiary--dark: var(--digi--sentiment--success--200);
+  --digi--color--background--sentiment--warning--primary--dark: var(--digi--sentiment--warning--500);
+  --digi--color--background--sentiment--warning--secondary--dark: var(--digi--sentiment--warning--700);
+  --digi--color--background--sentiment--warning--tertiary--dark: var(--digi--sentiment--warning--200);
+  --digi--color--background--sentiment--warning--quarternary--dark: var(--digi--grayscale--850);
+  --digi--color--background--sentiment--info--primary--dark: var(--digi--sentiment--informative--500);
+  --digi--color--background--sentiment--info--secondary--dark: var(--digi--sentiment--informative--700);
+  --digi--color--background--sentiment--info--tertiary--dark: var(--digi--sentiment--informative--200);
+  --digi--color--background--sentiment--neutral--primary--dark: var(--digi--grayscale--700);
+  --digi--color--background--sentiment--neutral--secondary--dark: var(--digi--grayscale--400);
+  --digi--color--background--sentiment--neutral--tertiary--dark: var(--digi--grayscale--900);
+  --digi--color--background--sentiment--beta--primary--dark: var(--digi--rallarros--500);
+  --digi--color--background--sentiment--beta--secondary--dark: var(--digi--rallarros--300);
+  --digi--color--border--notification--dark: var(--digi--grayscale--0);
+  --digi--color--border--transparent--dark: var(--digi--misc--transparent);
+  --digi--color--border--interactive--default--primary--dark: var(--digi--grayscale--75);
+  --digi--color--border--interactive--default--on-input--dark: var(--digi--grayscale--75);
+  --digi--color--border--interactive--default--on-input-nuance--dark: var(--digi--grayscale--650);
+  --digi--color--border--interactive--default--inverted--dark: var(--digi--norrsken--500);
+  --digi--color--border--interactive--hover--primary--dark: var(--digi--grayscale--75);
+  --digi--color--border--interactive--hover--secondary--dark: var(--digi--grayscale--75);
+  --digi--color--border--interactive--hover--inverted--dark: var(--digi--norrsken--400);
+  --digi--color--border--interactive--validation--success--dark: var(--digi--sentiment--success--500);
+  --digi--color--border--interactive--validation--warning--dark: var(--digi--sentiment--warning--900);
+  --digi--color--border--interactive--validation--error--dark: var(--digi--sentiment--error--500);
+  --digi--color--border--interactive--selected--primary--dark: var(--digi--grayscale--75);
+  --digi--color--border--interactive--selected--secondary--dark: var(--digi--grayscale--75);
+  --digi--color--border--sentiment--error--dark: var(--digi--sentiment--error--500);
+  --digi--color--border--sentiment--success--dark: var(--digi--sentiment--success--500);
+  --digi--color--border--sentiment--warning--dark: var(--digi--sentiment--warning--500);
+  --digi--color--border--sentiment--info--dark: var(--digi--sentiment--informative--500);
+  --digi--color--border--accent--primary--dark: var(--digi--grayscale--650);
+  --digi--color--border--accent--secondary--dark: var(--digi--granskott--700);
+  --digi--color--marking--navigation--selected--dark: var(--digi--granskott--700);
+  --digi--color--marking--navigation--level-active--dark: var(--digi--granskott--250);
+  --digi--color--marking--navigation--level-inactive--dark: var(--digi--grayscale--100);
+  --digi--color--marking--indication--primary--dark: var(--digi--sentiment--success--500);
+  --digi--color--marking--indication--secondary--dark: var(--digi--natthimmel--800);
+  --digi--color--marking--indication--tertiary--dark: var(--digi--grayscale--700);
+  --digi--color--divider--primary--dark: var(--digi--grayscale--400);
+  --digi--color--divider--secondary--dark: var(--digi--grayscale--200);
+  --digi--color--divider--on-brand-primary--dark: var(--digi--grayscale--650);
+  --digi--color--divider--cta--dark: var(--digi--norrsken--500);
+  --digi--color--icon--primary--dark: var(--digi--grayscale--75);
+  --digi--color--icon--secondary--dark: var(--digi--grayscale--75);
+  --digi--color--icon--cta--dark: var(--digi--norrsken--500);
+  --digi--color--icon--brand-primary--dark: var(--digi--grayscale--75);
+  --digi--color--icon--brand-secondary--dark: var(--digi--norrsken--500);
+  --digi--color--icon--validation--success--dark: var(--digi--sentiment--success--500);
+  --digi--color--icon--validation--warning--dark: var(--digi--sentiment--warning--500);
+  --digi--color--icon--validation--error--dark: var(--digi--sentiment--error--500);
+  --digi--color--misc--spinner-path--dark: var(--digi--grayscale--400);
+  --digi--color--misc--skeleton--dark: var(--digi--grayscale--400);
   --digi--color--logotype-color--light: var(--digi--granskott--700);
   --digi--color--infographic--lineart--light: var(--digi--grayscale--900);
   --digi--color--infographic--background--light: var(--digi--grayscale--0);
@@ -489,7 +502,9 @@ License: none (public domain)
   --digi--color--text--interactive--brand-secondary--light: var(--digi--norrsken--500);
   --digi--color--text--interactive--visited--light: var(--digi--amethyst--500);
   --digi--color--background--primary--light: var(--digi--grayscale--0);
+  --digi--color--background--primary-elevated--light: var(--digi--grayscale--0);
   --digi--color--background--secondary--light: var(--digi--grayscale--100);
+  --digi--color--background--secondary-elevated--light: var(--digi--grayscale--100);
   --digi--color--background--secondary-muted--light: var(--digi--grayscale--50);
   --digi--color--background--secondary-accent--light: var(--digi--grayscale--400);
   --digi--color--background--pop-out--light: var(--digi--granskott--200);
@@ -509,6 +524,7 @@ License: none (public domain)
   --digi--color--background--interactive--hover--tertiary--light: var(--digi--sapphire--500);
   --digi--color--background--interactive--hover--quarternary--light: var(--digi--grayscale--200);
   --digi--color--background--interactive--hover--inverted--light: var(--digi--norrsken--400);
+  --digi--color--background--interactive--hover--quinary--light: var(--digi--misc--transparent);
   --digi--color--background--interactive--selected--primary--light: var(--digi--sentiment--success--500);
   --digi--color--background--interactive--selected--secondary--light: var(--digi--natthimmel--800);
   --digi--color--background--interactive--selected--tertiary--light: var(--digi--grayscale--200);
@@ -519,6 +535,7 @@ License: none (public domain)
   --digi--color--background--sentiment--error--primary--light: var(--digi--sentiment--error--500);
   --digi--color--background--sentiment--error--secondary--light: var(--digi--sentiment--error--700);
   --digi--color--background--sentiment--error--tertiary--light: var(--digi--sentiment--error--200);
+  --digi--color--background--sentiment--error--tertiary-discreet--light: var(--digi--sentiment--error--200);
   --digi--color--background--sentiment--success--primary--light: var(--digi--sentiment--success--500);
   --digi--color--background--sentiment--success--secondary--light: var(--digi--sentiment--success--700);
   --digi--color--background--sentiment--success--tertiary--light: var(--digi--sentiment--success--200);
@@ -723,6 +740,226 @@ License: none (public domain)
   --digi--color--misc--spinner-path--light--af18: var(--digi--grayscale--400);
   --digi--color--misc--skeleton--light--af18: var(--digi--grayscale--400);
 }
+@media (prefers-color-scheme: light) {
+  :root {
+    --digi--color--logotype-color: var(--digi--color--logotype-color--light);
+    --digi--color--infographic--lineart: var(--digi--color--infographic--lineart--light);
+    --digi--color--infographic--background: var(--digi--color--infographic--background--light);
+    --digi--color--infographic--brand--primary: var(--digi--color--infographic--brand--primary--light);
+    --digi--color--infographic--brand--secondary: var(--digi--color--infographic--brand--secondary--light);
+    --digi--color--infographic--brand--tertiary: var(--digi--color--infographic--brand--tertiary--light);
+    --digi--color--text--primary: var(--digi--color--text--primary--light);
+    --digi--color--text--secondary: var(--digi--color--text--secondary--light);
+    --digi--color--text--description: var(--digi--color--text--description--light);
+    --digi--color--text--interactive--primary: var(--digi--color--text--interactive--primary--light);
+    --digi--color--text--interactive--secondary: var(--digi--color--text--interactive--secondary--light);
+    --digi--color--text--interactive--tertiary: var(--digi--color--text--interactive--tertiary--light);
+    --digi--color--text--interactive--brand-primary: var(--digi--color--text--interactive--brand-primary--light);
+    --digi--color--text--interactive--brand-secondary: var(--digi--color--text--interactive--brand-secondary--light);
+    --digi--color--text--interactive--visited: var(--digi--color--text--interactive--visited--light);
+    --digi--color--background--primary: var(--digi--color--background--primary--light);
+    --digi--color--background--primary-elevated: var(--digi--color--background--primary-elevated--light);
+    --digi--color--background--secondary: var(--digi--color--background--secondary--light);
+    --digi--color--background--secondary-elevated: var(--digi--color--background--secondary-elevated--light);
+    --digi--color--background--secondary-muted: var(--digi--color--background--secondary-muted--light);
+    --digi--color--background--secondary-accent: var(--digi--color--background--secondary-accent--light);
+    --digi--color--background--pop-out: var(--digi--color--background--pop-out--light);
+    --digi--color--background--brand-primary: var(--digi--color--background--brand-primary--light);
+    --digi--color--background--transparent: var(--digi--color--background--transparent--light);
+    --digi--color--background--notification: var(--digi--color--background--notification--light);
+    --digi--color--background--interactive--default--primary: var(--digi--color--background--interactive--default--primary--light);
+    --digi--color--background--interactive--default--primary-inverted: var(--digi--color--background--interactive--default--primary-inverted--light);
+    --digi--color--background--interactive--default--secondary: var(--digi--color--background--interactive--default--secondary--light);
+    --digi--color--background--interactive--default--secondary-inverted: var(--digi--color--background--interactive--default--secondary-inverted--light);
+    --digi--color--background--interactive--default--tertiary: var(--digi--color--background--interactive--default--tertiary--light);
+    --digi--color--background--interactive--default--quaternary: var(--digi--color--background--interactive--default--quaternary--light);
+    --digi--color--background--interactive--default--input-elements: var(--digi--color--background--interactive--default--input-elements--light);
+    --digi--color--background--interactive--default--pop-out: var(--digi--color--background--interactive--default--pop-out--light);
+    --digi--color--background--interactive--hover--primary: var(--digi--color--background--interactive--hover--primary--light);
+    --digi--color--background--interactive--hover--secondary: var(--digi--color--background--interactive--hover--secondary--light);
+    --digi--color--background--interactive--hover--tertiary: var(--digi--color--background--interactive--hover--tertiary--light);
+    --digi--color--background--interactive--hover--quarternary: var(--digi--color--background--interactive--hover--quarternary--light);
+    --digi--color--background--interactive--hover--inverted: var(--digi--color--background--interactive--hover--inverted--light);
+    --digi--color--background--interactive--hover--quinary: var(--digi--color--background--interactive--hover--quinary--light);
+    --digi--color--background--interactive--selected--primary: var(--digi--color--background--interactive--selected--primary--light);
+    --digi--color--background--interactive--selected--secondary: var(--digi--color--background--interactive--selected--secondary--light);
+    --digi--color--background--interactive--selected--tertiary: var(--digi--color--background--interactive--selected--tertiary--light);
+    --digi--color--background--interactive--selected--on-menu-minus-button: var(--digi--color--background--interactive--selected--on-menu-minus-button--light);
+    --digi--color--background--interactive--validation--success: var(--digi--color--background--interactive--validation--success--light);
+    --digi--color--background--interactive--validation--warning: var(--digi--color--background--interactive--validation--warning--light);
+    --digi--color--background--interactive--validation--error: var(--digi--color--background--interactive--validation--error--light);
+    --digi--color--background--sentiment--error--primary: var(--digi--color--background--sentiment--error--primary--light);
+    --digi--color--background--sentiment--error--secondary: var(--digi--color--background--sentiment--error--secondary--light);
+    --digi--color--background--sentiment--error--tertiary: var(--digi--color--background--sentiment--error--tertiary--light);
+    --digi--color--background--sentiment--error--tertiary-discreet: var(--digi--color--background--sentiment--error--tertiary-discreet--light);
+    --digi--color--background--sentiment--success--primary: var(--digi--color--background--sentiment--success--primary--light);
+    --digi--color--background--sentiment--success--secondary: var(--digi--color--background--sentiment--success--secondary--light);
+    --digi--color--background--sentiment--success--tertiary: var(--digi--color--background--sentiment--success--tertiary--light);
+    --digi--color--background--sentiment--warning--primary: var(--digi--color--background--sentiment--warning--primary--light);
+    --digi--color--background--sentiment--warning--secondary: var(--digi--color--background--sentiment--warning--secondary--light);
+    --digi--color--background--sentiment--warning--tertiary: var(--digi--color--background--sentiment--warning--tertiary--light);
+    --digi--color--background--sentiment--warning--quarternary: var(--digi--color--background--sentiment--warning--quarternary--light);
+    --digi--color--background--sentiment--info--primary: var(--digi--color--background--sentiment--info--primary--light);
+    --digi--color--background--sentiment--info--secondary: var(--digi--color--background--sentiment--info--secondary--light);
+    --digi--color--background--sentiment--info--tertiary: var(--digi--color--background--sentiment--info--tertiary--light);
+    --digi--color--background--sentiment--neutral--primary: var(--digi--color--background--sentiment--neutral--primary--light);
+    --digi--color--background--sentiment--neutral--secondary: var(--digi--color--background--sentiment--neutral--secondary--light);
+    --digi--color--background--sentiment--neutral--tertiary: var(--digi--color--background--sentiment--neutral--tertiary--light);
+    --digi--color--background--sentiment--beta--primary: var(--digi--color--background--sentiment--beta--primary--light);
+    --digi--color--background--sentiment--beta--secondary: var(--digi--color--background--sentiment--beta--secondary--light);
+    --digi--color--border--notification: var(--digi--color--border--notification--light);
+    --digi--color--border--transparent: var(--digi--color--border--transparent--light);
+    --digi--color--border--interactive--default--primary: var(--digi--color--border--interactive--default--primary--light);
+    --digi--color--border--interactive--default--on-input: var(--digi--color--border--interactive--default--on-input--light);
+    --digi--color--border--interactive--default--on-input-nuance: var(--digi--color--border--interactive--default--on-input-nuance--light);
+    --digi--color--border--interactive--default--inverted: var(--digi--color--border--interactive--default--inverted--light);
+    --digi--color--border--interactive--hover--primary: var(--digi--color--border--interactive--hover--primary--light);
+    --digi--color--border--interactive--hover--secondary: var(--digi--color--border--interactive--hover--secondary--light);
+    --digi--color--border--interactive--hover--inverted: var(--digi--color--border--interactive--hover--inverted--light);
+    --digi--color--border--interactive--validation--success: var(--digi--color--border--interactive--validation--success--light);
+    --digi--color--border--interactive--validation--warning: var(--digi--color--border--interactive--validation--warning--light);
+    --digi--color--border--interactive--validation--error: var(--digi--color--border--interactive--validation--error--light);
+    --digi--color--border--interactive--selected--primary: var(--digi--color--border--interactive--selected--primary--light);
+    --digi--color--border--interactive--selected--secondary: var(--digi--color--border--interactive--selected--secondary--light);
+    --digi--color--border--sentiment--error: var(--digi--color--border--sentiment--error--light);
+    --digi--color--border--sentiment--success: var(--digi--color--border--sentiment--success--light);
+    --digi--color--border--sentiment--warning: var(--digi--color--border--sentiment--warning--light);
+    --digi--color--border--sentiment--info: var(--digi--color--border--sentiment--info--light);
+    --digi--color--border--accent--primary: var(--digi--color--border--accent--primary--light);
+    --digi--color--border--accent--secondary: var(--digi--color--border--accent--secondary--light);
+    --digi--color--marking--navigation--selected: var(--digi--color--marking--navigation--selected--light);
+    --digi--color--marking--navigation--level-active: var(--digi--color--marking--navigation--level-active--light);
+    --digi--color--marking--navigation--level-inactive: var(--digi--color--marking--navigation--level-inactive--light);
+    --digi--color--marking--indication--primary: var(--digi--color--marking--indication--primary--light);
+    --digi--color--marking--indication--secondary: var(--digi--color--marking--indication--secondary--light);
+    --digi--color--marking--indication--tertiary: var(--digi--color--marking--indication--tertiary--light);
+    --digi--color--marking--indication--marker: var(--digi--color--marking--indication--marker--light);
+    --digi--color--divider--primary: var(--digi--color--divider--primary--light);
+    --digi--color--divider--secondary: var(--digi--color--divider--secondary--light);
+    --digi--color--divider--on-brand-primary: var(--digi--color--divider--on-brand-primary--light);
+    --digi--color--divider--cta: var(--digi--color--divider--cta--light);
+    --digi--color--icon--primary: var(--digi--color--icon--primary--light);
+    --digi--color--icon--secondary: var(--digi--color--icon--secondary--light);
+    --digi--color--icon--cta: var(--digi--color--icon--cta--light);
+    --digi--color--icon--brand-primary: var(--digi--color--icon--brand-primary--light);
+    --digi--color--icon--brand-secondary: var(--digi--color--icon--brand-secondary--light);
+    --digi--color--icon--validation--success: var(--digi--color--icon--validation--success--light);
+    --digi--color--icon--validation--warning: var(--digi--color--icon--validation--warning--light);
+    --digi--color--icon--validation--error: var(--digi--color--icon--validation--error--light);
+    --digi--color--misc--spinner-path: var(--digi--color--misc--spinner-path--light);
+    --digi--color--misc--skeleton: var(--digi--color--misc--skeleton--light);
+  }
+}
+@media (prefers-color-scheme: dark) {
+  :root {
+    --digi--color--logotype-color: var(--digi--color--logotype-color--dark);
+    --digi--color--infographic--lineart: var(--digi--color--infographic--lineart--dark);
+    --digi--color--infographic--background: var(--digi--color--infographic--background--dark);
+    --digi--color--infographic--brand--primary: var(--digi--color--infographic--brand--primary--dark);
+    --digi--color--infographic--brand--secondary: var(--digi--color--infographic--brand--secondary--dark);
+    --digi--color--infographic--brand--tertiary: var(--digi--color--infographic--brand--tertiary--dark);
+    --digi--color--text--primary: var(--digi--color--text--primary--dark);
+    --digi--color--text--secondary: var(--digi--color--text--secondary--dark);
+    --digi--color--text--description: var(--digi--color--text--description--dark);
+    --digi--color--text--interactive--primary: var(--digi--color--text--interactive--primary--dark);
+    --digi--color--text--interactive--secondary: var(--digi--color--text--interactive--secondary--dark);
+    --digi--color--text--interactive--tertiary: var(--digi--color--text--interactive--tertiary--dark);
+    --digi--color--text--interactive--brand-primary: var(--digi--color--text--interactive--brand-primary--dark);
+    --digi--color--text--interactive--brand-secondary: var(--digi--color--text--interactive--brand-secondary--dark);
+    --digi--color--text--interactive--visited: var(--digi--color--text--interactive--visited--dark);
+    --digi--color--background--primary: var(--digi--color--background--primary--dark);
+    --digi--color--background--primary-elevated: var(--digi--color--background--primary-elevated--dark);
+    --digi--color--background--secondary: var(--digi--color--background--secondary--dark);
+    --digi--color--background--secondary-elevated: var(--digi--color--background--secondary--dark);
+    --digi--color--background--secondary-muted: var(--digi--color--background--secondary-muted--dark);
+    --digi--color--background--secondary-accent: var(--digi--color--background--secondary-accent--dark);
+    --digi--color--background--pop-out: var(--digi--color--background--pop-out--dark);
+    --digi--color--background--brand-primary: var(--digi--color--background--brand-primary--dark);
+    --digi--color--background--transparent: var(--digi--color--background--transparent--dark);
+    --digi--color--background--notification: var(--digi--color--background--notification--dark);
+    --digi--color--background--interactive--default--primary: var(--digi--color--background--interactive--default--primary--dark);
+    --digi--color--background--interactive--default--primary-inverted: var(--digi--color--background--interactive--default--primary-inverted--dark);
+    --digi--color--background--interactive--default--secondary: var(--digi--color--background--interactive--default--secondary--dark);
+    --digi--color--background--interactive--default--secondary-inverted: var(--digi--color--background--interactive--default--secondary-inverted--dark);
+    --digi--color--background--interactive--default--tertiary: var(--digi--color--background--interactive--default--tertiary--dark);
+    --digi--color--background--interactive--default--quaternary: var(--digi--color--background--interactive--default--quaternary--dark);
+    --digi--color--background--interactive--default--input-elements: var(--digi--color--background--interactive--default--input-elements--dark);
+    --digi--color--background--interactive--default--pop-out: var(--digi--color--background--interactive--default--pop-out--dark);
+    --digi--color--background--interactive--hover--primary: var(--digi--color--background--interactive--hover--primary--dark);
+    --digi--color--background--interactive--hover--secondary: var(--digi--color--background--interactive--hover--secondary--dark);
+    --digi--color--background--interactive--hover--tertiary: var(--digi--color--background--interactive--hover--tertiary--dark);
+    --digi--color--background--interactive--hover--quarternary: var(--digi--color--background--interactive--hover--quarternary--dark);
+    --digi--color--background--interactive--hover--inverted: var(--digi--color--background--interactive--hover--inverted--dark);
+    --digi--color--background--interactive--hover--quinary: var(--digi--color--background--interactive--hover--quinary--dark);
+    --digi--color--background--interactive--selected--primary: var(--digi--color--background--interactive--selected--primary--dark);
+    --digi--color--background--interactive--selected--secondary: var(--digi--color--background--interactive--selected--secondary--dark);
+    --digi--color--background--interactive--selected--tertiary: var(--digi--color--background--interactive--selected--tertiary--dark);
+    --digi--color--background--interactive--selected--on-menu-minus-button: var(--digi--color--background--interactive--selected--on-menu-minus-button--dark);
+    --digi--color--background--interactive--validation--success: var(--digi--color--background--interactive--validation--success--dark);
+    --digi--color--background--interactive--validation--warning: var(--digi--color--background--interactive--validation--warning--dark);
+    --digi--color--background--interactive--validation--error: var(--digi--color--background--interactive--validation--error--dark);
+    --digi--color--background--sentiment--error--primary: var(--digi--color--background--sentiment--error--primary--dark);
+    --digi--color--background--sentiment--error--secondary: var(--digi--color--background--sentiment--error--secondary--dark);
+    --digi--color--background--sentiment--error--tertiary: var(--digi--color--background--sentiment--error--tertiary--dark);
+    --digi--color--background--sentiment--error--tertiary-discreet: var(--digi--color--background--sentiment--error--tertiary-discreet--dark);
+    --digi--color--background--sentiment--success--primary: var(--digi--color--background--sentiment--success--primary--dark);
+    --digi--color--background--sentiment--success--secondary: var(--digi--color--background--sentiment--success--secondary--dark);
+    --digi--color--background--sentiment--success--tertiary: var(--digi--color--background--sentiment--success--tertiary--dark);
+    --digi--color--background--sentiment--warning--primary: var(--digi--color--background--sentiment--warning--primary--dark);
+    --digi--color--background--sentiment--warning--secondary: var(--digi--color--background--sentiment--warning--secondary--dark);
+    --digi--color--background--sentiment--warning--tertiary: var(--digi--color--background--sentiment--warning--tertiary--dark);
+    --digi--color--background--sentiment--warning--quarternary: var(--digi--color--background--sentiment--warning--quarternary--dark);
+    --digi--color--background--sentiment--info--primary: var(--digi--color--background--sentiment--info--primary--dark);
+    --digi--color--background--sentiment--info--secondary: var(--digi--color--background--sentiment--info--secondary--dark);
+    --digi--color--background--sentiment--info--tertiary: var(--digi--color--background--sentiment--info--tertiary--dark);
+    --digi--color--background--sentiment--neutral--primary: var(--digi--color--background--sentiment--neutral--primary--dark);
+    --digi--color--background--sentiment--neutral--secondary: var(--digi--color--background--sentiment--neutral--secondary--dark);
+    --digi--color--background--sentiment--neutral--tertiary: var(--digi--color--background--sentiment--neutral--tertiary--dark);
+    --digi--color--background--sentiment--beta--primary: var(--digi--color--background--sentiment--beta--primary--dark);
+    --digi--color--background--sentiment--beta--secondary: var(--digi--color--background--sentiment--beta--secondary--dark);
+    --digi--color--border--notification: var(--digi--color--border--notification--dark);
+    --digi--color--border--transparent: var(--digi--color--border--transparent--dark);
+    --digi--color--border--interactive--default--primary: var(--digi--color--border--interactive--default--primary--dark);
+    --digi--color--border--interactive--default--on-input: var(--digi--color--border--interactive--default--on-input--dark);
+    --digi--color--border--interactive--default--on-input-nuance: var(--digi--color--border--interactive--default--on-input-nuance--dark);
+    --digi--color--border--interactive--default--inverted: var(--digi--color--border--interactive--default--inverted--dark);
+    --digi--color--border--interactive--hover--primary: var(--digi--color--border--interactive--hover--primary--dark);
+    --digi--color--border--interactive--hover--secondary: var(--digi--color--border--interactive--hover--secondary--dark);
+    --digi--color--border--interactive--hover--inverted: var(--digi--color--border--interactive--hover--inverted--dark);
+    --digi--color--border--interactive--validation--success: var(--digi--color--border--interactive--validation--success--dark);
+    --digi--color--border--interactive--validation--warning: var(--digi--color--border--interactive--validation--warning--dark);
+    --digi--color--border--interactive--validation--error: var(--digi--color--border--interactive--validation--error--dark);
+    --digi--color--border--interactive--selected--primary: var(--digi--color--border--interactive--selected--primary--dark);
+    --digi--color--border--interactive--selected--secondary: var(--digi--color--border--interactive--selected--secondary--dark);
+    --digi--color--border--sentiment--error: var(--digi--color--border--sentiment--error--dark);
+    --digi--color--border--sentiment--success: var(--digi--color--border--sentiment--success--dark);
+    --digi--color--border--sentiment--warning: var(--digi--color--border--sentiment--warning--dark);
+    --digi--color--border--sentiment--info: var(--digi--color--border--sentiment--info--dark);
+    --digi--color--border--accent--primary: var(--digi--color--border--accent--primary--dark);
+    --digi--color--border--accent--secondary: var(--digi--color--border--accent--secondary--dark);
+    --digi--color--marking--navigation--selected: var(--digi--color--marking--navigation--selected--dark);
+    --digi--color--marking--navigation--level-active: var(--digi--color--marking--navigation--level-active--dark);
+    --digi--color--marking--navigation--level-inactive: var(--digi--color--marking--navigation--level-inactive--dark);
+    --digi--color--marking--indication--primary: var(--digi--color--marking--indication--primary--dark);
+    --digi--color--marking--indication--secondary: var(--digi--color--marking--indication--secondary--dark);
+    --digi--color--marking--indication--tertiary: var(--digi--color--marking--indication--tertiary--dark);
+    --digi--color--marking--indication--marker: var(--digi--color--marking--indication--marker--dark);
+    --digi--color--divider--primary: var(--digi--color--divider--primary--dark);
+    --digi--color--divider--secondary: var(--digi--color--divider--secondary--dark);
+    --digi--color--divider--on-brand-primary: var(--digi--color--divider--on-brand-primary--dark);
+    --digi--color--divider--cta: var(--digi--color--divider--cta--dark);
+    --digi--color--icon--primary: var(--digi--color--icon--primary--dark);
+    --digi--color--icon--secondary: var(--digi--color--icon--secondary--dark);
+    --digi--color--icon--cta: var(--digi--color--icon--cta--dark);
+    --digi--color--icon--brand-primary: var(--digi--color--icon--brand-primary--dark);
+    --digi--color--icon--brand-secondary: var(--digi--color--icon--brand-secondary--dark);
+    --digi--color--icon--validation--success: var(--digi--color--icon--validation--success--dark);
+    --digi--color--icon--validation--warning: var(--digi--color--icon--validation--warning--dark);
+    --digi--color--icon--validation--error: var(--digi--color--icon--validation--error--dark);
+    --digi--color--misc--spinner-path: var(--digi--color--misc--spinner-path--dark);
+    --digi--color--misc--skeleton: var(--digi--color--misc--skeleton--dark);
+  }
+}
 body {
   font-size: 1rem;

package/dist/collection/components/_info-card/info-card/info-card.css CHANGED Viewed

@@ -1,7 +1,7 @@
 :host {
   --digi--info-card--background-color--primary: var(--digi--color--background--pop-out);
-  --digi--info-card--background-color--secondary: var(--digi--color--background--secondary);
-  --digi--info-card--background-color--related: var(--digi--color--background--primary);
+  --digi--info-card--background-color--secondary: var(--digi--color--background--secondary-elevated);
+  --digi--info-card--background-color--related: var(--digi--color--background--primary-elevated);
   --digi--info-card--color--heading: var(--digi--color--text--primary);
   --digi--info-card--color--heading--multi: var(--digi--color--text--interactive--primary);
   --digi--info-card--border: var(--digi--border-width--complementary-2) solid var(--digi--color--border--accent--primary);

package/dist/collection/components/_link/link/link.js CHANGED Viewed

@@ -59,7 +59,7 @@ export class Link {
         };
     }
     render() {
-        return (h(Host, { key: '1f02610030982ea53bc8b073d88a90c4a4b27e9b', class: Object.assign({ 'digi-link': true }, this.cssModifiers) }, !this.afLinkContainer && (h("a", { key: 'af4e33bf3c1e2f2ad0119d6c670f97b33955b5fa', href: this.afHref, onClick: (e) => this.clickLinkHandler(e), target: this.afTarget, rel: this.relation, ref: (el) => (this._link = el), "aria-describedby": this.afDescribedby, "aria-label": this.afAriaLabel, download: this.afDownload }, this.hasIcon && (h("div", { key: 'e0ef8bdf87c1b40ace1c9d510099c1a8f35ec71b', class: "digi-link__icon-wrapper", "aria-hidden": "true" }, h("slot", { key: '2a2eadfe7b69e385faea7a94d50a30f0722ceab5', name: "icon" }))), h("slot", { key: '6079c2fe6f6ea992999c942004b06839e2846264' }))), this.afLinkContainer && h("slot", { key: '40567f2b1d3480bf7aa1bddd171eaa800d014f4e' })));
+        return (h(Host, { key: '39f2ab8f08a13d1c4d7cae4dadc36b8670bb0fc0', class: Object.assign({ 'digi-link': true }, this.cssModifiers) }, !this.afLinkContainer && (h("a", { key: '66a8dc062b313986fe9c1faeb766c9e325ee5d86', href: this.afHref, onClick: (e) => this.clickLinkHandler(e), target: this.afTarget, rel: this.relation, ref: (el) => (this._link = el), "aria-describedby": this.afDescribedby, "aria-label": this.afAriaLabel, download: this.afDownload }, this.hasIcon && (h("div", { key: '03fdec9e4444f0cf7a2bfe7de1ba95ed82b62a38', class: "digi-link__icon-wrapper", "aria-hidden": "true" }, h("slot", { key: 'bb8a908170e7328e425b175b969e0b0a75302729', name: "icon" }))), h("slot", { key: 'cc3dfa7c092ea7f6272d14c5ae2889671eb2fd01' }))), this.afLinkContainer && h("slot", { key: '659499126035d0dc3c6bed718c692e9d891e1ddf' })));
     }
     static get is() { return "digi-link"; }
     static get encapsulation() { return "scoped"; }
@@ -83,7 +83,7 @@ export class Link {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [{

package/dist/collection/components/_link/link-button/link-button.js CHANGED Viewed

@@ -53,7 +53,7 @@ export class LinkButton {
         };
     }
     render() {
-        return (h(Host, { key: 'c9f062d32cc47d5adbb5c2e090e9523ee411d7e8', class: Object.assign({ 'digi-link-button': true }, this.cssModifiers) }, !this.afLinkContainer && (h("a", { key: 'fab754e4726eb0cc70023a5ad44809f15944ef3c', href: this.afHref, "aria-label": this.afAriaLabel, onClick: (e) => this.clickLinkHandler(e), ref: (el) => (this._link = el) }, h("span", { key: '2c02437a25767bcf9a0a5241c124b901cd37abe0', class: "digi-link-button__text" }, h("slot", { key: 'df64af167ee537b807a5e753794ae57bee87f7ad' })), this.hasNotification && h("slot", { key: '80f4fe7248f7cfd9fad5d4c07d9cb77e2eb8cbf5', name: "notification" }), h("digi-icon-chevron-right", { key: '44d34f6e592482a3587481171eb233e6f3393191', class: "digi-link-button__icon" }))), this.afLinkContainer && (h(Fragment, { key: 'bcdef2edf955fcfcf7ab4f9b873b45a043522088' }, h("slot", { key: '90aa716d8b34136e167f8895f89a1c54de14d927' }), this.hasNotification && h("slot", { key: '965b5232fc420234036d015a188c8694cdbd5de5', name: "notification" })))));
+        return (h(Host, { key: '912e033fb035df1cdd5ebb6ce8bc35f0b5f1c79f', class: Object.assign({ 'digi-link-button': true }, this.cssModifiers) }, !this.afLinkContainer && (h("a", { key: '4c519d24bb7876e50c38c1f01f117dc60dac79ba', href: this.afHref, "aria-label": this.afAriaLabel, onClick: (e) => this.clickLinkHandler(e), ref: (el) => (this._link = el) }, h("span", { key: 'b095e3ef659e5a20a8bd5d7397a4d17f914298bd', class: "digi-link-button__text" }, h("slot", { key: '9da0bde27b312b79310a36939cda71e5c44be19d' })), this.hasNotification && h("slot", { key: 'b19c63133b1014a0a6e1b6d95b81ae2d48638ba8', name: "notification" }), h("digi-icon-chevron-right", { key: '7ef41bd82490cdac4268a24c988d5d35c33e58c6', class: "digi-link-button__icon" }))), this.afLinkContainer && (h(Fragment, { key: '987a6cd83ff9959b53a098a27cbd43a7d8389ffb' }, h("slot", { key: 'c5ab750ed9828c9af326ab88bb3c750146b40677' }), this.hasNotification && h("slot", { key: '8edb1cae2d9438dd3a2bf82aaf3028f75d47f980', name: "notification" })))));
     }
     static get is() { return "digi-link-button"; }
     static get encapsulation() { return "scoped"; }
@@ -77,7 +77,7 @@ export class LinkButton {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [{

package/dist/collection/components/_link/link-external/link-external.js CHANGED Viewed

@@ -22,7 +22,7 @@ export class LinkExternal {
         };
     }
     render() {
-        return (h(Host, { key: 'fd51401c9fa0ab852d9e44af66dcd946a5d2e9e1' }, h("digi-link", { key: 'deb5a9d9f8155a40adee978953096920b6500566', class: Object.assign({ 'digi-link-external': true }, this.cssModifiers), afHref: this.afHref, onAfOnClick: (e) => this.clickLinkHandler(e), afTarget: this.afTarget, afDescribedby: this.afDescribedby, afAriaLabel: this.afAriaLabel }, h("digi-icon-external-link-alt", { key: '3fa6ae4913240c6b58d7c12ed2b2576632c614c1', class: "digi-link-external__icon", "aria-hidden": "true", slot: "icon" }), h("slot", { key: '3d80136ed787b51d57da623e72fd6440f6e1670b' }))));
+        return (h(Host, { key: '2b9cd17937699207be4cf903b556d8cd379a5b27' }, h("digi-link", { key: '8aedb5c22c93f2bb01ea8a8d750e5dc8c290b138', class: Object.assign({ 'digi-link-external': true }, this.cssModifiers), afHref: this.afHref, onAfOnClick: (e) => this.clickLinkHandler(e), afTarget: this.afTarget, afDescribedby: this.afDescribedby, afAriaLabel: this.afAriaLabel }, h("digi-icon-external-link-alt", { key: '86f554d686e7779eb0c289de5e92be46b3e8dfbe', class: "digi-link-external__icon", "aria-hidden": "true", slot: "icon" }), h("slot", { key: '5f7697d1c5110c209a39dcf9f6a35410b37ee3e3' }))));
     }
     static get is() { return "digi-link-external"; }
     static get encapsulation() { return "scoped"; }
@@ -46,7 +46,7 @@ export class LinkExternal {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [{