@pexip/components 16.16.0 → 17.0.0

package/design-tokens/generated/variables.css

@@ -0,0 +1,321 @@
+/* FILE GENERATED BY packages/components/design-tokens/build-scripts/variables.css DO NOT CHANGE */
+
+.light {
+    --border-accent: #0068f4;
+    --border-button-danger: #bb2526;
+    --border-button-disabled: #d2d2d2;
+    --border-button-focus: #71b4ff;
+    --border-button-form: #777777;
+    --border-button-secondary: #323232;
+    --border-button-success: #2c7806;
+    --border-button-tertiary: #c3c4c5;
+    --border-checkbo-disabled: #c3c4c5;
+    --border-checkbox-main: #777777;
+    --border-divider-primary: #dcdcdc;
+    --border-divider-secondary: #e6e6e6;
+    --border-divider-ultra: #989898;
+    --border-none: 0;
+    --border-primary: 1px;
+    --border-secondary: 2px;
+    --font-button-accent: #0068f4;
+    --font-button-call-active: #212121;
+    --font-button-call-disabled: #989898;
+    --font-button-call-error: #ffffff;
+    --font-button-call-hover: #ffffff;
+    --font-button-call-main: #ffffff;
+    --font-button-danger-primary: #ffffff;
+    --font-button-danger-tertiary: #ae191a;
+    --font-button-danger-tertiary-hover: #ffffff;
+    --font-button-primary: #ffffff;
+    --font-button-secondary: #323232;
+    --font-button-success-primary: #ffffff;
+    --font-button-success-tertiary: #256505;
+    --font-button-success-tertiary-hover: #ffffff;
+    --font-button-tertiary: #323232;
+    --font-button-tertiary-hover: #ffffff;
+    --font-button-text: #0156c9;
+    --font-button-trans: #323232;
+    --font-button-trans-ultra: #ffffff;
+    --font-charts-line-1: #0156c9;
+    --font-charts-line-10: #4e9f0d;
+    --font-charts-line-11: #c9e2b5;
+    --font-charts-line-12: #cc6228;
+    --font-charts-line-13: #ffc198;
+    --font-charts-line-14: #f89654;
+    --font-charts-line-15: #ffedd5;
+    --font-charts-line-2: #71b4ff;
+    --font-charts-line-3: #d2d2d2;
+    --font-charts-line-4: #989898;
+    --font-charts-line-5: #494949;
+    --font-charts-line-6: #0068f4;
+    --font-charts-line-7: #cee3ff;
+    --font-charts-line-8: #256505;
+    --font-charts-line-9: #9ad36b;
+    --font-icons-clickable-active: #323232;
+    --font-icons-clickable-hover: #323232;
+    --font-icons-clickable-main: #777777;
+    --font-icons-nonclickable-main: #323232;
+    --font-icons-nonclickable-secondary: #777777;
+    --font-text-accent: #0068f4;
+    --font-text-body: #323232;
+    --font-text-danger: #ae191a;
+    --font-text-danger-tertiary: #d73332;
+    --font-text-disabled: #c3c4c5;
+    --font-text-label: #323232;
+    --font-text-link: #0068f4;
+    --font-text-link-active: #0156c9;
+    --font-text-news: #4338ca;
+    --font-text-quaternary: #989898;
+    --font-text-secondary: #494949;
+    --font-text-success: #2c7806;
+    --font-text-success-ultra: #4e9f0d;
+    --font-text-tertiary: #777777;
+    --font-text-title: #212121;
+    --font-text-warning: #cc6228;
+    --font-toggle-off-disabled: #ffffff;
+    --font-toggle-off-hover: #ffffff;
+    --font-toggle-off-main: #ffffff;
+    --font-toggle-on-disabled: #ffffff;
+    --font-toggle-on-hover: #ffffff;
+    --font-toggle-on-main: #ffffff;
+    --radius-md: 16px;
+    --radius-none: 0;
+    --radius-sm: 8px;
+    --radius-xs: 4px;
+    --size-button-md: 40px;
+    --size-button-sm: 36px;
+    --size-button-sx: 30px;
+    --size-button-xl: 56px;
+    --surface-bcg-accent: #0068f4;
+    --surface-bcg-custom: #ffffff;
+    --surface-bcg-danger-10: #ffe5e5;
+    --surface-bcg-danger-20: #fecaca;
+    --surface-bcg-form: #f2f2f2;
+    --surface-bcg-form-hover: #e6e6e6;
+    --surface-bcg-highlight: #cee3ff;
+    --surface-bcg-highlight-subtle: #eff6ff;
+    --surface-bcg-info: #e0e7ff;
+    --surface-bcg-light: #d2d2d2;
+    --surface-bcg-menu-active: #dcdcdc;
+    --surface-bcg-menu-hover: #e6e6e6;
+    --surface-bcg-menu-main: #ffffff;
+    --surface-bcg-mildwarning: #fef9c3;
+    --surface-bcg-primary: #ffffff;
+    --surface-bcg-secondary: #f2f2f2;
+    --surface-bcg-success: #e8f7e0;
+    --surface-bcg-tertiar-hover: #f2f2f2;
+    --surface-bcg-tertiary: #f7f7f7;
+    --surface-bcg-transparent: #32323226;
+    --surface-bcg-ultralight: #e6e6e6;
+    --surface-bcg-warning: #ffedd5;
+    --surface-button-call-active: #ffffff;
+    --surface-button-call-disabled: #212121;
+    --surface-button-call-enabled-hover: #d2d2d2;
+    --surface-button-call-error: #d73332;
+    --surface-button-call-error-hover: #bb2526;
+    --surface-button-call-hover: #494949;
+    --surface-button-call-main: #212121;
+    --surface-button-danger-primary-active: #ae191a;
+    --surface-button-danger-primary-disabled: #e6e6e6;
+    --surface-button-danger-primary-hover: #bb2526;
+    --surface-button-danger-primary-main: #d73332;
+    --surface-button-danger-tertiary-active: #bb2526;
+    --surface-button-danger-tertiary-disabled: #ffffff;
+    --surface-button-danger-tertiary-hover: #d73332;
+    --surface-button-danger-tertiary-main: #ffffff;
+    --surface-button-primary-active: #1e40af;
+    --surface-button-primary-disabled: #e6e6e6;
+    --surface-button-primary-hover: #0156c9;
+    --surface-button-primary-main: #0068f4;
+    --surface-button-secondary-active: #dcdcdc;
+    --surface-button-secondary-disabled: #ffffff;
+    --surface-button-secondary-hover: #e6e6e6;
+    --surface-button-secondary-main: #ffffff;
+    --surface-button-success-primary-active: #256505;
+    --surface-button-success-primary-disabled: #e6e6e6;
+    --surface-button-success-primary-hover: #2c7806;
+    --surface-button-success-primary-main: #2c8500;
+    --surface-button-success-tertiary-active: #2c7806;
+    --surface-button-success-tertiary-disabled: #ffffff;
+    --surface-button-success-tertiary-hover: #2c8500;
+    --surface-button-success-tertiary-main: #ffffff;
+    --surface-button-tertiary-active: #0156c9;
+    --surface-button-tertiary-disabled: #ffffff;
+    --surface-button-tertiary-hover: #0068f4;
+    --surface-button-tertiary-main: #ffffff;
+    --surface-button-text-active: #dcdcdc;
+    --surface-button-text-disabled: #ffffff;
+    --surface-button-text-hover: #e6e6e6;
+    --surface-button-text-main: #ffffff;
+    --surface-button-trans-active: #dcdcdc;
+    --surface-button-trans-active-ultra: #323232;
+    --surface-button-trans-disabled: #e6e6e6;
+    --surface-button-trans-hover: #e6e6e6;
+    --surface-button-trans-main: #ffffff99;
+    --surface-toggle-off-disabled: #d2d2d2;
+    --surface-toggle-off-hover: #494949;
+    --surface-toggle-off-main: #777777;
+    --surface-toggle-on-disabled: #4490f6;
+    --surface-toggle-on-hover: #0156c9;
+    --surface-toggle-on-main: #0068f4;
+}
+
+.dark {
+    --border-accent: #4490f6;
+    --border-button-danger: #d73332;
+    --border-button-disabled: #494949;
+    --border-button-focus: #71b4ff;
+    --border-button-form: #777777;
+    --border-button-secondary: #ffffff;
+    --border-button-success: #2c8500;
+    --border-button-tertiary: #777777;
+    --border-checkbo-disabled: #777777;
+    --border-checkbox-main: #c3c4c5;
+    --border-divider-primary: #494949;
+    --border-divider-secondary: #323232;
+    --border-divider-ultra: #777777;
+    --border-none: 0;
+    --border-primary: 1px;
+    --border-secondary: 2px;
+    --font-button-accent: #4490f6;
+    --font-button-call-active: #212121;
+    --font-button-call-disabled: #989898;
+    --font-button-call-error: #ffffff;
+    --font-button-call-hover: #ffffff;
+    --font-button-call-main: #ffffff;
+    --font-button-danger-primary: #ffffff;
+    --font-button-danger-tertiary: #d73332;
+    --font-button-danger-tertiary-hover: #ffffff;
+    --font-button-primary: #ffffff;
+    --font-button-secondary: #ffffff;
+    --font-button-success-primary: #ffffff;
+    --font-button-success-tertiary: #2c8500;
+    --font-button-success-tertiary-hover: #ffffff;
+    --font-button-tertiary: #ffffff;
+    --font-button-tertiary-hover: #ffffff;
+    --font-button-text: #4490f6;
+    --font-button-trans: #ffffff;
+    --font-button-trans-ultra: #323232;
+    --font-charts-line-1: #ffffff;
+    --font-charts-line-10: #ffffff;
+    --font-charts-line-11: #ffffff;
+    --font-charts-line-12: #ffffff;
+    --font-charts-line-13: #ffffff;
+    --font-charts-line-14: #ffffff;
+    --font-charts-line-15: #ffffff;
+    --font-charts-line-2: #ffffff;
+    --font-charts-line-3: #ffffff;
+    --font-charts-line-4: #ffffff;
+    --font-charts-line-5: #ffffff;
+    --font-charts-line-6: #ffffff;
+    --font-charts-line-7: #ffffff;
+    --font-charts-line-8: #ffffff;
+    --font-charts-line-9: #ffffff;
+    --font-icons-clickable-active: #ffffff;
+    --font-icons-clickable-hover: #ffffff;
+    --font-icons-clickable-main: #c3c4c5;
+    --font-icons-nonclickable-main: #ffffff;
+    --font-icons-nonclickable-secondary: #989898;
+    --font-text-accent: #4490f6;
+    --font-text-body: #f7f7f7;
+    --font-text-danger: #d73332;
+    --font-text-danger-tertiary: #ae191a;
+    --font-text-disabled: #777777;
+    --font-text-label: #f7f7f7;
+    --font-text-link: #4490f6;
+    --font-text-link-active: #0068f4;
+    --font-text-news: #4f46e5;
+    --font-text-quaternary: #989898;
+    --font-text-secondary: #dcdcdc;
+    --font-text-success: #2c8500;
+    --font-text-success-ultra: #4e9f0d;
+    --font-text-tertiary: #d2d2d2;
+    --font-text-title: #ffffff;
+    --font-text-warning: #cc6228;
+    --font-toggle-off-disabled: #ffffff;
+    --font-toggle-off-hover: #ffffff;
+    --font-toggle-off-main: #ffffff;
+    --font-toggle-on-disabled: #ffffff;
+    --font-toggle-on-hover: #ffffff;
+    --font-toggle-on-main: #ffffff;
+    --radius-md: 0;
+    --radius-none: 0;
+    --radius-sm: 0;
+    --radius-xs: 0;
+    --size-button-md: 40px;
+    --size-button-sm: 36px;
+    --size-button-sx: 30px;
+    --size-button-xl: 56px;
+    --surface-bcg-accent: #4490f6;
+    --surface-bcg-custom: #212121;
+    --surface-bcg-danger-10: #ffe5e5;
+    --surface-bcg-danger-20: #fecaca;
+    --surface-bcg-form: #494949;
+    --surface-bcg-form-hover: #494949;
+    --surface-bcg-highlight: #cee3ff;
+    --surface-bcg-highlight-subtle: #eff6ff;
+    --surface-bcg-info: #e0e7ff;
+    --surface-bcg-light: #989898;
+    --surface-bcg-menu-active: #494949;
+    --surface-bcg-menu-hover: #494949;
+    --surface-bcg-menu-main: #323232;
+    --surface-bcg-mildwarning: #fef9c3;
+    --surface-bcg-primary: #212121;
+    --surface-bcg-secondary: #323232;
+    --surface-bcg-success: #e8f7e0;
+    --surface-bcg-tertiar-hover: #494949;
+    --surface-bcg-tertiary: #323232;
+    --surface-bcg-transparent: #ffffff99;
+    --surface-bcg-ultralight: #494949;
+    --surface-bcg-warning: #ffedd5;
+    --surface-button-call-active: #ffffff;
+    --surface-button-call-disabled: #212121;
+    --surface-button-call-enabled-hover: #d2d2d2;
+    --surface-button-call-error: #d73332;
+    --surface-button-call-error-hover: #bb2526;
+    --surface-button-call-hover: #494949;
+    --surface-button-call-main: #212121;
+    --surface-button-danger-primary-active: #bb2526;
+    --surface-button-danger-primary-disabled: #323232;
+    --surface-button-danger-primary-hover: #d73332;
+    --surface-button-danger-primary-main: #212121;
+    --surface-button-danger-tertiary-active: #bb2526;
+    --surface-button-danger-tertiary-disabled: #323232;
+    --surface-button-danger-tertiary-hover: #d73332;
+    --surface-button-danger-tertiary-main: #212121;
+    --surface-button-primary-active: #0068f4;
+    --surface-button-primary-disabled: #323232;
+    --surface-button-primary-hover: #1c76f0;
+    --surface-button-primary-main: #0068f4;
+    --surface-button-secondary-active: #777777;
+    --surface-button-secondary-disabled: #212121;
+    --surface-button-secondary-hover: #494949;
+    --surface-button-secondary-main: #212121;
+    --surface-button-success-primary-active: #256505;
+    --surface-button-success-primary-disabled: #323232;
+    --surface-button-success-primary-hover: #2c7806;
+    --surface-button-success-primary-main: #2c8500;
+    --surface-button-success-tertiary-active: #2c7806;
+    --surface-button-success-tertiary-disabled: #323232;
+    --surface-button-success-tertiary-hover: #2c8500;
+    --surface-button-success-tertiary-main: #212121;
+    --surface-button-tertiary-active: #0068f4;
+    --surface-button-tertiary-disabled: #212121;
+    --surface-button-tertiary-hover: #1c76f0;
+    --surface-button-tertiary-main: #212121;
+    --surface-button-text-active: #494949;
+    --surface-button-text-disabled: #323232;
+    --surface-button-text-hover: #323232;
+    --surface-button-text-main: #212121;
+    --surface-button-trans-active: #494949;
+    --surface-button-trans-active-ultra: #ffffff;
+    --surface-button-trans-disabled: #323232;
+    --surface-button-trans-hover: #494949;
+    --surface-button-trans-main: #32323226;
+    --surface-toggle-off-disabled: #d2d2d2;
+    --surface-toggle-off-hover: #494949;
+    --surface-toggle-off-main: #0068f4;
+    --surface-toggle-on-disabled: #4490f6;
+    --surface-toggle-on-hover: #0156c9;
+    --surface-toggle-on-main: #0068f4;
+}

