@adyen/bento-vue2 1.50.0 → 1.52.0

package/dist/info-icon.js

@@ -1,4 +1,4 @@
-import { B as e } from "./chunks/info-icon.C4_l0WAf.js";
+import { B as e } from "./chunks/info-icon.D3neDWqH.js";
 export {
   e as BentoInfoIcon
 };

package/dist/input-field-password.js

@@ -1,4 +1,4 @@
-import { i as a, m as s, r as i, b as c, c as u, a as o } from "./chunks/input-field-password.PU9SY4FC.js";
+import { i as a, m as s, r as i, b as c, c as u, a as o } from "./chunks/input-field-password.CO0lAgMh.js";
 export {
   a as BentoInputFieldPassword,
   s as minLength,

package/dist/input-field-phone-number.js

@@ -1,4 +1,4 @@
-import { i as n } from "./chunks/input-field-phone-number.D2juJ9ZD.js";
+import { i as n } from "./chunks/input-field-phone-number.TXnK0dch.js";
 export {
   n as BentoInputFieldPhoneNumber
 };

package/dist/input-field.js

@@ -1,4 +1,4 @@
-import { B as n, b as a, e as o, c as i, d as s, a as l } from "./chunks/input-field.BPbe00eB.js";
+import { B as n, b as a, e as o, c as i, d as s, a as l } from "./chunks/input-field.De4sp76g.js";
 export {
   n as BentoInputField,
   a as BentoInputFieldElementPosition,

package/dist/inspector.js

@@ -1,4 +1,4 @@
-import { i as t, B as n } from "./chunks/inspector.types.BtgXpTC7.js";
+import { i as t, B as n } from "./chunks/inspector.types.ClnPOYmb.js";
 export {
   t as BentoInspector,
   n as BentoInspectorSizeOptions

package/dist/internal.js

@@ -1,41 +1,43 @@
-import { a as e, b as r, C as t } from "./chunks/calendar.Bb0-Svhx.js";
-import { C as p, a as i } from "./chunks/copy.DMlIj53I.js";
-import { C as f } from "./chunks/controls-group.BnDPMaGI.js";
-import { B as x, b as C, a as I, D as m } from "./chunks/dialog-page.Bf07JxdG.js";
-import { E as T, F as _ } from "./chunks/error-message.xTNEaNn8.js";
-import { F as G } from "./chunks/fixed-scroller.DX2YUuoU.js";
-import { G as u, a as d } from "./chunks/grid-layout.HvTAa4to.js";
-import { I as L } from "./chunks/info-icon-with-popover.B0zJWJZn.js";
-import { b, c, u as g } from "./chunks/use-cached-selected-values.a_5Iw6Dh.js";
-import { L as D } from "./chunks/listbox-option-tag.BJBWnC2r.js";
-import { B as P } from "./chunks/teleport.B5fwsT5y.js";
-import { T as M } from "./chunks/tooltip.Bu8o7uyZ.js";
-import { B as h } from "./chunks/button-actions-with-menu.C5OE7oOu.js";
-import { f as J } from "./chunks/button-actions.BovYBINL.js";
+import { a as e, b as r, C as t, c as s, d as p } from "./chunks/calendar.Bq67h02Z.js";
+import { C as n, a as l } from "./chunks/copy.2iD8aI5a.js";
+import { C as f } from "./chunks/controls-group.D0_cJaFF.js";
+import { B as I, b as m, a as E, D as T } from "./chunks/dialog-page.BfF5_hmG.js";
+import { E as d, F as N } from "./chunks/error-message.B1-ekAMa.js";
+import { F as O } from "./chunks/fixed-scroller.BwvXYzE6.js";
+import { G as A, a as L } from "./chunks/grid-layout.HvTAa4to.js";
+import { I as c } from "./chunks/info-icon-with-popover.CxXWP4TR.js";
+import { b, c as g, u as y } from "./chunks/use-cached-selected-values.CxlYYUbd.js";
+import { L as F } from "./chunks/listbox-option-tag.xGQr3Su1.js";
+import { B as M } from "./chunks/teleport.B5fwsT5y.js";
+import { T as h } from "./chunks/tooltip.RPURZd36.js";
+import { B as J } from "./chunks/button-actions-with-menu.B9oXYIgo.js";
+import { f as R } from "./chunks/button-actions.DAvSJtOB.js";
 export {
-  J as BUTTON_ACTIONS_WITH_MENU_CONTAINER_INJECTION_KEY,
-  x as BentoDialogPageAnimation,
+  R as BUTTON_ACTIONS_WITH_MENU_CONTAINER_INJECTION_KEY,
+  I as BentoDialogPageAnimation,
   b as BentoListbox,
-  P as BentoTeleport,
-  h as ButtonActionsWithMenu,
+  M as BentoTeleport,
+  J as ButtonActionsWithMenu,
   e as Calendar,
   r as CalendarEvent,
   t as CalendarFirstDayOfWeek,
+  s as CalendarPosition,
+  p as CalendarVariant,
   f as ControlsGroup,
-  p as Copy,
-  i as CopyTooltipState,
-  C as DIALOG_PAGE_CONFIG_INJECTION_KEY,
-  I as DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY,
-  m as DialogPage,
-  T as ErrorMessage,
-  _ as FieldLabel,
-  G as FixedScroller,
-  u as GridLayout,
-  d as GridLayoutContainerType,
-  L as InfoIconWithPopover,
-  D as ListboxOptionTag,
-  M as Tooltip,
-  c as useCachedSelectedValues,
-  g as useMultiLevelItems
+  n as Copy,
+  l as CopyTooltipState,
+  m as DIALOG_PAGE_CONFIG_INJECTION_KEY,
+  E as DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY,
+  T as DialogPage,
+  d as ErrorMessage,
+  N as FieldLabel,
+  O as FixedScroller,
+  A as GridLayout,
+  L as GridLayoutContainerType,
+  c as InfoIconWithPopover,
+  F as ListboxOptionTag,
+  h as Tooltip,
+  g as useCachedSelectedValues,
+  y as useMultiLevelItems
 };
 //# sourceMappingURL=internal.js.map

package/dist/layout.js

@@ -1,4 +1,4 @@
-import { l as t, a as e } from "./chunks/layout-row.CHwDU8yK.js";
+import { l as t, a as e } from "./chunks/layout-row.dh2VyGoD.js";
 export {
   t as BentoLayout,
   e as BentoLayoutRow

package/dist/link.js

@@ -1,4 +1,4 @@
-import { B as o, a as t } from "./chunks/link.DZlbzVSB.js";
+import { B as o, a as t } from "./chunks/link.BH3eB_7E.js";
 export {
   o as BentoLink,
   t as BentoLinkVariant

package/dist/menu.js

@@ -1,4 +1,4 @@
-import { B as o, a as t } from "./chunks/menu.BC7ynpgF.js";
+import { B as o, a as t } from "./chunks/menu.li3Kg9Uq.js";
 export {
   o as BentoMenu,
   t as BentoMenuEvent

package/dist/modal-fullscreen.js

@@ -1,4 +1,4 @@
-import { m as o, B as a } from "./chunks/modal-fullscreen.Dz3kSuTz.js";
+import { m as o, B as a } from "./chunks/modal-fullscreen.C4eL63TC.js";
 export {
   o as BentoModalFullscreen,
   a as BentoModalFullscreenPage

package/dist/modal.js

@@ -1,5 +1,5 @@
-import { d as e, f as t, g as n, B as l, e as B, c as d, a as M, b as s } from "./chunks/base-modal.8kcvtFRx.js";
-import { B as i } from "./chunks/modal.DV55hSPn.js";
+import { d as e, f as t, g as n, B as l, e as B, c as d, a as M, b as s } from "./chunks/base-modal.CiTysydg.js";
+import { B as i } from "./chunks/modal.BpDz0Dhc.js";
 export {
   i as BentoModal,
   e as BentoModalColumnLayoutVariant,

package/dist/pagination.js

@@ -1,4 +1,4 @@
-import { B as n } from "./chunks/pagination.CT-h2q0J.js";
+import { B as n } from "./chunks/pagination.FuELftBG.js";
 export {
   n as BentoPagination
 };

package/dist/payment-method.js

@@ -1,4 +1,4 @@
-import { B as t } from "./chunks/payment-method.Bu76jY3c.js";
+import { B as t } from "./chunks/payment-method.NZKiNOmM.js";
 import { B as m } from "./chunks/payment-method.types.CJKfZQN5.js";
 export {
   t as BentoPaymentMethod,

package/dist/popover.js

@@ -1,4 +1,4 @@
-import { B as r, a as s } from "./chunks/popover.CRdrSmFW.js";
+import { B as r, a as s } from "./chunks/popover.Cb6utVhS.js";
 export {
   r as BentoPopover,
   s as BentoPopoverPositions

package/dist/popper-container.js

@@ -1,4 +1,4 @@
-import { P as n, c as a, d as i, a as r, b as p } from "./chunks/popper-container.CsW4R0-t.js";
+import { P as n, c as a, d as i, a as r, b as p } from "./chunks/popper-container.CiEkF7eb.js";
 export {
   n as PopperContainer,
   a as PopperContainerAriaRole,

package/dist/promo-banner.js

@@ -1,4 +1,4 @@
-import { p as r, B as a, a as e } from "./chunks/promo-banner.BNXfyv3h.js";
+import { p as r, B as a, a as e } from "./chunks/promo-banner.PnHud5Wi.js";
 export {
   r as BentoPromoBanner,
   a as BentoPromoBannerColor,

package/dist/radio-group.js

@@ -1,4 +1,4 @@
-import { b as t, B as e, a as n } from "./chunks/radio-group.CUgib4vp.js";
+import { b as t, B as e, a as n } from "./chunks/radio-group._8PsjPCZ.js";
 import { R as B } from "./chunks/radio-input.uJAhxKRs.js";
 export {
   t as BentoRadioButton,

package/dist/search-bar.js

@@ -1,5 +1,5 @@
-import { B as r, b as t, a as B } from "./chunks/search-bar.bMOGN8_E.js";
-import { u as o } from "./chunks/dropdown.CC1i41NX.js";
+import { B as r, b as t, a as B } from "./chunks/search-bar.CVY2e8_B.js";
+import { u as o } from "./chunks/dropdown.CcHoKbLz.js";
 export {
   r as BentoSearchBar,
   t as BentoSearchBarEvent,

package/dist/secondary-nav.js

@@ -1,4 +1,4 @@
-import { s as e } from "./chunks/secondary-nav.C9sm93do.js";
+import { s as e } from "./chunks/secondary-nav.LxcuTR16.js";
 export {
   e as BentoSecondaryNav
 };

package/dist/segmented-control.js

@@ -1,4 +1,4 @@
-import { B as t } from "./chunks/segmented-control.BxCcPbKd.js";
+import { B as t } from "./chunks/segmented-control.D69WXQGh.js";
 import { B as r } from "./chunks/segmented-control.types.BHRLV8KU.js";
 export {
   t as BentoSegmentedControl,

package/dist/selection-card.js

@@ -1,4 +1,4 @@
-import { B as t, s as a, a as n } from "./chunks/selection-card-group.0O3gmtoi.js";
+import { B as t, s as a, a as n } from "./chunks/selection-card-group.MTKkCBeK.js";
 export {
   t as BentoSelectionCard,
   a as BentoSelectionCardGroup,

package/dist/sidepanel.js

@@ -1,4 +1,4 @@
-import { a as n, B as o, s as t } from "./chunks/sidepanel.Dp6dKRnq.js";
+import { a as n, B as o, s as t } from "./chunks/sidepanel.BStCbRqN.js";
 export {
   n as BentoSidepanel,
   o as BentoSidepanelEvent,

package/dist/stepper.js

@@ -1,4 +1,4 @@
-import { a as p, s as o, B as a, b as n } from "./chunks/step.DrP2Frvn.js";
+import { a as p, s as o, B as a, b as n } from "./chunks/step.CuOpi-Ye.js";
 export {
   p as BentoStep,
   o as BentoStepper,

package/dist/structured-list.js

@@ -1,4 +1,4 @@
-import { B as r, a as o } from "./chunks/structured-list-item.DrY71Ndc.js";
+import { B as r, a as o } from "./chunks/structured-list-item.CeosjL40.js";
 export {
   r as BentoStructuredList,
   o as BentoStructuredListItem

package/dist/styles/bento-dark.css

@@ -158,6 +158,9 @@
   --b-code-snippet-code-area-margin: 0;
   --b-card-toggle-small-text-height: 24px;
   --b-card-toggle-height: 26px;
+  --b-calendar-year-month-focus-visible-z-index: 1;
+  --b-calendar-year-month-width: 60px;
+  --b-calendar-year-month-height: 60px;
   --b-calendar-month-day-width: 40px;
   --b-calendar-month-day-height: 40px;
   --b-button-condensed-tertiary-height: auto;
@@ -294,7 +297,7 @@
   --b-color-outline-primary-hover: #525252;
   --b-color-outline-primary: #454545;
   --b-color-link-primary-disabled: #9d9d9d;
-  --b-color-link-primary-active: #9d9d9d;
+  --b-color-link-primary-active: #b5b5b5;
   --b-color-link-primary-hover: #cdcdcd;
   --b-color-link-primary: #efefef;
   --b-color-label-always-dark: #121212;
@@ -330,7 +333,7 @@
   --b-color-label-disabled: #7e7e7e;
   --b-color-label-tertiary: #7e7e7e;
   --b-color-label-secondary: #a5a5a5;
-  --b-color-label-primary-active: #9d9d9d;
+  --b-color-label-primary-active: #b5b5b5;
   --b-color-label-primary-hover: #cdcdcd;
   --b-color-label-primary: #efefef;
   --b-color-background-always-dark-tertiary-selected: #002f68;
@@ -366,7 +369,7 @@
   --b-color-background-inverse-secondary-active: #9d9d9d;
   --b-color-background-inverse-secondary-hover: #bdbdbd;
   --b-color-background-inverse-secondary: #d5d5d5;
-  --b-color-background-inverse-primary-active: #9d9d9d;
+  --b-color-background-inverse-primary-active: #b5b5b5;
   --b-color-background-inverse-primary-hover: #cdcdcd;
   --b-color-background-inverse-primary: #efefef;
   --b-color-background-highlight-strong: #7db9ff;
@@ -876,7 +879,7 @@
   --b-menu-item-icon-right-color: var(--b-color-label-primary);
   --b-menu-item-icon-left-padding: var(--b-spacer-070);
   --b-menu-item-secondary-text-padding-left: var(--b-spacer-070);
-  --b-menu-item-secondary-text-color-inverse: var(--b-color-label-inverse-secondary);
+  --inverse: {color.label.inverse.primary};
   --b-menu-item-secondary-text-color: var(--b-color-label-secondary);
   --b-menu-item-hover-critical-color-inverse: var(--b-color-label-inverse-critical-hover);
   --b-menu-item-hover-critical-color: var(--b-color-label-critical-hover);
@@ -1675,6 +1678,29 @@
   --b-card-border-radius: var(--b-border-radius-l);
   --b-card-border-color: var(--b-color-outline-primary);
   --b-card-background-color: var(--b-color-background-primary);
+  --b-calendar-year-month-unselected-active-background: var(--b-color-background-primary-active);
+  --b-calendar-year-month-unselected-hover-background: var(--b-color-background-primary-hover);
+  --b-calendar-year-month-unselected-color: var(--b-color-label-primary);
+  --b-calendar-year-month-selected-active-background: var(--b-color-background-inverse-primary-active);
+  --b-calendar-year-month-selected-hover-background: var(--b-color-background-inverse-primary-hover);
+  --b-calendar-year-month-selected-color: var(--b-color-label-inverse-primary);
+  --b-calendar-year-month-selected-border-radius: var(--b-border-radius-s);
+  --b-calendar-year-month-selected-background: var(--b-color-background-inverse-primary);
+  --b-calendar-year-month-middle-active-background: var(--b-color-background-primary);
+  --b-calendar-year-month-middle-hover-background: var(--b-color-background-primary-hover);
+  --b-calendar-year-month-middle-color: var(--b-color-label-primary);
+  --b-calendar-year-month-middle-background: var(--b-color-background-tertiary);
+  --b-calendar-year-month-end-border-radius: 0 var(--b-border-radius-s) var(--b-border-radius-s) 0;
+  --b-calendar-year-month-disabled-unselected-color: var(--b-color-label-disabled);
+  --b-calendar-year-month-disabled-selected-background: var(--b-color-background-disabled);
+  --b-calendar-year-month-disabled-selected-color: var(--b-color-label-disabled);
+  --b-calendar-year-month-current-month-unselected-wrapper-background: var(--b-color-background-tertiary);
+  --b-calendar-year-month-current-month-unselected-hover-wrapper-background: var(--b-color-background-primary);
+  --b-calendar-year-month-current-month-selected-wrapper-background: var(--b-color-background-primary);
+  --b-calendar-year-month-current-month-selected-color: var(--b-color-label-primary);
+  --b-calendar-year-month-beginning-border-radius: var(--b-border-radius-s) 0 0 var(--b-border-radius-s);
+  --b-calendar-year-year-selector-margin-bottom: var(--b-spacer-090);
+  --b-calendar-year-year-selector-color: var(--b-color-label-primary);
   --b-calendar-month-day-unselected-active-background: var(--b-color-background-primary-active);
   --b-calendar-month-day-unselected-hover-background: var(--b-color-background-primary-hover);
   --b-calendar-month-day-unselected-color: var(--b-color-label-primary);

package/dist/styles/bento-light.css

@@ -157,6 +157,9 @@
   --b-code-snippet-code-area-margin: 0;
   --b-card-toggle-small-text-height: 24px;
   --b-card-toggle-height: 26px;
+  --b-calendar-year-month-focus-visible-z-index: 1;
+  --b-calendar-year-month-width: 60px;
+  --b-calendar-year-month-height: 60px;
   --b-calendar-month-day-width: 40px;
   --b-calendar-month-day-height: 40px;
   --b-button-condensed-tertiary-height: auto;
@@ -292,7 +295,7 @@
   --b-color-outline-primary-hover: #c9cdd3;
   --b-color-outline-primary: #dbdee2;
   --b-color-link-primary-disabled: #8d95a3;
-  --b-color-link-primary-active: #8d95a3;
+  --b-color-link-primary-active: #6d7789;
   --b-color-link-primary-hover: #5c687c;
   --b-color-link-primary: #00112c;
   --b-color-label-always-dark: #00112c;
@@ -328,7 +331,7 @@
   --b-color-label-disabled: #8d95a3;
   --b-color-label-tertiary: #8d95a3;
   --b-color-label-secondary: #5c687c;
-  --b-color-label-primary-active: #8d95a3;
+  --b-color-label-primary-active: #6d7789;
   --b-color-label-primary-hover: #5c687c;
   --b-color-label-primary: #00112c;
   --b-color-background-always-dark-tertiary-selected: #002f68;
@@ -364,7 +367,7 @@
   --b-color-background-inverse-secondary-active: #37455d;
   --b-color-background-inverse-secondary-hover: #283750;
   --b-color-background-inverse-secondary: #1a2a44;
-  --b-color-background-inverse-primary-active: #8d95a3;
+  --b-color-background-inverse-primary-active: #6d7789;
   --b-color-background-inverse-primary-hover: #5c687c;
   --b-color-background-inverse-primary: #00112c;
   --b-color-background-highlight-strong: #0070f5;
@@ -875,7 +878,7 @@
   --b-menu-item-icon-right-color: var(--b-color-label-primary);
   --b-menu-item-icon-left-padding: var(--b-spacer-070);
   --b-menu-item-secondary-text-padding-left: var(--b-spacer-070);
-  --b-menu-item-secondary-text-color-inverse: var(--b-color-label-inverse-secondary);
+  --inverse: {color.label.inverse.primary};
   --b-menu-item-secondary-text-color: var(--b-color-label-secondary);
   --b-menu-item-hover-critical-color-inverse: var(--b-color-label-inverse-critical-hover);
   --b-menu-item-hover-critical-color: var(--b-color-label-critical-hover);
@@ -1673,6 +1676,29 @@
   --b-card-border-radius: var(--b-border-radius-l);
   --b-card-border-color: var(--b-color-outline-primary);
   --b-card-background-color: var(--b-color-background-primary);
+  --b-calendar-year-month-unselected-active-background: var(--b-color-background-primary-active);
+  --b-calendar-year-month-unselected-hover-background: var(--b-color-background-primary-hover);
+  --b-calendar-year-month-unselected-color: var(--b-color-label-primary);
+  --b-calendar-year-month-selected-active-background: var(--b-color-background-inverse-primary-active);
+  --b-calendar-year-month-selected-hover-background: var(--b-color-background-inverse-primary-hover);
+  --b-calendar-year-month-selected-color: var(--b-color-label-inverse-primary);
+  --b-calendar-year-month-selected-border-radius: var(--b-border-radius-s);
+  --b-calendar-year-month-selected-background: var(--b-color-background-inverse-primary);
+  --b-calendar-year-month-middle-active-background: var(--b-color-background-primary);
+  --b-calendar-year-month-middle-hover-background: var(--b-color-background-primary-hover);
+  --b-calendar-year-month-middle-color: var(--b-color-label-primary);
+  --b-calendar-year-month-middle-background: var(--b-color-background-tertiary);
+  --b-calendar-year-month-end-border-radius: 0 var(--b-border-radius-s) var(--b-border-radius-s) 0;
+  --b-calendar-year-month-disabled-unselected-color: var(--b-color-label-disabled);
+  --b-calendar-year-month-disabled-selected-background: var(--b-color-background-disabled);
+  --b-calendar-year-month-disabled-selected-color: var(--b-color-label-disabled);
+  --b-calendar-year-month-current-month-unselected-wrapper-background: var(--b-color-background-tertiary);
+  --b-calendar-year-month-current-month-unselected-hover-wrapper-background: var(--b-color-background-primary);
+  --b-calendar-year-month-current-month-selected-wrapper-background: var(--b-color-background-primary);
+  --b-calendar-year-month-current-month-selected-color: var(--b-color-label-primary);
+  --b-calendar-year-month-beginning-border-radius: var(--b-border-radius-s) 0 0 var(--b-border-radius-s);
+  --b-calendar-year-year-selector-margin-bottom: var(--b-spacer-090);
+  --b-calendar-year-year-selector-color: var(--b-color-label-primary);
   --b-calendar-month-day-unselected-active-background: var(--b-color-background-primary-active);
   --b-calendar-month-day-unselected-hover-background: var(--b-color-background-primary-hover);
   --b-calendar-month-day-unselected-color: var(--b-color-label-primary);

package/dist/styles/bento.css

@@ -157,6 +157,9 @@
   --b-code-snippet-code-area-margin: 0;
   --b-card-toggle-small-text-height: 24px;
   --b-card-toggle-height: 26px;
+  --b-calendar-year-month-focus-visible-z-index: 1;
+  --b-calendar-year-month-width: 60px;
+  --b-calendar-year-month-height: 60px;
   --b-calendar-month-day-width: 40px;
   --b-calendar-month-day-height: 40px;
   --b-button-condensed-tertiary-height: auto;
@@ -292,7 +295,7 @@
   --b-color-outline-primary-hover: #c9cdd3;
   --b-color-outline-primary: #dbdee2;
   --b-color-link-primary-disabled: #8d95a3;
-  --b-color-link-primary-active: #8d95a3;
+  --b-color-link-primary-active: #6d7789;
   --b-color-link-primary-hover: #5c687c;
   --b-color-link-primary: #00112c;
   --b-color-label-always-dark: #00112c;
@@ -328,7 +331,7 @@
   --b-color-label-disabled: #8d95a3;
   --b-color-label-tertiary: #8d95a3;
   --b-color-label-secondary: #5c687c;
-  --b-color-label-primary-active: #8d95a3;
+  --b-color-label-primary-active: #6d7789;
   --b-color-label-primary-hover: #5c687c;
   --b-color-label-primary: #00112c;
   --b-color-background-always-dark-tertiary-selected: #002f68;
@@ -364,7 +367,7 @@
   --b-color-background-inverse-secondary-active: #37455d;
   --b-color-background-inverse-secondary-hover: #283750;
   --b-color-background-inverse-secondary: #1a2a44;
-  --b-color-background-inverse-primary-active: #8d95a3;
+  --b-color-background-inverse-primary-active: #6d7789;
   --b-color-background-inverse-primary-hover: #5c687c;
   --b-color-background-inverse-primary: #00112c;
   --b-color-background-highlight-strong: #0070f5;
@@ -875,7 +878,7 @@
   --b-menu-item-icon-right-color: var(--b-color-label-primary);
   --b-menu-item-icon-left-padding: var(--b-spacer-070);
   --b-menu-item-secondary-text-padding-left: var(--b-spacer-070);
-  --b-menu-item-secondary-text-color-inverse: var(--b-color-label-inverse-secondary);
+  --inverse: {color.label.inverse.primary};
   --b-menu-item-secondary-text-color: var(--b-color-label-secondary);
   --b-menu-item-hover-critical-color-inverse: var(--b-color-label-inverse-critical-hover);
   --b-menu-item-hover-critical-color: var(--b-color-label-critical-hover);
@@ -1673,6 +1676,29 @@
   --b-card-border-radius: var(--b-border-radius-l);
   --b-card-border-color: var(--b-color-outline-primary);
   --b-card-background-color: var(--b-color-background-primary);
+  --b-calendar-year-month-unselected-active-background: var(--b-color-background-primary-active);
+  --b-calendar-year-month-unselected-hover-background: var(--b-color-background-primary-hover);
+  --b-calendar-year-month-unselected-color: var(--b-color-label-primary);
+  --b-calendar-year-month-selected-active-background: var(--b-color-background-inverse-primary-active);
+  --b-calendar-year-month-selected-hover-background: var(--b-color-background-inverse-primary-hover);
+  --b-calendar-year-month-selected-color: var(--b-color-label-inverse-primary);
+  --b-calendar-year-month-selected-border-radius: var(--b-border-radius-s);
+  --b-calendar-year-month-selected-background: var(--b-color-background-inverse-primary);
+  --b-calendar-year-month-middle-active-background: var(--b-color-background-primary);
+  --b-calendar-year-month-middle-hover-background: var(--b-color-background-primary-hover);
+  --b-calendar-year-month-middle-color: var(--b-color-label-primary);
+  --b-calendar-year-month-middle-background: var(--b-color-background-tertiary);
+  --b-calendar-year-month-end-border-radius: 0 var(--b-border-radius-s) var(--b-border-radius-s) 0;
+  --b-calendar-year-month-disabled-unselected-color: var(--b-color-label-disabled);
+  --b-calendar-year-month-disabled-selected-background: var(--b-color-background-disabled);
+  --b-calendar-year-month-disabled-selected-color: var(--b-color-label-disabled);
+  --b-calendar-year-month-current-month-unselected-wrapper-background: var(--b-color-background-tertiary);
+  --b-calendar-year-month-current-month-unselected-hover-wrapper-background: var(--b-color-background-primary);
+  --b-calendar-year-month-current-month-selected-wrapper-background: var(--b-color-background-primary);
+  --b-calendar-year-month-current-month-selected-color: var(--b-color-label-primary);
+  --b-calendar-year-month-beginning-border-radius: var(--b-border-radius-s) 0 0 var(--b-border-radius-s);
+  --b-calendar-year-year-selector-margin-bottom: var(--b-spacer-090);
+  --b-calendar-year-year-selector-color: var(--b-color-label-primary);
   --b-calendar-month-day-unselected-active-background: var(--b-color-background-primary-active);
   --b-calendar-month-day-unselected-hover-background: var(--b-color-background-primary-hover);
   --b-calendar-month-day-unselected-color: var(--b-color-label-primary);

package/dist/styles/legacy.css

@@ -194,6 +194,9 @@
   --b-code-snippet-code-area-margin: 0;
   --b-card-toggle-small-text-height: 24px;
   --b-card-toggle-height: 26px;
+  --b-calendar-year-month-focus-visible-z-index: 1;
+  --b-calendar-year-month-width: 60px;
+  --b-calendar-year-month-height: 60px;
   --b-calendar-month-month-container-border-collapse: collapse;
   --b-calendar-month-day-unselected-active-background: transparent;
   --b-calendar-month-day-unselected-hover-background: none;
@@ -265,9 +268,11 @@
   --b-text-subtitle-font-size: 16px;
   --b-text-body-strongest-wide-line-height: 24px;
   --b-text-body-stronger-wide-line-height: 24px;
+  --b-text-body-stronger-font-weight: 350;
   --b-text-body-wide-line-height: 24px;
   --b-text-body-letter-spacing: normal;
   --b-text-body-line-height: 24px;
+  --b-text-body-font-weight: 350;
   --b-text-caption-stronger-wide-line-height: 20px;
   --b-text-caption-wide-line-height: 20px;
   --b-text-caption-letter-spacing: 0;
@@ -359,7 +364,7 @@
   --b-color-outline-primary-hover: #c9cdd3;
   --b-color-outline-primary: #dbdee2;
   --b-color-link-primary-disabled: #8d95a3;
-  --b-color-link-primary-active: #8d95a3;
+  --b-color-link-primary-active: #6d7789;
   --b-color-link-primary-hover: #5c687c;
   --b-color-link-primary: #00112c;
   --b-color-label-always-dark: #00112c;
@@ -392,7 +397,7 @@
   --b-color-label-disabled: #8d95a3;
   --b-color-label-tertiary: #8d95a3;
   --b-color-label-secondary: #5c687c;
-  --b-color-label-primary-active: #8d95a3;
+  --b-color-label-primary-active: #6d7789;
   --b-color-label-primary-hover: #5c687c;
   --b-color-label-primary: #00112c;
   --b-color-background-always-dark-tertiary-selected: #002f68;
@@ -427,7 +432,7 @@
   --b-color-background-inverse-secondary-active: #37455d;
   --b-color-background-inverse-secondary-hover: #283750;
   --b-color-background-inverse-secondary: #1a2a44;
-  --b-color-background-inverse-primary-active: #8d95a3;
+  --b-color-background-inverse-primary-active: #6d7789;
   --b-color-background-inverse-primary-hover: #5c687c;
   --b-color-background-inverse-primary: #00112c;
   --b-color-background-highlight-strong: #0070f5;
@@ -845,7 +850,7 @@
   --b-menu-item-icon-right-color: var(--b-color-label-primary);
   --b-menu-item-icon-left-padding: var(--b-spacer-070);
   --b-menu-item-secondary-text-padding-left: var(--b-spacer-070);
-  --b-menu-item-secondary-text-color-inverse: var(--b-color-label-inverse-secondary);
+  --inverse: {color.label.inverse.primary};
   --b-menu-item-secondary-text-color: var(--b-color-label-secondary);
   --b-menu-item-hover-critical-color-inverse: var(--b-color-label-inverse-critical-hover);
   --b-menu-item-hover-critical-color: var(--b-color-label-critical-hover);
@@ -1561,6 +1566,25 @@
   --b-card-header-border-radius: var(--b-border-radius-s);
   --b-card-border-width: var(--b-border-width-s);
   --b-card-border-radius: var(--b-border-radius-s);
+  --b-calendar-year-month-unselected-active-background: var(--b-color-background-primary-active);
+  --b-calendar-year-month-unselected-hover-background: var(--b-color-background-primary-hover);
+  --b-calendar-year-month-unselected-color: var(--b-color-label-primary);
+  --b-calendar-year-month-selected-active-background: var(--b-color-background-inverse-primary-active);
+  --b-calendar-year-month-selected-hover-background: var(--b-color-background-inverse-primary-hover);
+  --b-calendar-year-month-selected-border-radius: var(--b-border-radius-s);
+  --b-calendar-year-month-selected-background: var(--b-color-background-inverse-primary);
+  --b-calendar-year-month-middle-hover-background: var(--b-color-background-primary-hover);
+  --b-calendar-year-month-middle-color: var(--b-color-label-primary);
+  --b-calendar-year-month-middle-background: var(--b-color-background-tertiary);
+  --b-calendar-year-month-end-border-radius: 0 var(--b-border-radius-s) var(--b-border-radius-s) 0;
+  --b-calendar-year-month-disabled-unselected-color: var(--b-color-label-disabled);
+  --b-calendar-year-month-disabled-selected-background: var(--b-color-background-disabled);
+  --b-calendar-year-month-disabled-selected-color: var(--b-color-label-disabled);
+  --b-calendar-year-month-current-month-unselected-wrapper-background: var(--b-color-background-tertiary);
+  --b-calendar-year-month-current-month-selected-color: var(--b-color-label-primary);
+  --b-calendar-year-month-beginning-border-radius: var(--b-border-radius-s) 0 0 var(--b-border-radius-s);
+  --b-calendar-year-year-selector-margin-bottom: var(--b-spacer-090);
+  --b-calendar-year-year-selector-color: var(--b-color-label-primary);
   --b-calendar-month-week-header-border-bottom: var(--b-border-width-s) solid var(--b-color-neutral-20);
   --b-calendar-month-day-unselected-color: var(--b-color-label-primary);
   --b-calendar-month-day-end-after-z-index: var(--b-z-index-local-tier-2);
@@ -1761,8 +1785,6 @@
   --b-text-body-strongest-wide-font-weight: var(--b-font-weight-600);
   --b-text-body-strongest-font-weight: var(--b-font-weight-600);
   --b-text-body-stronger-wide-font-weight: var(--b-font-weight-500);
-  --b-text-body-stronger-font-weight: var(--b-font-weight-100);
-  --b-text-body-font-weight: var(--b-font-weight-100);
   --b-text-body-font-size: var(--b-font-size-15);
   --b-text-body-font-family: var(--b-font-family-primary);
   --b-text-caption-stronger-wide-font-weight: var(--b-font-weight-500);
@@ -2045,6 +2067,10 @@
   --b-checkbox-input-icon-color: var(--b-color-neutral-0);
   --b-card-border-color: var(--b-color-neutral-20);
   --b-card-background-color: var(--b-color-background-primary);
+  --b-calendar-year-month-selected-color: var(--b-color-label-inverse-primary);
+  --b-calendar-year-month-middle-active-background: var(--b-color-background-primary);
+  --b-calendar-year-month-current-month-unselected-hover-wrapper-background: var(--b-color-background-primary);
+  --b-calendar-year-month-current-month-selected-wrapper-background: var(--b-color-background-primary);
   --b-calendar-month-day-selected-active-background: var(--b-color-primary-40);
   --b-calendar-month-day-selected-hover-background: var(--b-color-primary-40);
   --b-calendar-month-day-selected-color: var(--b-color-neutral-0);