vira 31.14.0 → 31.15.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 (11) hide show
  1. package/dist/elements/vira-button.element.d.ts +1 -1
  2. package/dist/elements/vira-tabs.element.d.ts +1 -1
  3. package/dist/elements/vira-tag.element.d.ts +1 -1
  4. package/dist/styles/form-variants.d.ts +3 -1
  5. package/dist/styles/form-variants.js +4 -0
  6. package/dist/styles/vira-color-palette.d.ts +19 -0
  7. package/dist/styles/vira-color-palette.js +19 -0
  8. package/dist/styles/vira-color-theme-object.d.ts +1 -1
  9. package/dist/styles/vira-color-theme.d.ts +288 -0
  10. package/dist/styles/vira-color-theme.js +258 -0
  11. package/package.json +1 -1
package/dist/elements/vira-button.element.d.ts CHANGED
@@ -39,4 +39,4 @@ export declare const ViraButton: import("element-vir").DeclarativeElementDefinit
39
39
  * @default false
40
40
  */
41
41
  showMenuCaret: boolean;
42
- }>, {}, {}, "vira-button-with-menu-caret" | "vira-button-size-large" | "vira-button-size-medium" | "vira-button-size-small" | "vira-button-emphasis-standard" | "vira-button-emphasis-subtle" | "vira-button-color-info" | "vira-button-color-plain" | "vira-button-color-neutral" | "vira-button-color-danger" | "vira-button-color-warning" | "vira-button-color-positive" | "vira-button-color-special" | "vira-button-disabled" | "vira-button-icon-only", "vira-button-text-color" | "vira-button-background-color" | "vira-button-border-color" | "vira-button-hover-text-color" | "vira-button-hover-background-color" | "vira-button-hover-border-color" | "vira-button-active-text-color" | "vira-button-active-background-color" | "vira-button-active-border-color" | "vira-button-disabled-text-color" | "vira-button-disabled-background-color" | "vira-button-disabled-border-color" | "vira-button-border-width" | "vira-button-border-radius", readonly [], readonly []>;
42
+ }>, {}, {}, "vira-button-with-menu-caret" | "vira-button-size-large" | "vira-button-size-medium" | "vira-button-size-small" | "vira-button-emphasis-standard" | "vira-button-emphasis-subtle" | "vira-button-color-info" | "vira-button-color-plain" | "vira-button-color-neutral" | "vira-button-color-danger" | "vira-button-color-warning" | "vira-button-color-positive" | "vira-button-color-brand" | "vira-button-color-special" | "vira-button-disabled" | "vira-button-icon-only", "vira-button-text-color" | "vira-button-background-color" | "vira-button-border-color" | "vira-button-hover-text-color" | "vira-button-hover-background-color" | "vira-button-hover-border-color" | "vira-button-active-text-color" | "vira-button-active-background-color" | "vira-button-active-border-color" | "vira-button-disabled-text-color" | "vira-button-disabled-background-color" | "vira-button-disabled-border-color" | "vira-button-border-width" | "vira-button-border-radius", readonly [], readonly []>;
package/dist/elements/vira-tabs.element.d.ts CHANGED
@@ -85,4 +85,4 @@ export declare const ViraTabs: import("element-vir").DeclarativeElementDefinitio
85
85
  }, {
86
86
  /** Fires when a tab is clicked with the corresponding tab entry. */
87
87
  tabSelect: import("element-vir").DefineEvent<Readonly<ViraTab>>;
88
- }, "vira-tabs-bar-top" | "vira-tabs-bar-bottom" | "vira-tabs-bar-left" | "vira-tabs-bar-right" | "vira-tabs-color-info" | "vira-tabs-color-plain" | "vira-tabs-color-neutral" | "vira-tabs-color-danger" | "vira-tabs-color-warning" | "vira-tabs-color-positive" | "vira-tabs-color-special" | "vira-tabs-icon-layout-vertical" | "vira-tabs-icon-layout-horizontal" | "vira-tabs-overflowing" | "vira-tabs-fill-width", "vira-tabs-active-color" | "vira-tabs-active-hover-color" | "vira-tabs-inactive-color" | "vira-tabs-inactive-hover-color" | "vira-tabs-bar-thickness", readonly [], readonly []>;
88
+ }, "vira-tabs-bar-top" | "vira-tabs-bar-bottom" | "vira-tabs-bar-left" | "vira-tabs-bar-right" | "vira-tabs-color-info" | "vira-tabs-color-plain" | "vira-tabs-color-neutral" | "vira-tabs-color-danger" | "vira-tabs-color-warning" | "vira-tabs-color-positive" | "vira-tabs-color-brand" | "vira-tabs-color-special" | "vira-tabs-icon-layout-vertical" | "vira-tabs-icon-layout-horizontal" | "vira-tabs-overflowing" | "vira-tabs-fill-width", "vira-tabs-active-color" | "vira-tabs-active-hover-color" | "vira-tabs-inactive-color" | "vira-tabs-inactive-hover-color" | "vira-tabs-bar-thickness", readonly [], readonly []>;
package/dist/elements/vira-tag.element.d.ts CHANGED
@@ -32,4 +32,4 @@ export declare const ViraTag: import("element-vir").DeclarativeElementDefinition
32
32
  }>, {}, {
33
33
  toggle: import("element-vir").DefineEvent<boolean>;
34
34
  cancel: import("element-vir").DefineEvent<void>;
35
- }, "vira-tag-selectable" | "vira-tag-checked" | "vira-tag-not-checked" | "vira-tag-cancellable" | "vira-tag-not-clickable" | "vira-tag-disabled" | "vira-tag-size-large" | "vira-tag-size-medium" | "vira-tag-size-small" | "vira-tag-emphasis-standard" | "vira-tag-emphasis-subtle" | "vira-tag-color-info" | "vira-tag-color-plain" | "vira-tag-color-neutral" | "vira-tag-color-danger" | "vira-tag-color-warning" | "vira-tag-color-positive" | "vira-tag-color-special", "vira-tag-text-color" | "vira-tag-background-color" | "vira-tag-border-color" | "vira-tag-hover-text-color" | "vira-tag-hover-background-color" | "vira-tag-hover-border-color" | "vira-tag-active-text-color" | "vira-tag-active-background-color" | "vira-tag-active-border-color" | "vira-tag-disabled-text-color" | "vira-tag-disabled-background-color" | "vira-tag-disabled-border-color" | "vira-tag-border-radius" | "vira-tag-gap" | "vira-tag-horizontal-padding" | "vira-tag-border-width", readonly [], readonly []>;
35
+ }, "vira-tag-selectable" | "vira-tag-checked" | "vira-tag-not-checked" | "vira-tag-cancellable" | "vira-tag-not-clickable" | "vira-tag-disabled" | "vira-tag-size-large" | "vira-tag-size-medium" | "vira-tag-size-small" | "vira-tag-emphasis-standard" | "vira-tag-emphasis-subtle" | "vira-tag-color-info" | "vira-tag-color-plain" | "vira-tag-color-neutral" | "vira-tag-color-danger" | "vira-tag-color-warning" | "vira-tag-color-positive" | "vira-tag-color-brand" | "vira-tag-color-special", "vira-tag-text-color" | "vira-tag-background-color" | "vira-tag-border-color" | "vira-tag-hover-text-color" | "vira-tag-hover-background-color" | "vira-tag-hover-border-color" | "vira-tag-active-text-color" | "vira-tag-active-background-color" | "vira-tag-active-border-color" | "vira-tag-disabled-text-color" | "vira-tag-disabled-background-color" | "vira-tag-disabled-border-color" | "vira-tag-border-radius" | "vira-tag-gap" | "vira-tag-horizontal-padding" | "vira-tag-border-width", readonly [], readonly []>;
package/dist/styles/form-variants.d.ts CHANGED
@@ -21,6 +21,8 @@ export declare enum ViraColorVariant {
21
21
  Warning = "warning",
22
22
  /** @default green colored */
23
23
  Positive = "positive",
24
+ /** @default brand colored */
25
+ Brand = "brand",
24
26
  /** @default purple colored */
25
27
  Special = "special",
26
28
  /**
@@ -41,7 +43,7 @@ export declare const viraColorVariantToColorName: Record<ViraColorVariant, ViraT
41
43
  *
42
44
  * @category Internal
43
45
  */
44
- export declare const viraColorVariants: readonly [ViraColorVariant.Info, ViraColorVariant.Plain, ViraColorVariant.Neutral, ViraColorVariant.Danger, ViraColorVariant.Warning, ViraColorVariant.Positive, ViraColorVariant.Special];
46
+ export declare const viraColorVariants: readonly [ViraColorVariant.Info, ViraColorVariant.Plain, ViraColorVariant.Neutral, ViraColorVariant.Danger, ViraColorVariant.Warning, ViraColorVariant.Positive, ViraColorVariant.Brand, ViraColorVariant.Special];
45
47
  /**
46
48
  * All available variants for controlling vira form sizes.
47
49
  *
package/dist/styles/form-variants.js CHANGED
@@ -22,6 +22,8 @@ export var ViraColorVariant;
22
22
  ViraColorVariant["Warning"] = "warning";
23
23
  /** @default green colored */
24
24
  ViraColorVariant["Positive"] = "positive";
25
+ /** @default brand colored */
26
+ ViraColorVariant["Brand"] = "brand";
25
27
  /** @default purple colored */
26
28
  ViraColorVariant["Special"] = "special";
27
29
  /**
@@ -42,6 +44,7 @@ export const viraColorVariantToColorName = {
42
44
  [ViraColorVariant.Danger]: ViraThemeColorName.red,
43
45
  [ViraColorVariant.Warning]: ViraThemeColorName.yellow,
44
46
  [ViraColorVariant.Positive]: ViraThemeColorName.green,
47
+ [ViraColorVariant.Brand]: ViraThemeColorName.brand,
45
48
  [ViraColorVariant.Special]: ViraThemeColorName.purple,
46
49
  [ViraColorVariant.Plain]: ViraThemeColorName.grey,
47
50
  [ViraColorVariant.None]: ViraThemeColorName.grey,
@@ -58,6 +61,7 @@ export const viraColorVariants = [
58
61
  ViraColorVariant.Danger,
59
62
  ViraColorVariant.Warning,
60
63
  ViraColorVariant.Positive,
64
+ ViraColorVariant.Brand,
61
65
  ViraColorVariant.Special,
62
66
  ];
63
67
  /**
package/dist/styles/vira-color-palette.d.ts CHANGED
@@ -99,6 +99,25 @@ export declare const viraColorPalette: import("lit-css-vars").CssVarDefinitions<
99
99
  readonly 'vira-blue-900': "#1B345D";
100
100
  readonly 'vira-blue-950': "#172C4F";
101
101
  readonly 'vira-blue-1000': "#142540";
102
+ readonly 'vira-brand-100': "#F5F9FF";
103
+ readonly 'vira-brand-150': "#EAF3FF";
104
+ readonly 'vira-brand-200': "#E0EDFF";
105
+ readonly 'vira-brand-250': "#D6E7FF";
106
+ readonly 'vira-brand-300': "#CBDFFF";
107
+ readonly 'vira-brand-350': "#B9D4FF";
108
+ readonly 'vira-brand-400': "#9EC3FF";
109
+ readonly 'vira-brand-450': "#7AADFF";
110
+ readonly 'vira-brand-500': "#5697FF";
111
+ readonly 'vira-brand-550': "#4988ED";
112
+ readonly 'vira-brand-600': "#427DDC";
113
+ readonly 'vira-brand-650': "#3B72CA";
114
+ readonly 'vira-brand-700': "#3365B6";
115
+ readonly 'vira-brand-750': "#2D569A";
116
+ readonly 'vira-brand-800': "#27487E";
117
+ readonly 'vira-brand-850': "#203D6C";
118
+ readonly 'vira-brand-900': "#1B345D";
119
+ readonly 'vira-brand-950': "#172C4F";
120
+ readonly 'vira-brand-1000': "#142540";
102
121
  readonly 'vira-purple-100': "#F9F7FF";
103
122
  readonly 'vira-purple-150': "#F3EFFF";
104
123
  readonly 'vira-purple-200': "#EDE8FF";
package/dist/styles/vira-color-palette.js CHANGED
@@ -100,6 +100,25 @@ export const viraColorPalette = defineCssVars({
100
100
  'vira-blue-900': '#1B345D',
101
101
  'vira-blue-950': '#172C4F',
102
102
  'vira-blue-1000': '#142540',
103
+ 'vira-brand-100': '#F5F9FF',
104
+ 'vira-brand-150': '#EAF3FF',
105
+ 'vira-brand-200': '#E0EDFF',
106
+ 'vira-brand-250': '#D6E7FF',
107
+ 'vira-brand-300': '#CBDFFF',
108
+ 'vira-brand-350': '#B9D4FF',
109
+ 'vira-brand-400': '#9EC3FF',
110
+ 'vira-brand-450': '#7AADFF',
111
+ 'vira-brand-500': '#5697FF',
112
+ 'vira-brand-550': '#4988ED',
113
+ 'vira-brand-600': '#427DDC',
114
+ 'vira-brand-650': '#3B72CA',
115
+ 'vira-brand-700': '#3365B6',
116
+ 'vira-brand-750': '#2D569A',
117
+ 'vira-brand-800': '#27487E',
118
+ 'vira-brand-850': '#203D6C',
119
+ 'vira-brand-900': '#1B345D',
120
+ 'vira-brand-950': '#172C4F',
121
+ 'vira-brand-1000': '#142540',
103
122
  'vira-purple-100': '#F9F7FF',
104
123
  'vira-purple-150': '#F3EFFF',
105
124
  'vira-purple-200': '#EDE8FF',
package/dist/styles/vira-color-theme-object.d.ts CHANGED
@@ -38,7 +38,7 @@ export type AllViraThemeKeys = keyof typeof viraTheme.colors;
38
38
  *
39
39
  * @category Internal
40
40
  */
41
- export declare const allViraThemeKeys: ("vira-red-foreground-highest-contrast" | "vira-red-foreground-small-body" | "vira-red-foreground-body" | "vira-red-foreground-non-body" | "vira-red-foreground-header" | "vira-red-foreground-placeholder" | "vira-red-foreground-decoration" | "vira-red-foreground-invisible" | "vira-red-foreground-lowest-contrast" | "vira-red-behind-bg-highest-contrast" | "vira-red-behind-bg-small-body" | "vira-red-behind-bg-body" | "vira-red-behind-bg-non-body" | "vira-red-behind-bg-header" | "vira-red-behind-bg-placeholder" | "vira-red-behind-bg-decoration" | "vira-red-behind-bg-invisible" | "vira-red-behind-bg-lowest-contrast" | "vira-red-behind-fg-highest-contrast" | "vira-red-behind-fg-small-body" | "vira-red-behind-fg-body" | "vira-red-behind-fg-non-body" | "vira-red-behind-fg-header" | "vira-red-behind-fg-placeholder" | "vira-red-behind-fg-decoration" | "vira-red-behind-fg-invisible" | "vira-red-behind-fg-lowest-contrast" | "vira-red-on-self-highest-contrast" | "vira-red-on-self-small-body" | "vira-red-on-self-body" | "vira-red-on-self-non-body" | "vira-red-on-self-header" | "vira-red-on-self-placeholder" | "vira-red-on-self-decoration" | "vira-red-on-self-invisible" | "vira-red-on-self-lowest-contrast" | "vira-yellow-foreground-highest-contrast" | "vira-yellow-foreground-small-body" | "vira-yellow-foreground-body" | "vira-yellow-foreground-non-body" | "vira-yellow-foreground-header" | "vira-yellow-foreground-placeholder" | "vira-yellow-foreground-decoration" | "vira-yellow-foreground-invisible" | "vira-yellow-foreground-lowest-contrast" | "vira-yellow-behind-bg-highest-contrast" | "vira-yellow-behind-bg-small-body" | "vira-yellow-behind-bg-body" | "vira-yellow-behind-bg-non-body" | "vira-yellow-behind-bg-header" | "vira-yellow-behind-bg-placeholder" | "vira-yellow-behind-bg-decoration" | "vira-yellow-behind-bg-invisible" | "vira-yellow-behind-bg-lowest-contrast" | "vira-yellow-behind-fg-highest-contrast" | "vira-yellow-behind-fg-small-body" | "vira-yellow-behind-fg-body" | "vira-yellow-behind-fg-non-body" | "vira-yellow-behind-fg-header" | "vira-yellow-behind-fg-placeholder" | "vira-yellow-behind-fg-decoration" | "vira-yellow-behind-fg-invisible" | "vira-yellow-behind-fg-lowest-contrast" | "vira-yellow-on-self-highest-contrast" | "vira-yellow-on-self-small-body" | "vira-yellow-on-self-body" | "vira-yellow-on-self-non-body" | "vira-yellow-on-self-header" | "vira-yellow-on-self-placeholder" | "vira-yellow-on-self-decoration" | "vira-yellow-on-self-invisible" | "vira-yellow-on-self-lowest-contrast" | "vira-green-foreground-highest-contrast" | "vira-green-foreground-small-body" | "vira-green-foreground-body" | "vira-green-foreground-non-body" | "vira-green-foreground-header" | "vira-green-foreground-placeholder" | "vira-green-foreground-decoration" | "vira-green-foreground-invisible" | "vira-green-foreground-lowest-contrast" | "vira-green-behind-bg-highest-contrast" | "vira-green-behind-bg-small-body" | "vira-green-behind-bg-body" | "vira-green-behind-bg-non-body" | "vira-green-behind-bg-header" | "vira-green-behind-bg-placeholder" | "vira-green-behind-bg-decoration" | "vira-green-behind-bg-invisible" | "vira-green-behind-bg-lowest-contrast" | "vira-green-behind-fg-highest-contrast" | "vira-green-behind-fg-small-body" | "vira-green-behind-fg-body" | "vira-green-behind-fg-non-body" | "vira-green-behind-fg-header" | "vira-green-behind-fg-placeholder" | "vira-green-behind-fg-decoration" | "vira-green-behind-fg-invisible" | "vira-green-behind-fg-lowest-contrast" | "vira-green-on-self-highest-contrast" | "vira-green-on-self-small-body" | "vira-green-on-self-body" | "vira-green-on-self-non-body" | "vira-green-on-self-header" | "vira-green-on-self-placeholder" | "vira-green-on-self-decoration" | "vira-green-on-self-invisible" | "vira-green-on-self-lowest-contrast" | "vira-teal-foreground-highest-contrast" | "vira-teal-foreground-small-body" | "vira-teal-foreground-body" | "vira-teal-foreground-non-body" | "vira-teal-foreground-header" | "vira-teal-foreground-placeholder" | "vira-teal-foreground-decoration" | "vira-teal-foreground-invisible" | "vira-teal-foreground-lowest-contrast" | "vira-teal-behind-bg-highest-contrast" | "vira-teal-behind-bg-small-body" | "vira-teal-behind-bg-body" | "vira-teal-behind-bg-non-body" | "vira-teal-behind-bg-header" | "vira-teal-behind-bg-placeholder" | "vira-teal-behind-bg-decoration" | "vira-teal-behind-bg-invisible" | "vira-teal-behind-bg-lowest-contrast" | "vira-teal-behind-fg-highest-contrast" | "vira-teal-behind-fg-small-body" | "vira-teal-behind-fg-body" | "vira-teal-behind-fg-non-body" | "vira-teal-behind-fg-header" | "vira-teal-behind-fg-placeholder" | "vira-teal-behind-fg-decoration" | "vira-teal-behind-fg-invisible" | "vira-teal-behind-fg-lowest-contrast" | "vira-teal-on-self-highest-contrast" | "vira-teal-on-self-small-body" | "vira-teal-on-self-body" | "vira-teal-on-self-non-body" | "vira-teal-on-self-header" | "vira-teal-on-self-placeholder" | "vira-teal-on-self-decoration" | "vira-teal-on-self-invisible" | "vira-teal-on-self-lowest-contrast" | "vira-blue-foreground-highest-contrast" | "vira-blue-foreground-small-body" | "vira-blue-foreground-body" | "vira-blue-foreground-non-body" | "vira-blue-foreground-header" | "vira-blue-foreground-placeholder" | "vira-blue-foreground-decoration" | "vira-blue-foreground-invisible" | "vira-blue-foreground-lowest-contrast" | "vira-blue-behind-bg-highest-contrast" | "vira-blue-behind-bg-small-body" | "vira-blue-behind-bg-body" | "vira-blue-behind-bg-non-body" | "vira-blue-behind-bg-header" | "vira-blue-behind-bg-placeholder" | "vira-blue-behind-bg-decoration" | "vira-blue-behind-bg-invisible" | "vira-blue-behind-bg-lowest-contrast" | "vira-blue-behind-fg-highest-contrast" | "vira-blue-behind-fg-small-body" | "vira-blue-behind-fg-body" | "vira-blue-behind-fg-non-body" | "vira-blue-behind-fg-header" | "vira-blue-behind-fg-placeholder" | "vira-blue-behind-fg-decoration" | "vira-blue-behind-fg-invisible" | "vira-blue-behind-fg-lowest-contrast" | "vira-blue-on-self-highest-contrast" | "vira-blue-on-self-small-body" | "vira-blue-on-self-body" | "vira-blue-on-self-non-body" | "vira-blue-on-self-header" | "vira-blue-on-self-placeholder" | "vira-blue-on-self-decoration" | "vira-blue-on-self-invisible" | "vira-blue-on-self-lowest-contrast" | "vira-purple-foreground-highest-contrast" | "vira-purple-foreground-small-body" | "vira-purple-foreground-body" | "vira-purple-foreground-non-body" | "vira-purple-foreground-header" | "vira-purple-foreground-placeholder" | "vira-purple-foreground-decoration" | "vira-purple-foreground-invisible" | "vira-purple-foreground-lowest-contrast" | "vira-purple-behind-bg-highest-contrast" | "vira-purple-behind-bg-small-body" | "vira-purple-behind-bg-body" | "vira-purple-behind-bg-non-body" | "vira-purple-behind-bg-header" | "vira-purple-behind-bg-placeholder" | "vira-purple-behind-bg-decoration" | "vira-purple-behind-bg-invisible" | "vira-purple-behind-bg-lowest-contrast" | "vira-purple-behind-fg-highest-contrast" | "vira-purple-behind-fg-small-body" | "vira-purple-behind-fg-body" | "vira-purple-behind-fg-non-body" | "vira-purple-behind-fg-header" | "vira-purple-behind-fg-placeholder" | "vira-purple-behind-fg-decoration" | "vira-purple-behind-fg-invisible" | "vira-purple-behind-fg-lowest-contrast" | "vira-purple-on-self-highest-contrast" | "vira-purple-on-self-small-body" | "vira-purple-on-self-body" | "vira-purple-on-self-non-body" | "vira-purple-on-self-header" | "vira-purple-on-self-placeholder" | "vira-purple-on-self-decoration" | "vira-purple-on-self-invisible" | "vira-purple-on-self-lowest-contrast" | "vira-pink-foreground-highest-contrast" | "vira-pink-foreground-small-body" | "vira-pink-foreground-body" | "vira-pink-foreground-non-body" | "vira-pink-foreground-header" | "vira-pink-foreground-placeholder" | "vira-pink-foreground-decoration" | "vira-pink-foreground-invisible" | "vira-pink-foreground-lowest-contrast" | "vira-pink-behind-bg-highest-contrast" | "vira-pink-behind-bg-small-body" | "vira-pink-behind-bg-body" | "vira-pink-behind-bg-non-body" | "vira-pink-behind-bg-header" | "vira-pink-behind-bg-placeholder" | "vira-pink-behind-bg-decoration" | "vira-pink-behind-bg-invisible" | "vira-pink-behind-bg-lowest-contrast" | "vira-pink-behind-fg-highest-contrast" | "vira-pink-behind-fg-small-body" | "vira-pink-behind-fg-body" | "vira-pink-behind-fg-non-body" | "vira-pink-behind-fg-header" | "vira-pink-behind-fg-placeholder" | "vira-pink-behind-fg-decoration" | "vira-pink-behind-fg-invisible" | "vira-pink-behind-fg-lowest-contrast" | "vira-pink-on-self-highest-contrast" | "vira-pink-on-self-small-body" | "vira-pink-on-self-body" | "vira-pink-on-self-non-body" | "vira-pink-on-self-header" | "vira-pink-on-self-placeholder" | "vira-pink-on-self-decoration" | "vira-pink-on-self-invisible" | "vira-pink-on-self-lowest-contrast" | "vira-grey-foreground-highest-contrast" | "vira-grey-foreground-small-body" | "vira-grey-foreground-body" | "vira-grey-foreground-non-body" | "vira-grey-foreground-header" | "vira-grey-foreground-placeholder" | "vira-grey-foreground-decoration" | "vira-grey-foreground-invisible" | "vira-grey-foreground-lowest-contrast" | "vira-grey-behind-bg-highest-contrast" | "vira-grey-behind-bg-small-body" | "vira-grey-behind-bg-body" | "vira-grey-behind-bg-non-body" | "vira-grey-behind-bg-header" | "vira-grey-behind-bg-placeholder" | "vira-grey-behind-bg-decoration" | "vira-grey-behind-bg-invisible" | "vira-grey-behind-bg-lowest-contrast" | "vira-grey-behind-fg-highest-contrast" | "vira-grey-behind-fg-small-body" | "vira-grey-behind-fg-body" | "vira-grey-behind-fg-non-body" | "vira-grey-behind-fg-header" | "vira-grey-behind-fg-placeholder" | "vira-grey-behind-fg-decoration" | "vira-grey-behind-fg-invisible" | "vira-grey-behind-fg-lowest-contrast" | "vira-grey-on-self-highest-contrast" | "vira-grey-on-self-small-body" | "vira-grey-on-self-body" | "vira-grey-on-self-non-body" | "vira-grey-on-self-header" | "vira-grey-on-self-placeholder" | "vira-grey-on-self-decoration" | "vira-grey-on-self-invisible" | "vira-grey-on-self-lowest-contrast" | "theme-default")[];
41
+ export declare const allViraThemeKeys: ("vira-red-foreground-highest-contrast" | "vira-red-foreground-small-body" | "vira-red-foreground-body" | "vira-red-foreground-non-body" | "vira-red-foreground-header" | "vira-red-foreground-placeholder" | "vira-red-foreground-decoration" | "vira-red-foreground-invisible" | "vira-red-foreground-lowest-contrast" | "vira-red-behind-bg-highest-contrast" | "vira-red-behind-bg-small-body" | "vira-red-behind-bg-body" | "vira-red-behind-bg-non-body" | "vira-red-behind-bg-header" | "vira-red-behind-bg-placeholder" | "vira-red-behind-bg-decoration" | "vira-red-behind-bg-invisible" | "vira-red-behind-bg-lowest-contrast" | "vira-red-behind-fg-highest-contrast" | "vira-red-behind-fg-small-body" | "vira-red-behind-fg-body" | "vira-red-behind-fg-non-body" | "vira-red-behind-fg-header" | "vira-red-behind-fg-placeholder" | "vira-red-behind-fg-decoration" | "vira-red-behind-fg-invisible" | "vira-red-behind-fg-lowest-contrast" | "vira-red-on-self-highest-contrast" | "vira-red-on-self-small-body" | "vira-red-on-self-body" | "vira-red-on-self-non-body" | "vira-red-on-self-header" | "vira-red-on-self-placeholder" | "vira-red-on-self-decoration" | "vira-red-on-self-invisible" | "vira-red-on-self-lowest-contrast" | "vira-yellow-foreground-highest-contrast" | "vira-yellow-foreground-small-body" | "vira-yellow-foreground-body" | "vira-yellow-foreground-non-body" | "vira-yellow-foreground-header" | "vira-yellow-foreground-placeholder" | "vira-yellow-foreground-decoration" | "vira-yellow-foreground-invisible" | "vira-yellow-foreground-lowest-contrast" | "vira-yellow-behind-bg-highest-contrast" | "vira-yellow-behind-bg-small-body" | "vira-yellow-behind-bg-body" | "vira-yellow-behind-bg-non-body" | "vira-yellow-behind-bg-header" | "vira-yellow-behind-bg-placeholder" | "vira-yellow-behind-bg-decoration" | "vira-yellow-behind-bg-invisible" | "vira-yellow-behind-bg-lowest-contrast" | "vira-yellow-behind-fg-highest-contrast" | "vira-yellow-behind-fg-small-body" | "vira-yellow-behind-fg-body" | "vira-yellow-behind-fg-non-body" | "vira-yellow-behind-fg-header" | "vira-yellow-behind-fg-placeholder" | "vira-yellow-behind-fg-decoration" | "vira-yellow-behind-fg-invisible" | "vira-yellow-behind-fg-lowest-contrast" | "vira-yellow-on-self-highest-contrast" | "vira-yellow-on-self-small-body" | "vira-yellow-on-self-body" | "vira-yellow-on-self-non-body" | "vira-yellow-on-self-header" | "vira-yellow-on-self-placeholder" | "vira-yellow-on-self-decoration" | "vira-yellow-on-self-invisible" | "vira-yellow-on-self-lowest-contrast" | "vira-green-foreground-highest-contrast" | "vira-green-foreground-small-body" | "vira-green-foreground-body" | "vira-green-foreground-non-body" | "vira-green-foreground-header" | "vira-green-foreground-placeholder" | "vira-green-foreground-decoration" | "vira-green-foreground-invisible" | "vira-green-foreground-lowest-contrast" | "vira-green-behind-bg-highest-contrast" | "vira-green-behind-bg-small-body" | "vira-green-behind-bg-body" | "vira-green-behind-bg-non-body" | "vira-green-behind-bg-header" | "vira-green-behind-bg-placeholder" | "vira-green-behind-bg-decoration" | "vira-green-behind-bg-invisible" | "vira-green-behind-bg-lowest-contrast" | "vira-green-behind-fg-highest-contrast" | "vira-green-behind-fg-small-body" | "vira-green-behind-fg-body" | "vira-green-behind-fg-non-body" | "vira-green-behind-fg-header" | "vira-green-behind-fg-placeholder" | "vira-green-behind-fg-decoration" | "vira-green-behind-fg-invisible" | "vira-green-behind-fg-lowest-contrast" | "vira-green-on-self-highest-contrast" | "vira-green-on-self-small-body" | "vira-green-on-self-body" | "vira-green-on-self-non-body" | "vira-green-on-self-header" | "vira-green-on-self-placeholder" | "vira-green-on-self-decoration" | "vira-green-on-self-invisible" | "vira-green-on-self-lowest-contrast" | "vira-teal-foreground-highest-contrast" | "vira-teal-foreground-small-body" | "vira-teal-foreground-body" | "vira-teal-foreground-non-body" | "vira-teal-foreground-header" | "vira-teal-foreground-placeholder" | "vira-teal-foreground-decoration" | "vira-teal-foreground-invisible" | "vira-teal-foreground-lowest-contrast" | "vira-teal-behind-bg-highest-contrast" | "vira-teal-behind-bg-small-body" | "vira-teal-behind-bg-body" | "vira-teal-behind-bg-non-body" | "vira-teal-behind-bg-header" | "vira-teal-behind-bg-placeholder" | "vira-teal-behind-bg-decoration" | "vira-teal-behind-bg-invisible" | "vira-teal-behind-bg-lowest-contrast" | "vira-teal-behind-fg-highest-contrast" | "vira-teal-behind-fg-small-body" | "vira-teal-behind-fg-body" | "vira-teal-behind-fg-non-body" | "vira-teal-behind-fg-header" | "vira-teal-behind-fg-placeholder" | "vira-teal-behind-fg-decoration" | "vira-teal-behind-fg-invisible" | "vira-teal-behind-fg-lowest-contrast" | "vira-teal-on-self-highest-contrast" | "vira-teal-on-self-small-body" | "vira-teal-on-self-body" | "vira-teal-on-self-non-body" | "vira-teal-on-self-header" | "vira-teal-on-self-placeholder" | "vira-teal-on-self-decoration" | "vira-teal-on-self-invisible" | "vira-teal-on-self-lowest-contrast" | "vira-blue-foreground-highest-contrast" | "vira-blue-foreground-small-body" | "vira-blue-foreground-body" | "vira-blue-foreground-non-body" | "vira-blue-foreground-header" | "vira-blue-foreground-placeholder" | "vira-blue-foreground-decoration" | "vira-blue-foreground-invisible" | "vira-blue-foreground-lowest-contrast" | "vira-blue-behind-bg-highest-contrast" | "vira-blue-behind-bg-small-body" | "vira-blue-behind-bg-body" | "vira-blue-behind-bg-non-body" | "vira-blue-behind-bg-header" | "vira-blue-behind-bg-placeholder" | "vira-blue-behind-bg-decoration" | "vira-blue-behind-bg-invisible" | "vira-blue-behind-bg-lowest-contrast" | "vira-blue-behind-fg-highest-contrast" | "vira-blue-behind-fg-small-body" | "vira-blue-behind-fg-body" | "vira-blue-behind-fg-non-body" | "vira-blue-behind-fg-header" | "vira-blue-behind-fg-placeholder" | "vira-blue-behind-fg-decoration" | "vira-blue-behind-fg-invisible" | "vira-blue-behind-fg-lowest-contrast" | "vira-blue-on-self-highest-contrast" | "vira-blue-on-self-small-body" | "vira-blue-on-self-body" | "vira-blue-on-self-non-body" | "vira-blue-on-self-header" | "vira-blue-on-self-placeholder" | "vira-blue-on-self-decoration" | "vira-blue-on-self-invisible" | "vira-blue-on-self-lowest-contrast" | "vira-brand-foreground-highest-contrast" | "vira-brand-foreground-small-body" | "vira-brand-foreground-body" | "vira-brand-foreground-non-body" | "vira-brand-foreground-header" | "vira-brand-foreground-placeholder" | "vira-brand-foreground-decoration" | "vira-brand-foreground-invisible" | "vira-brand-foreground-lowest-contrast" | "vira-brand-behind-bg-highest-contrast" | "vira-brand-behind-bg-small-body" | "vira-brand-behind-bg-body" | "vira-brand-behind-bg-non-body" | "vira-brand-behind-bg-header" | "vira-brand-behind-bg-placeholder" | "vira-brand-behind-bg-decoration" | "vira-brand-behind-bg-invisible" | "vira-brand-behind-bg-lowest-contrast" | "vira-brand-behind-fg-highest-contrast" | "vira-brand-behind-fg-small-body" | "vira-brand-behind-fg-body" | "vira-brand-behind-fg-non-body" | "vira-brand-behind-fg-header" | "vira-brand-behind-fg-placeholder" | "vira-brand-behind-fg-decoration" | "vira-brand-behind-fg-invisible" | "vira-brand-behind-fg-lowest-contrast" | "vira-brand-on-self-highest-contrast" | "vira-brand-on-self-small-body" | "vira-brand-on-self-body" | "vira-brand-on-self-non-body" | "vira-brand-on-self-header" | "vira-brand-on-self-placeholder" | "vira-brand-on-self-decoration" | "vira-brand-on-self-invisible" | "vira-brand-on-self-lowest-contrast" | "vira-purple-foreground-highest-contrast" | "vira-purple-foreground-small-body" | "vira-purple-foreground-body" | "vira-purple-foreground-non-body" | "vira-purple-foreground-header" | "vira-purple-foreground-placeholder" | "vira-purple-foreground-decoration" | "vira-purple-foreground-invisible" | "vira-purple-foreground-lowest-contrast" | "vira-purple-behind-bg-highest-contrast" | "vira-purple-behind-bg-small-body" | "vira-purple-behind-bg-body" | "vira-purple-behind-bg-non-body" | "vira-purple-behind-bg-header" | "vira-purple-behind-bg-placeholder" | "vira-purple-behind-bg-decoration" | "vira-purple-behind-bg-invisible" | "vira-purple-behind-bg-lowest-contrast" | "vira-purple-behind-fg-highest-contrast" | "vira-purple-behind-fg-small-body" | "vira-purple-behind-fg-body" | "vira-purple-behind-fg-non-body" | "vira-purple-behind-fg-header" | "vira-purple-behind-fg-placeholder" | "vira-purple-behind-fg-decoration" | "vira-purple-behind-fg-invisible" | "vira-purple-behind-fg-lowest-contrast" | "vira-purple-on-self-highest-contrast" | "vira-purple-on-self-small-body" | "vira-purple-on-self-body" | "vira-purple-on-self-non-body" | "vira-purple-on-self-header" | "vira-purple-on-self-placeholder" | "vira-purple-on-self-decoration" | "vira-purple-on-self-invisible" | "vira-purple-on-self-lowest-contrast" | "vira-pink-foreground-highest-contrast" | "vira-pink-foreground-small-body" | "vira-pink-foreground-body" | "vira-pink-foreground-non-body" | "vira-pink-foreground-header" | "vira-pink-foreground-placeholder" | "vira-pink-foreground-decoration" | "vira-pink-foreground-invisible" | "vira-pink-foreground-lowest-contrast" | "vira-pink-behind-bg-highest-contrast" | "vira-pink-behind-bg-small-body" | "vira-pink-behind-bg-body" | "vira-pink-behind-bg-non-body" | "vira-pink-behind-bg-header" | "vira-pink-behind-bg-placeholder" | "vira-pink-behind-bg-decoration" | "vira-pink-behind-bg-invisible" | "vira-pink-behind-bg-lowest-contrast" | "vira-pink-behind-fg-highest-contrast" | "vira-pink-behind-fg-small-body" | "vira-pink-behind-fg-body" | "vira-pink-behind-fg-non-body" | "vira-pink-behind-fg-header" | "vira-pink-behind-fg-placeholder" | "vira-pink-behind-fg-decoration" | "vira-pink-behind-fg-invisible" | "vira-pink-behind-fg-lowest-contrast" | "vira-pink-on-self-highest-contrast" | "vira-pink-on-self-small-body" | "vira-pink-on-self-body" | "vira-pink-on-self-non-body" | "vira-pink-on-self-header" | "vira-pink-on-self-placeholder" | "vira-pink-on-self-decoration" | "vira-pink-on-self-invisible" | "vira-pink-on-self-lowest-contrast" | "vira-grey-foreground-highest-contrast" | "vira-grey-foreground-small-body" | "vira-grey-foreground-body" | "vira-grey-foreground-non-body" | "vira-grey-foreground-header" | "vira-grey-foreground-placeholder" | "vira-grey-foreground-decoration" | "vira-grey-foreground-invisible" | "vira-grey-foreground-lowest-contrast" | "vira-grey-behind-bg-highest-contrast" | "vira-grey-behind-bg-small-body" | "vira-grey-behind-bg-body" | "vira-grey-behind-bg-non-body" | "vira-grey-behind-bg-header" | "vira-grey-behind-bg-placeholder" | "vira-grey-behind-bg-decoration" | "vira-grey-behind-bg-invisible" | "vira-grey-behind-bg-lowest-contrast" | "vira-grey-behind-fg-highest-contrast" | "vira-grey-behind-fg-small-body" | "vira-grey-behind-fg-body" | "vira-grey-behind-fg-non-body" | "vira-grey-behind-fg-header" | "vira-grey-behind-fg-placeholder" | "vira-grey-behind-fg-decoration" | "vira-grey-behind-fg-invisible" | "vira-grey-behind-fg-lowest-contrast" | "vira-grey-on-self-highest-contrast" | "vira-grey-on-self-small-body" | "vira-grey-on-self-body" | "vira-grey-on-self-non-body" | "vira-grey-on-self-header" | "vira-grey-on-self-placeholder" | "vira-grey-on-self-decoration" | "vira-grey-on-self-invisible" | "vira-grey-on-self-lowest-contrast" | "theme-default")[];
42
42
  /**
43
43
  * All {@link viraTheme} color pair keys with the contrast level suffix removed.
44
44
  *
package/dist/styles/vira-color-theme.d.ts CHANGED
@@ -903,6 +903,150 @@ export declare const viraTheme: import("theme-vir/dist/color-theme/color-theme.j
903
903
  readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
904
904
  readonly background: import("lit-css-vars").SingleCssVarDefinition;
905
905
  };
906
+ readonly 'vira-brand-foreground-highest-contrast': {
907
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
908
+ };
909
+ readonly 'vira-brand-foreground-small-body': {
910
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
911
+ };
912
+ readonly 'vira-brand-foreground-body': {
913
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
914
+ };
915
+ readonly 'vira-brand-foreground-non-body': {
916
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
917
+ };
918
+ readonly 'vira-brand-foreground-header': {
919
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
920
+ };
921
+ readonly 'vira-brand-foreground-placeholder': {
922
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
923
+ };
924
+ readonly 'vira-brand-foreground-decoration': {
925
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
926
+ };
927
+ readonly 'vira-brand-foreground-invisible': {
928
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
929
+ };
930
+ readonly 'vira-brand-foreground-lowest-contrast': {
931
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
932
+ };
933
+ readonly 'vira-brand-behind-bg-highest-contrast': {
934
+ readonly foreground: {
935
+ readonly refDefaultBackground: true;
936
+ };
937
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
938
+ };
939
+ readonly 'vira-brand-behind-bg-small-body': {
940
+ readonly foreground: {
941
+ readonly refDefaultBackground: true;
942
+ };
943
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
944
+ };
945
+ readonly 'vira-brand-behind-bg-body': {
946
+ readonly foreground: {
947
+ readonly refDefaultBackground: true;
948
+ };
949
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
950
+ };
951
+ readonly 'vira-brand-behind-bg-non-body': {
952
+ readonly foreground: {
953
+ readonly refDefaultBackground: true;
954
+ };
955
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
956
+ };
957
+ readonly 'vira-brand-behind-bg-header': {
958
+ readonly foreground: {
959
+ readonly refDefaultBackground: true;
960
+ };
961
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
962
+ };
963
+ readonly 'vira-brand-behind-bg-placeholder': {
964
+ readonly foreground: {
965
+ readonly refDefaultBackground: true;
966
+ };
967
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
968
+ };
969
+ readonly 'vira-brand-behind-bg-decoration': {
970
+ readonly foreground: {
971
+ readonly refDefaultBackground: true;
972
+ };
973
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
974
+ };
975
+ readonly 'vira-brand-behind-bg-invisible': {
976
+ readonly foreground: {
977
+ readonly refDefaultBackground: true;
978
+ };
979
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
980
+ };
981
+ readonly 'vira-brand-behind-bg-lowest-contrast': {
982
+ readonly foreground: {
983
+ readonly refDefaultBackground: true;
984
+ };
985
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
986
+ };
987
+ readonly 'vira-brand-behind-fg-highest-contrast': {
988
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
989
+ };
990
+ readonly 'vira-brand-behind-fg-small-body': {
991
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
992
+ };
993
+ readonly 'vira-brand-behind-fg-body': {
994
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
995
+ };
996
+ readonly 'vira-brand-behind-fg-non-body': {
997
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
998
+ };
999
+ readonly 'vira-brand-behind-fg-header': {
1000
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1001
+ };
1002
+ readonly 'vira-brand-behind-fg-placeholder': {
1003
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1004
+ };
1005
+ readonly 'vira-brand-behind-fg-decoration': {
1006
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1007
+ };
1008
+ readonly 'vira-brand-behind-fg-invisible': {
1009
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1010
+ };
1011
+ readonly 'vira-brand-behind-fg-lowest-contrast': {
1012
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1013
+ };
1014
+ readonly 'vira-brand-on-self-highest-contrast': {
1015
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
1016
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1017
+ };
1018
+ readonly 'vira-brand-on-self-small-body': {
1019
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
1020
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1021
+ };
1022
+ readonly 'vira-brand-on-self-body': {
1023
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
1024
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1025
+ };
1026
+ readonly 'vira-brand-on-self-non-body': {
1027
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
1028
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1029
+ };
1030
+ readonly 'vira-brand-on-self-header': {
1031
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
1032
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1033
+ };
1034
+ readonly 'vira-brand-on-self-placeholder': {
1035
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
1036
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1037
+ };
1038
+ readonly 'vira-brand-on-self-decoration': {
1039
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
1040
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1041
+ };
1042
+ readonly 'vira-brand-on-self-invisible': {
1043
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
1044
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1045
+ };
1046
+ readonly 'vira-brand-on-self-lowest-contrast': {
1047
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
1048
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
1049
+ };
906
1050
  readonly 'vira-purple-foreground-highest-contrast': {
907
1051
  readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
908
1052
  };
@@ -2062,6 +2206,150 @@ export declare const viraThemeDarkOverride: import("theme-vir").ColorThemeOverri
2062
2206
  readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2063
2207
  readonly background: import("lit-css-vars").SingleCssVarDefinition;
2064
2208
  };
2209
+ readonly 'vira-brand-foreground-highest-contrast': {
2210
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2211
+ };
2212
+ readonly 'vira-brand-foreground-small-body': {
2213
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2214
+ };
2215
+ readonly 'vira-brand-foreground-body': {
2216
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2217
+ };
2218
+ readonly 'vira-brand-foreground-non-body': {
2219
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2220
+ };
2221
+ readonly 'vira-brand-foreground-header': {
2222
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2223
+ };
2224
+ readonly 'vira-brand-foreground-placeholder': {
2225
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2226
+ };
2227
+ readonly 'vira-brand-foreground-decoration': {
2228
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2229
+ };
2230
+ readonly 'vira-brand-foreground-invisible': {
2231
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2232
+ };
2233
+ readonly 'vira-brand-foreground-lowest-contrast': {
2234
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2235
+ };
2236
+ readonly 'vira-brand-behind-bg-highest-contrast': {
2237
+ readonly foreground: {
2238
+ readonly refDefaultBackground: true;
2239
+ };
2240
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2241
+ };
2242
+ readonly 'vira-brand-behind-bg-small-body': {
2243
+ readonly foreground: {
2244
+ readonly refDefaultBackground: true;
2245
+ };
2246
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2247
+ };
2248
+ readonly 'vira-brand-behind-bg-body': {
2249
+ readonly foreground: {
2250
+ readonly refDefaultBackground: true;
2251
+ };
2252
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2253
+ };
2254
+ readonly 'vira-brand-behind-bg-non-body': {
2255
+ readonly foreground: {
2256
+ readonly refDefaultBackground: true;
2257
+ };
2258
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2259
+ };
2260
+ readonly 'vira-brand-behind-bg-header': {
2261
+ readonly foreground: {
2262
+ readonly refDefaultBackground: true;
2263
+ };
2264
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2265
+ };
2266
+ readonly 'vira-brand-behind-bg-placeholder': {
2267
+ readonly foreground: {
2268
+ readonly refDefaultBackground: true;
2269
+ };
2270
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2271
+ };
2272
+ readonly 'vira-brand-behind-bg-decoration': {
2273
+ readonly foreground: {
2274
+ readonly refDefaultBackground: true;
2275
+ };
2276
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2277
+ };
2278
+ readonly 'vira-brand-behind-bg-invisible': {
2279
+ readonly foreground: {
2280
+ readonly refDefaultBackground: true;
2281
+ };
2282
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2283
+ };
2284
+ readonly 'vira-brand-behind-bg-lowest-contrast': {
2285
+ readonly foreground: {
2286
+ readonly refDefaultBackground: true;
2287
+ };
2288
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2289
+ };
2290
+ readonly 'vira-brand-behind-fg-highest-contrast': {
2291
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2292
+ };
2293
+ readonly 'vira-brand-behind-fg-small-body': {
2294
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2295
+ };
2296
+ readonly 'vira-brand-behind-fg-body': {
2297
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2298
+ };
2299
+ readonly 'vira-brand-behind-fg-non-body': {
2300
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2301
+ };
2302
+ readonly 'vira-brand-behind-fg-header': {
2303
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2304
+ };
2305
+ readonly 'vira-brand-behind-fg-placeholder': {
2306
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2307
+ };
2308
+ readonly 'vira-brand-behind-fg-decoration': {
2309
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2310
+ };
2311
+ readonly 'vira-brand-behind-fg-invisible': {
2312
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2313
+ };
2314
+ readonly 'vira-brand-behind-fg-lowest-contrast': {
2315
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2316
+ };
2317
+ readonly 'vira-brand-on-self-highest-contrast': {
2318
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2319
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2320
+ };
2321
+ readonly 'vira-brand-on-self-small-body': {
2322
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2323
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2324
+ };
2325
+ readonly 'vira-brand-on-self-body': {
2326
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2327
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2328
+ };
2329
+ readonly 'vira-brand-on-self-non-body': {
2330
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2331
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2332
+ };
2333
+ readonly 'vira-brand-on-self-header': {
2334
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2335
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2336
+ };
2337
+ readonly 'vira-brand-on-self-placeholder': {
2338
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2339
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2340
+ };
2341
+ readonly 'vira-brand-on-self-decoration': {
2342
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2343
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2344
+ };
2345
+ readonly 'vira-brand-on-self-invisible': {
2346
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2347
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2348
+ };
2349
+ readonly 'vira-brand-on-self-lowest-contrast': {
2350
+ readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2351
+ readonly background: import("lit-css-vars").SingleCssVarDefinition;
2352
+ };
2065
2353
  readonly 'vira-purple-foreground-highest-contrast': {
2066
2354
  readonly foreground: import("lit-css-vars").SingleCssVarDefinition;
2067
2355
  };
package/dist/styles/vira-color-theme.js CHANGED
@@ -910,6 +910,150 @@ export const viraTheme = defineColorTheme({
910
910
  foreground: viraColorPalette['vira-blue-850'],
911
911
  background: viraColorPalette['vira-blue-1000'],
912
912
  },
913
+ 'vira-brand-foreground-highest-contrast': {
914
+ foreground: viraColorPalette['vira-brand-1000'],
915
+ },
916
+ 'vira-brand-foreground-small-body': {
917
+ foreground: viraColorPalette['vira-brand-1000'],
918
+ },
919
+ 'vira-brand-foreground-body': {
920
+ foreground: viraColorPalette['vira-brand-750'],
921
+ },
922
+ 'vira-brand-foreground-non-body': {
923
+ foreground: viraColorPalette['vira-brand-650'],
924
+ },
925
+ 'vira-brand-foreground-header': {
926
+ foreground: viraColorPalette['vira-brand-500'],
927
+ },
928
+ 'vira-brand-foreground-placeholder': {
929
+ foreground: viraColorPalette['vira-brand-450'],
930
+ },
931
+ 'vira-brand-foreground-decoration': {
932
+ foreground: viraColorPalette['vira-brand-350'],
933
+ },
934
+ 'vira-brand-foreground-invisible': {
935
+ foreground: viraColorPalette['vira-brand-250'],
936
+ },
937
+ 'vira-brand-foreground-lowest-contrast': {
938
+ foreground: viraColorPalette['vira-brand-100'],
939
+ },
940
+ 'vira-brand-behind-bg-highest-contrast': {
941
+ foreground: {
942
+ refDefaultBackground: true,
943
+ },
944
+ background: viraColorPalette['vira-brand-1000'],
945
+ },
946
+ 'vira-brand-behind-bg-small-body': {
947
+ foreground: {
948
+ refDefaultBackground: true,
949
+ },
950
+ background: viraColorPalette['vira-brand-1000'],
951
+ },
952
+ 'vira-brand-behind-bg-body': {
953
+ foreground: {
954
+ refDefaultBackground: true,
955
+ },
956
+ background: viraColorPalette['vira-brand-750'],
957
+ },
958
+ 'vira-brand-behind-bg-non-body': {
959
+ foreground: {
960
+ refDefaultBackground: true,
961
+ },
962
+ background: viraColorPalette['vira-brand-600'],
963
+ },
964
+ 'vira-brand-behind-bg-header': {
965
+ foreground: {
966
+ refDefaultBackground: true,
967
+ },
968
+ background: viraColorPalette['vira-brand-450'],
969
+ },
970
+ 'vira-brand-behind-bg-placeholder': {
971
+ foreground: {
972
+ refDefaultBackground: true,
973
+ },
974
+ background: viraColorPalette['vira-brand-400'],
975
+ },
976
+ 'vira-brand-behind-bg-decoration': {
977
+ foreground: {
978
+ refDefaultBackground: true,
979
+ },
980
+ background: viraColorPalette['vira-brand-350'],
981
+ },
982
+ 'vira-brand-behind-bg-invisible': {
983
+ foreground: {
984
+ refDefaultBackground: true,
985
+ },
986
+ background: viraColorPalette['vira-brand-250'],
987
+ },
988
+ 'vira-brand-behind-bg-lowest-contrast': {
989
+ foreground: {
990
+ refDefaultBackground: true,
991
+ },
992
+ background: viraColorPalette['vira-brand-100'],
993
+ },
994
+ 'vira-brand-behind-fg-highest-contrast': {
995
+ background: viraColorPalette['vira-brand-100'],
996
+ },
997
+ 'vira-brand-behind-fg-small-body': {
998
+ background: viraColorPalette['vira-brand-250'],
999
+ },
1000
+ 'vira-brand-behind-fg-body': {
1001
+ background: viraColorPalette['vira-brand-350'],
1002
+ },
1003
+ 'vira-brand-behind-fg-non-body': {
1004
+ background: viraColorPalette['vira-brand-400'],
1005
+ },
1006
+ 'vira-brand-behind-fg-header': {
1007
+ background: viraColorPalette['vira-brand-500'],
1008
+ },
1009
+ 'vira-brand-behind-fg-placeholder': {
1010
+ background: viraColorPalette['vira-brand-650'],
1011
+ },
1012
+ 'vira-brand-behind-fg-decoration': {
1013
+ background: viraColorPalette['vira-brand-750'],
1014
+ },
1015
+ 'vira-brand-behind-fg-invisible': {
1016
+ background: viraColorPalette['vira-brand-1000'],
1017
+ },
1018
+ 'vira-brand-behind-fg-lowest-contrast': {
1019
+ background: viraColorPalette['vira-brand-1000'],
1020
+ },
1021
+ 'vira-brand-on-self-highest-contrast': {
1022
+ foreground: viraColorPalette['vira-brand-850'],
1023
+ background: viraColorPalette['vira-brand-100'],
1024
+ },
1025
+ 'vira-brand-on-self-small-body': {
1026
+ foreground: viraColorPalette['vira-brand-850'],
1027
+ background: viraColorPalette['vira-brand-100'],
1028
+ },
1029
+ 'vira-brand-on-self-body': {
1030
+ foreground: viraColorPalette['vira-brand-850'],
1031
+ background: viraColorPalette['vira-brand-300'],
1032
+ },
1033
+ 'vira-brand-on-self-non-body': {
1034
+ foreground: viraColorPalette['vira-brand-850'],
1035
+ background: viraColorPalette['vira-brand-350'],
1036
+ },
1037
+ 'vira-brand-on-self-header': {
1038
+ foreground: viraColorPalette['vira-brand-850'],
1039
+ background: viraColorPalette['vira-brand-450'],
1040
+ },
1041
+ 'vira-brand-on-self-placeholder': {
1042
+ foreground: viraColorPalette['vira-brand-850'],
1043
+ background: viraColorPalette['vira-brand-550'],
1044
+ },
1045
+ 'vira-brand-on-self-decoration': {
1046
+ foreground: viraColorPalette['vira-brand-850'],
1047
+ background: viraColorPalette['vira-brand-650'],
1048
+ },
1049
+ 'vira-brand-on-self-invisible': {
1050
+ foreground: viraColorPalette['vira-brand-850'],
1051
+ background: viraColorPalette['vira-brand-1000'],
1052
+ },
1053
+ 'vira-brand-on-self-lowest-contrast': {
1054
+ foreground: viraColorPalette['vira-brand-850'],
1055
+ background: viraColorPalette['vira-brand-1000'],
1056
+ },
913
1057
  'vira-purple-foreground-highest-contrast': {
914
1058
  foreground: viraColorPalette['vira-purple-1000'],
915
1059
  },
@@ -1927,6 +2071,120 @@ export const viraThemeDarkOverride = defineColorThemeOverride(viraTheme, 'dark',
1927
2071
  foreground: viraColorPalette['vira-blue-200'],
1928
2072
  background: viraColorPalette['vira-blue-100'],
1929
2073
  },
2074
+ 'vira-brand-foreground-highest-contrast': {
2075
+ foreground: viraColorPalette['vira-brand-100'],
2076
+ },
2077
+ 'vira-brand-foreground-small-body': {
2078
+ foreground: viraColorPalette['vira-brand-250'],
2079
+ },
2080
+ 'vira-brand-foreground-body': {
2081
+ foreground: viraColorPalette['vira-brand-350'],
2082
+ },
2083
+ 'vira-brand-foreground-non-body': {
2084
+ foreground: viraColorPalette['vira-brand-400'],
2085
+ },
2086
+ 'vira-brand-foreground-placeholder': {
2087
+ foreground: viraColorPalette['vira-brand-600'],
2088
+ },
2089
+ 'vira-brand-foreground-decoration': {
2090
+ foreground: viraColorPalette['vira-brand-750'],
2091
+ },
2092
+ 'vira-brand-foreground-invisible': {
2093
+ foreground: viraColorPalette['vira-brand-1000'],
2094
+ },
2095
+ 'vira-brand-foreground-lowest-contrast': {
2096
+ foreground: viraColorPalette['vira-brand-1000'],
2097
+ },
2098
+ 'vira-brand-behind-bg-highest-contrast': {
2099
+ background: viraColorPalette['vira-brand-100'],
2100
+ },
2101
+ 'vira-brand-behind-bg-small-body': {
2102
+ background: viraColorPalette['vira-brand-250'],
2103
+ },
2104
+ 'vira-brand-behind-bg-body': {
2105
+ background: viraColorPalette['vira-brand-350'],
2106
+ },
2107
+ 'vira-brand-behind-bg-non-body': {
2108
+ background: viraColorPalette['vira-brand-400'],
2109
+ },
2110
+ 'vira-brand-behind-bg-header': {
2111
+ background: viraColorPalette['vira-brand-500'],
2112
+ },
2113
+ 'vira-brand-behind-bg-placeholder': {
2114
+ background: viraColorPalette['vira-brand-650'],
2115
+ },
2116
+ 'vira-brand-behind-bg-decoration': {
2117
+ background: viraColorPalette['vira-brand-750'],
2118
+ },
2119
+ 'vira-brand-behind-bg-invisible': {
2120
+ background: viraColorPalette['vira-brand-1000'],
2121
+ },
2122
+ 'vira-brand-behind-bg-lowest-contrast': {
2123
+ background: viraColorPalette['vira-brand-1000'],
2124
+ },
2125
+ 'vira-brand-behind-fg-highest-contrast': {
2126
+ background: viraColorPalette['vira-brand-1000'],
2127
+ },
2128
+ 'vira-brand-behind-fg-small-body': {
2129
+ background: viraColorPalette['vira-brand-1000'],
2130
+ },
2131
+ 'vira-brand-behind-fg-body': {
2132
+ background: viraColorPalette['vira-brand-750'],
2133
+ },
2134
+ 'vira-brand-behind-fg-non-body': {
2135
+ background: viraColorPalette['vira-brand-600'],
2136
+ },
2137
+ 'vira-brand-behind-fg-header': {
2138
+ background: viraColorPalette['vira-brand-450'],
2139
+ },
2140
+ 'vira-brand-behind-fg-placeholder': {
2141
+ background: viraColorPalette['vira-brand-400'],
2142
+ },
2143
+ 'vira-brand-behind-fg-decoration': {
2144
+ background: viraColorPalette['vira-brand-350'],
2145
+ },
2146
+ 'vira-brand-behind-fg-invisible': {
2147
+ background: viraColorPalette['vira-brand-250'],
2148
+ },
2149
+ 'vira-brand-behind-fg-lowest-contrast': {
2150
+ background: viraColorPalette['vira-brand-100'],
2151
+ },
2152
+ 'vira-brand-on-self-highest-contrast': {
2153
+ foreground: viraColorPalette['vira-brand-200'],
2154
+ background: viraColorPalette['vira-brand-1000'],
2155
+ },
2156
+ 'vira-brand-on-self-small-body': {
2157
+ foreground: viraColorPalette['vira-brand-200'],
2158
+ background: viraColorPalette['vira-brand-950'],
2159
+ },
2160
+ 'vira-brand-on-self-body': {
2161
+ foreground: viraColorPalette['vira-brand-200'],
2162
+ background: viraColorPalette['vira-brand-750'],
2163
+ },
2164
+ 'vira-brand-on-self-non-body': {
2165
+ foreground: viraColorPalette['vira-brand-200'],
2166
+ background: viraColorPalette['vira-brand-600'],
2167
+ },
2168
+ 'vira-brand-on-self-header': {
2169
+ foreground: viraColorPalette['vira-brand-200'],
2170
+ background: viraColorPalette['vira-brand-500'],
2171
+ },
2172
+ 'vira-brand-on-self-placeholder': {
2173
+ foreground: viraColorPalette['vira-brand-200'],
2174
+ background: viraColorPalette['vira-brand-450'],
2175
+ },
2176
+ 'vira-brand-on-self-decoration': {
2177
+ foreground: viraColorPalette['vira-brand-200'],
2178
+ background: viraColorPalette['vira-brand-400'],
2179
+ },
2180
+ 'vira-brand-on-self-invisible': {
2181
+ foreground: viraColorPalette['vira-brand-200'],
2182
+ background: viraColorPalette['vira-brand-100'],
2183
+ },
2184
+ 'vira-brand-on-self-lowest-contrast': {
2185
+ foreground: viraColorPalette['vira-brand-200'],
2186
+ background: viraColorPalette['vira-brand-100'],
2187
+ },
1930
2188
  'vira-purple-foreground-highest-contrast': {
1931
2189
  foreground: viraColorPalette['vira-purple-100'],
1932
2190
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vira",
3
- "version": "31.14.0",
3
+ "version": "31.15.0",
4
4
  "description": "A simple and highly versatile design system using element-vir.",
5
5
  "keywords": [
6
6
  "design",