package/design-tokens/generated/variables.ts

@@ -0,0 +1,322 @@
+/* FILE GENERATED BY packages/components/design-tokens/build-scripts/variables.ts DO NOT CHANGE */
+
+export const variables = {
+    light: {
+        'border/accent': '#0068f4',
+        'border/button/danger': '#bb2526',
+        'border/button/disabled': '#d2d2d2',
+        'border/button/focus': '#71b4ff',
+        'border/button/form': '#777777',
+        'border/button/secondary': '#323232',
+        'border/button/success': '#2c7806',
+        'border/button/tertiary': '#c3c4c5',
+        'border/checkbo-disabled': '#c3c4c5',
+        'border/checkbox-main': '#777777',
+        'border/divider-primary': '#dcdcdc',
+        'border/divider-secondary': '#e6e6e6',
+        'border/divider-ultra': '#989898',
+        'border/none': 0,
+        'border/primary': '1px',
+        'border/secondary': '2px',
+        'font/button/accent': '#0068f4',
+        'font/button/call-active': '#212121',
+        'font/button/call-disabled': '#989898',
+        'font/button/call-error': '#ffffff',
+        'font/button/call-hover': '#ffffff',
+        'font/button/call-main': '#ffffff',
+        'font/button/danger-primary': '#ffffff',
+        'font/button/danger-tertiary': '#ae191a',
+        'font/button/danger-tertiary-hover': '#ffffff',
+        'font/button/primary': '#ffffff',
+        'font/button/secondary': '#323232',
+        'font/button/success-primary': '#ffffff',
+        'font/button/success-tertiary': '#256505',
+        'font/button/success-tertiary-hover': '#ffffff',
+        'font/button/tertiary': '#323232',
+        'font/button/tertiary-hover': '#ffffff',
+        'font/button/text': '#0156c9',
+        'font/button/trans': '#323232',
+        'font/button/trans-ultra': '#ffffff',
+        'font/charts/line-1': '#0156c9',
+        'font/charts/line-10': '#4e9f0d',
+        'font/charts/line-11': '#c9e2b5',
+        'font/charts/line-12': '#cc6228',
+        'font/charts/line-13': '#ffc198',
+        'font/charts/line-14': '#f89654',
+        'font/charts/line-15': '#ffedd5',
+        'font/charts/line-2': '#71b4ff',
+        'font/charts/line-3': '#d2d2d2',
+        'font/charts/line-4': '#989898',
+        'font/charts/line-5': '#494949',
+        'font/charts/line-6': '#0068f4',
+        'font/charts/line-7': '#cee3ff',
+        'font/charts/line-8': '#256505',
+        'font/charts/line-9': '#9ad36b',
+        'font/icons/clickable-active': '#323232',
+        'font/icons/clickable-hover': '#323232',
+        'font/icons/clickable-main': '#777777',
+        'font/icons/nonclickable-main': '#323232',
+        'font/icons/nonclickable-secondary': '#777777',
+        'font/text/accent': '#0068f4',
+        'font/text/body': '#323232',
+        'font/text/danger': '#ae191a',
+        'font/text/danger-tertiary': '#d73332',
+        'font/text/disabled': '#c3c4c5',
+        'font/text/label': '#323232',
+        'font/text/link': '#0068f4',
+        'font/text/link-active': '#0156c9',
+        'font/text/news': '#4338ca',
+        'font/text/quaternary': '#989898',
+        'font/text/secondary': '#494949',
+        'font/text/success': '#2c7806',
+        'font/text/success-ultra': '#4e9f0d',
+        'font/text/tertiary': '#777777',
+        'font/text/title': '#212121',
+        'font/text/warning': '#cc6228',
+        'font/toggle/off-disabled': '#ffffff',
+        'font/toggle/off-hover': '#ffffff',
+        'font/toggle/off-main': '#ffffff',
+        'font/toggle/on-disabled': '#ffffff',
+        'font/toggle/on-hover': '#ffffff',
+        'font/toggle/on-main': '#ffffff',
+        'radius/md': '16px',
+        'radius/none': 0,
+        'radius/sm': '8px',
+        'radius/xs': '4px',
+        'size/button-md': '40px',
+        'size/button-sm': '36px',
+        'size/button-sx': '30px',
+        'size/button-xl': '56px',
+        'surface/bcg/accent': '#0068f4',
+        'surface/bcg/custom': '#ffffff',
+        'surface/bcg/danger-10': '#ffe5e5',
+        'surface/bcg/danger-20': '#fecaca',
+        'surface/bcg/form': '#f2f2f2',
+        'surface/bcg/form-hover': '#e6e6e6',
+        'surface/bcg/highlight': '#cee3ff',
+        'surface/bcg/highlight-subtle': '#eff6ff',
+        'surface/bcg/info': '#e0e7ff',
+        'surface/bcg/light': '#d2d2d2',
+        'surface/bcg/menu-active': '#dcdcdc',
+        'surface/bcg/menu-hover': '#e6e6e6',
+        'surface/bcg/menu-main': '#ffffff',
+        'surface/bcg/mildwarning': '#fef9c3',
+        'surface/bcg/primary': '#ffffff',
+        'surface/bcg/secondary': '#f2f2f2',
+        'surface/bcg/success': '#e8f7e0',
+        'surface/bcg/tertiar-hover': '#f2f2f2',
+        'surface/bcg/tertiary': '#f7f7f7',
+        'surface/bcg/transparent': '#32323226',
+        'surface/bcg/ultralight': '#e6e6e6',
+        'surface/bcg/warning': '#ffedd5',
+        'surface/button/call/active': '#ffffff',
+        'surface/button/call/disabled': '#212121',
+        'surface/button/call/enabled-hover': '#d2d2d2',
+        'surface/button/call/error': '#d73332',
+        'surface/button/call/error-hover': '#bb2526',
+        'surface/button/call/hover': '#494949',
+        'surface/button/call/main': '#212121',
+        'surface/button/danger/primary-active': '#ae191a',
+        'surface/button/danger/primary-disabled': '#e6e6e6',
+        'surface/button/danger/primary-hover': '#bb2526',
+        'surface/button/danger/primary-main': '#d73332',
+        'surface/button/danger/tertiary-active': '#bb2526',
+        'surface/button/danger/tertiary-disabled': '#ffffff',
+        'surface/button/danger/tertiary-hover': '#d73332',
+        'surface/button/danger/tertiary-main': '#ffffff',
+        'surface/button/primary/active': '#1e40af',
+        'surface/button/primary/disabled': '#e6e6e6',
+        'surface/button/primary/hover': '#0156c9',
+        'surface/button/primary/main': '#0068f4',
+        'surface/button/secondary/active': '#dcdcdc',
+        'surface/button/secondary/disabled': '#ffffff',
+        'surface/button/secondary/hover': '#e6e6e6',
+        'surface/button/secondary/main': '#ffffff',
+        'surface/button/success/primary-active': '#256505',
+        'surface/button/success/primary-disabled': '#e6e6e6',
+        'surface/button/success/primary-hover': '#2c7806',
+        'surface/button/success/primary-main': '#2c8500',
+        'surface/button/success/tertiary-active': '#2c7806',
+        'surface/button/success/tertiary-disabled': '#ffffff',
+        'surface/button/success/tertiary-hover': '#2c8500',
+        'surface/button/success/tertiary-main': '#ffffff',
+        'surface/button/tertiary/active': '#0156c9',
+        'surface/button/tertiary/disabled': '#ffffff',
+        'surface/button/tertiary/hover': '#0068f4',
+        'surface/button/tertiary/main': '#ffffff',
+        'surface/button/text/active': '#dcdcdc',
+        'surface/button/text/disabled': '#ffffff',
+        'surface/button/text/hover': '#e6e6e6',
+        'surface/button/text/main': '#ffffff',
+        'surface/button/trans/active': '#dcdcdc',
+        'surface/button/trans/active-ultra': '#323232',
+        'surface/button/trans/disabled': '#e6e6e6',
+        'surface/button/trans/hover': '#e6e6e6',
+        'surface/button/trans/main': '#ffffff99',
+        'surface/toggle/off-disabled': '#d2d2d2',
+        'surface/toggle/off-hover': '#494949',
+        'surface/toggle/off-main': '#777777',
+        'surface/toggle/on-disabled': '#4490f6',
+        'surface/toggle/on-hover': '#0156c9',
+        'surface/toggle/on-main': '#0068f4',
+    },
+    dark: {
+        'border/accent': '#4490f6',
+        'border/button/danger': '#d73332',
+        'border/button/disabled': '#494949',
+        'border/button/focus': '#71b4ff',
+        'border/button/form': '#777777',
+        'border/button/secondary': '#ffffff',
+        'border/button/success': '#2c8500',
+        'border/button/tertiary': '#777777',
+        'border/checkbo-disabled': '#777777',
+        'border/checkbox-main': '#c3c4c5',
+        'border/divider-primary': '#494949',
+        'border/divider-secondary': '#323232',
+        'border/divider-ultra': '#777777',
+        'border/none': 0,
+        'border/primary': '1px',
+        'border/secondary': '2px',
+        'font/button/accent': '#4490f6',
+        'font/button/call-active': '#212121',
+        'font/button/call-disabled': '#989898',
+        'font/button/call-error': '#ffffff',
+        'font/button/call-hover': '#ffffff',
+        'font/button/call-main': '#ffffff',
+        'font/button/danger-primary': '#ffffff',
+        'font/button/danger-tertiary': '#d73332',
+        'font/button/danger-tertiary-hover': '#ffffff',
+        'font/button/primary': '#ffffff',
+        'font/button/secondary': '#ffffff',
+        'font/button/success-primary': '#ffffff',
+        'font/button/success-tertiary': '#2c8500',
+        'font/button/success-tertiary-hover': '#ffffff',
+        'font/button/tertiary': '#ffffff',
+        'font/button/tertiary-hover': '#ffffff',
+        'font/button/text': '#4490f6',
+        'font/button/trans': '#ffffff',
+        'font/button/trans-ultra': '#323232',
+        'font/charts/line-1': '#ffffff',
+        'font/charts/line-10': '#ffffff',
+        'font/charts/line-11': '#ffffff',
+        'font/charts/line-12': '#ffffff',
+        'font/charts/line-13': '#ffffff',
+        'font/charts/line-14': '#ffffff',
+        'font/charts/line-15': '#ffffff',
+        'font/charts/line-2': '#ffffff',
+        'font/charts/line-3': '#ffffff',
+        'font/charts/line-4': '#ffffff',
+        'font/charts/line-5': '#ffffff',
+        'font/charts/line-6': '#ffffff',
+        'font/charts/line-7': '#ffffff',
+        'font/charts/line-8': '#ffffff',
+        'font/charts/line-9': '#ffffff',
+        'font/icons/clickable-active': '#ffffff',
+        'font/icons/clickable-hover': '#ffffff',
+        'font/icons/clickable-main': '#c3c4c5',
+        'font/icons/nonclickable-main': '#ffffff',
+        'font/icons/nonclickable-secondary': '#989898',
+        'font/text/accent': '#4490f6',
+        'font/text/body': '#f7f7f7',
+        'font/text/danger': '#d73332',
+        'font/text/danger-tertiary': '#ae191a',
+        'font/text/disabled': '#777777',
+        'font/text/label': '#f7f7f7',
+        'font/text/link': '#4490f6',
+        'font/text/link-active': '#0068f4',
+        'font/text/news': '#4f46e5',
+        'font/text/quaternary': '#989898',
+        'font/text/secondary': '#dcdcdc',
+        'font/text/success': '#2c8500',
+        'font/text/success-ultra': '#4e9f0d',
+        'font/text/tertiary': '#d2d2d2',
+        'font/text/title': '#ffffff',
+        'font/text/warning': '#cc6228',
+        'font/toggle/off-disabled': '#ffffff',
+        'font/toggle/off-hover': '#ffffff',
+        'font/toggle/off-main': '#ffffff',
+        'font/toggle/on-disabled': '#ffffff',
+        'font/toggle/on-hover': '#ffffff',
+        'font/toggle/on-main': '#ffffff',
+        'radius/md': 0,
+        'radius/none': 0,
+        'radius/sm': 0,
+        'radius/xs': 0,
+        'size/button-md': '40px',
+        'size/button-sm': '36px',
+        'size/button-sx': '30px',
+        'size/button-xl': '56px',
+        'surface/bcg/accent': '#4490f6',
+        'surface/bcg/custom': '#212121',
+        'surface/bcg/danger-10': '#ffe5e5',
+        'surface/bcg/danger-20': '#fecaca',
+        'surface/bcg/form': '#494949',
+        'surface/bcg/form-hover': '#494949',
+        'surface/bcg/highlight': '#cee3ff',
+        'surface/bcg/highlight-subtle': '#eff6ff',
+        'surface/bcg/info': '#e0e7ff',
+        'surface/bcg/light': '#989898',
+        'surface/bcg/menu-active': '#494949',
+        'surface/bcg/menu-hover': '#494949',
+        'surface/bcg/menu-main': '#323232',
+        'surface/bcg/mildwarning': '#fef9c3',
+        'surface/bcg/primary': '#212121',
+        'surface/bcg/secondary': '#323232',
+        'surface/bcg/success': '#e8f7e0',
+        'surface/bcg/tertiar-hover': '#494949',
+        'surface/bcg/tertiary': '#323232',
+        'surface/bcg/transparent': '#ffffff99',
+        'surface/bcg/ultralight': '#494949',
+        'surface/bcg/warning': '#ffedd5',
+        'surface/button/call/active': '#ffffff',
+        'surface/button/call/disabled': '#212121',
+        'surface/button/call/enabled-hover': '#d2d2d2',
+        'surface/button/call/error': '#d73332',
+        'surface/button/call/error-hover': '#bb2526',
+        'surface/button/call/hover': '#494949',
+        'surface/button/call/main': '#212121',
+        'surface/button/danger/primary-active': '#bb2526',
+        'surface/button/danger/primary-disabled': '#323232',
+        'surface/button/danger/primary-hover': '#d73332',
+        'surface/button/danger/primary-main': '#212121',
+        'surface/button/danger/tertiary-active': '#bb2526',
+        'surface/button/danger/tertiary-disabled': '#323232',
+        'surface/button/danger/tertiary-hover': '#d73332',
+        'surface/button/danger/tertiary-main': '#212121',
+        'surface/button/primary/active': '#0068f4',
+        'surface/button/primary/disabled': '#323232',
+        'surface/button/primary/hover': '#1c76f0',
+        'surface/button/primary/main': '#0068f4',
+        'surface/button/secondary/active': '#777777',
+        'surface/button/secondary/disabled': '#212121',
+        'surface/button/secondary/hover': '#494949',
+        'surface/button/secondary/main': '#212121',
+        'surface/button/success/primary-active': '#256505',
+        'surface/button/success/primary-disabled': '#323232',
+        'surface/button/success/primary-hover': '#2c7806',
+        'surface/button/success/primary-main': '#2c8500',
+        'surface/button/success/tertiary-active': '#2c7806',
+        'surface/button/success/tertiary-disabled': '#323232',
+        'surface/button/success/tertiary-hover': '#2c8500',
+        'surface/button/success/tertiary-main': '#212121',
+        'surface/button/tertiary/active': '#0068f4',
+        'surface/button/tertiary/disabled': '#212121',
+        'surface/button/tertiary/hover': '#1c76f0',
+        'surface/button/tertiary/main': '#212121',
+        'surface/button/text/active': '#494949',
+        'surface/button/text/disabled': '#323232',
+        'surface/button/text/hover': '#323232',
+        'surface/button/text/main': '#212121',
+        'surface/button/trans/active': '#494949',
+        'surface/button/trans/active-ultra': '#ffffff',
+        'surface/button/trans/disabled': '#323232',
+        'surface/button/trans/hover': '#494949',
+        'surface/button/trans/main': '#32323226',
+        'surface/toggle/off-disabled': '#d2d2d2',
+        'surface/toggle/off-hover': '#494949',
+        'surface/toggle/off-main': '#0068f4',
+        'surface/toggle/on-disabled': '#4490f6',
+        'surface/toggle/on-hover': '#0156c9',
+        'surface/toggle/on-main': '#0068f4',
+    },
+};

package/design-tokens/mixins/_ellipsis.scss

@@ -4,3 +4,14 @@
     text-overflow: ellipsis;
     white-space: nowrap;
 }
+
+@mixin ellipsis-multiline($lines: 2) {
+    -webkit-box-orient: vertical;
+    /* stylelint-disable value-no-vendor-prefix -- need this value for display prop otherwise it does not work, tested and works well in all major browsers */
+    display: -webkit-box;
+    -webkit-line-clamp: #{$lines};
+    line-clamp: #{$lines};
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: normal;
+}