@brandsync/wc 1.18.0 → 1.19.0

package/dist/types/components.d.ts

@@ -48,6 +48,7 @@ import { BsMessageRole, BsMessageStatus } from "./components/bs-message/bs-messa
 import { BsNavigationHeaderAlignment } from "./components/ui-shell/bs-navigation-header/bs-navigation-header/bs-navigation-header";
 import { BsOnboardingChecklistType, BsOnboardingLauncherLayout, BsOnboardingStep } from "./components/bs-onboarding-checklist/bs-onboarding-checklist";
 import { BsPopoverPlacement } from "./components/bs-popover/bs-popover";
+import { BsPresenceDuration, BsPresenceEasing, BsPresencePreset } from "./components/bs-presence/bs-presence";
 import { BsProductTourDirection, BsProductTourType } from "./components/bs-product-tour/bs-product-tour";
 import { BsProgressSize, BsProgressStrokeWidth, BsProgressType } from "./components/bs-progress/bs-progress";
 import { BsProgressLinearSize, BsProgressLinearType } from "./components/bs-progress-linear/bs-progress-linear";
@@ -114,6 +115,7 @@ export { BsMessageRole, BsMessageStatus } from "./components/bs-message/bs-messa
 export { BsNavigationHeaderAlignment } from "./components/ui-shell/bs-navigation-header/bs-navigation-header/bs-navigation-header";
 export { BsOnboardingChecklistType, BsOnboardingLauncherLayout, BsOnboardingStep } from "./components/bs-onboarding-checklist/bs-onboarding-checklist";
 export { BsPopoverPlacement } from "./components/bs-popover/bs-popover";
+export { BsPresenceDuration, BsPresenceEasing, BsPresencePreset } from "./components/bs-presence/bs-presence";
 export { BsProductTourDirection, BsProductTourType } from "./components/bs-product-tour/bs-product-tour";
 export { BsProgressSize, BsProgressStrokeWidth, BsProgressType } from "./components/bs-progress/bs-progress";
 export { BsProgressLinearSize, BsProgressLinearType } from "./components/bs-progress-linear/bs-progress-linear";
@@ -145,6 +147,10 @@ export namespace Components {
      * (optionally managing which one(s) are expanded, e.g. "only one open at a time") themselves --
      * there's no accordion-group wrapper here, matching Figma's component which only specs the single
      * section, not a group behavior.
+     * @prop --bs-accordion-duration - Length of the expand/collapse motion. Aliased to `--bs-duration-default`.
+     * @prop --bs-accordion-easing - Curve of the expand/collapse motion. Aliased to `--bs-easing-standard`.
+     * Expanding and collapsing animate the body's height and rotate the caret. Under
+     * `prefers-reduced-motion: reduce` the duration token is `0ms`, so the body snaps.
      */
     interface BsAccordion {
         /**
@@ -941,6 +947,11 @@ export namespace Components {
      * manages two things on those slide elements: the `hidden` attribute (off-page slides are hidden,
      * so they leave the tab order and the accessibility tree) and, only when not already set,
      * `role="group"`, `aria-roledescription="slide"` and an `aria-label` of "n of N".
+     * Changing page plays a short motion: the visible slides fade and slide out in the direction of travel,
+     * then the next page's slides fade and slide in (reversed for previous, and mirrored in RTL). The dots
+     * also grow and fade between pages. Motion length and distance follow `--bs-carousel-duration`,
+     * `--bs-carousel-easing` and `--bs-carousel-slide-distance`. Under `prefers-reduced-motion: reduce`
+     * the duration token is `0ms`, so pages switch instantly.
      * Composes `bs-pagination` (`tracker="numbers"`), `bs-icon-button` (previous/next for
      * `tracker="dots"`) and `bs-button` (Pause/Play) rather than re-implementing them.
      * ## When to use
@@ -3413,8 +3424,12 @@ export namespace Components {
      * featured area on the right, and a footer with recently used items and a shortcut hint. Matches the Figma
      * "Mega menu" (types Columns, Column with featured, Compact and Compact with featured).
      * This is the panel only. Put it in `bs-navigation-header`'s `menu` slot, which anchors it under the bar at the
-     * header's full width, and toggle the host's `hidden` attribute from the tab that
-     * opens it; the panel does not open or close itself. Escape inside the panel fires `bsClose` so you can close it.
+     * header's full width, and show it from the tab that opens it; the panel does not open or close itself. Escape
+     * inside the panel fires `bsClose` so you can close it.
+     * There are two ways to show and hide it. Toggle the host's `hidden` attribute and it appears and disappears at once
+     * (the original contract, unchanged). Or set `open` and it fades and drops in from under the bar, then fades back out
+     * and is removed once the exit finishes. Leave `open` unset to keep using `hidden` only. `hidden` always wins: with it
+     * set the panel is not shown whatever `open` says.
      * Built from `bs-card` (panel surface), `bs-menu-block` or `bs-compact-menu-block` (the links), `bs-divider` and
      * `bs-key-caps` (the shortcut). The column layout, headings, featured text and footer row are plain layout
      * markup: no component covers them.
@@ -3441,6 +3456,10 @@ export namespace Components {
      * @prop --bs-mega-menu-heading-color - Column headings. Aliased to `--bs-text-muted`.
      * @prop --bs-mega-menu-text-color - Featured title. Aliased to `--bs-text-default`.
      * @prop --bs-mega-menu-muted-color - Featured description and footer text. Aliased to `--bs-text-secondary`.
+     * @prop --bs-mega-menu-duration - Length of the open/close motion (`open` only). Aliased to `--bs-duration-default`.
+     * @prop --bs-mega-menu-easing - Curve of the open/close motion. Aliased to `--bs-easing-standard`.
+     * @prop --bs-mega-menu-distance - How far the panel drops while it fades. Aliased to `--bs-spacing-100`.
+     * Under `prefers-reduced-motion: reduce` (or a duration of `0ms`) setting `open` shows and hides the panel instantly.
      */
     interface BsMegaMenu {
         /**
@@ -3457,6 +3476,10 @@ export namespace Components {
           * @default 'Menu'
          */
         "label": string;
+        /**
+          * Shows the panel with an enter/exit motion. Unset (the default) leaves visibility to the host's `hidden` attribute, which shows and hides instantly. `true` shows the panel; `false` fades it out and then removes it. The panel stays in the DOM and is `inert` while it fades out.
+         */
+        "open"?: boolean;
         /**
           * Recently used destinations, already translated, shown in the footer. JS property only.
           * @default []
@@ -4102,6 +4125,11 @@ export namespace Components {
      * @prop --bs-popover-offset - Gap between trigger and popup. Aliased to `--bs-spacing-100`.
      * @prop --bs-popover-min-width - Minimum popup width. Aliased to `--bs-scale-1600`.
      * @prop --bs-popover-z-index - Popup stacking order. Aliased to `--bs-z-index-popover`.
+     * @prop --bs-popover-duration - Length of the open/close motion. Aliased to `--bs-duration-fast`.
+     * @prop --bs-popover-easing - Curve of the open/close motion. Aliased to `--bs-easing-standard`.
+     * @prop --bs-popover-distance - How far the popup nudges while it fades. Aliased to `--bs-spacing-50`.
+     * The popup fades and nudges toward its trigger when it opens and closes. Length, curve and travel are
+     * `--bs-popover-duration`, `--bs-popover-easing` and `--bs-popover-distance`; under `prefers-reduced-motion: reduce` it is instant.
      */
     interface BsPopover {
         /**
@@ -4115,6 +4143,45 @@ export namespace Components {
          */
         "placement": BsPopoverPlacement;
     }
+    /**
+     * Shows and hides slotted content with a short enter/exit transition.
+     * The motion uses the shared duration and easing tokens (`--bs-duration-*`, `--bs-easing-*`).
+     * Under `prefers-reduced-motion: reduce` those durations are already `0ms`, and this component
+     * forces `--bs-presence-duration` to `--bs-duration-instant` as well, so the content snaps
+     * instead of moving.
+     * ## When to use
+     * - Revealing a block that does not have its own enter/exit (a card, a form section, a panel).
+     * - Comparing duration and easing tokens while designing a screen.
+     * ## When not to use
+     * - Loading placeholders (`bs-skeleton`), spinners (`bs-spinner`), or progress.
+     * - Dialog, snackbar, toast, and command palette — those components own their motion.
+     * @prop --bs-presence-duration - Transition length. Set from the `duration` prop to a `--bs-duration-*` token.
+     * @prop --bs-presence-easing - Transition curve. Set from the `easing` prop to a `--bs-easing-*` token.
+     * @prop --bs-presence-distance - Travel distance for `slide-up` and `slide-down`. Aliased to `--bs-spacing-400`.
+     * @prop --bs-presence-scale - Closed scale for `scale`. No unitless scale token exists, so the default is `0.96`.
+     */
+    interface BsPresence {
+        /**
+          * When true, the slotted content is shown. Flipping this plays the exit or enter transition.
+          * @default false
+         */
+        "active": boolean;
+        /**
+          * Length of the transition, mapped to a `--bs-duration-*` token.
+          * @default 'default'
+         */
+        "duration": BsPresenceDuration;
+        /**
+          * Curve of the transition, mapped to a `--bs-easing-*` token.
+          * @default 'standard'
+         */
+        "easing": BsPresenceEasing;
+        /**
+          * Which transition to play.
+          * @default 'fade'
+         */
+        "preset": BsPresencePreset;
+    }
     /**
      * One step of a product tour: a centred **welcome** or **success** card with an art tile, or a
      * **pointer** card -- a compact step with a close button, a "1 of 3" progress label and Back/Next
@@ -4438,6 +4505,42 @@ export namespace Components {
          */
         "value": string;
     }
+    /**
+     * A touch-ripple effect: on pointer press, a circle grows from the press point and fades out.
+     * It is a building block for pressable components (`bs-button`, `bs-icon-button`, ...), not something
+     * to place on a page by itself. Put it inside a positioned, pressable parent; it fills that parent,
+     * follows its corner radius, and listens for `pointerdown` on it. Pointer-events pass through, so the
+     * parent still receives every click.
+     * The motion uses the shared duration and easing tokens. Under `prefers-reduced-motion: reduce` those
+     * durations are `0ms`, and the ripple does not play at all.
+     * ## When to use
+     * - Inside a pressable `bs-*` component, to give press feedback.
+     * ## When not to use
+     * - As a hover or focus indicator. Those are colour changes on the parent.
+     * - On non-interactive surfaces.
+     * Set the custom properties on the `bs-ripple` element itself. Inside another component that means `::part(ripple)`,
+     * e.g. `bs-button::part(ripple) { --bs-ripple-color: white; }`.
+     * @prop --bs-ripple-color - Ripple colour. `currentColor` by default, so it follows the parent's text colour and works on every variant.
+     * @prop --bs-ripple-opacity - Starting opacity of the ripple. No opacity token fits, so the default is `0.24`.
+     * @prop --bs-ripple-duration - Length of the ripple. Aliased to `--bs-duration-slower`.
+     * @prop --bs-ripple-easing - Curve of the ripple. Aliased to `--bs-easing-decelerate`.
+     */
+    interface BsRipple {
+        /**
+          * Always start the ripple from the centre instead of the press point. Use it for round or icon-only controls.
+          * @default false
+         */
+        "centered": boolean;
+        /**
+          * Turns the ripple off. A disabled parent (`<button disabled>`) also stops it.
+          * @default false
+         */
+        "disabled": boolean;
+        /**
+          * CSS selector of the element to listen on, found with `closest()` from the ripple (so it stays inside the same shadow tree). By default the ripple listens on its parent. Use it when the pressable element is bigger than the ripple's own parent, e.g. a switch whose ripple sits on the knob but whose whole `<label>` is the press target.
+         */
+        "triggerSelector"?: string;
+    }
     /**
      * One result or suggestion row of a search dropdown: a leading icon, a primary line, an optional
      * description line and trailing text. Static, not focusable -- focus stays in the search field and the
@@ -4667,6 +4770,8 @@ export namespace Components {
      * @prop --bs-side-panel-overlay-bg - Backdrop color. Aliased to `--bs-surface-overlay`.
      * @prop --bs-side-panel-color - Text color. Aliased to `--bs-text-default`.
      * @prop --bs-side-panel-z-index - Stacking order. Aliased to `--bs-z-index-modal`.
+     * @prop --bs-side-panel-duration - Length of the slide in/out. Aliased to `--bs-duration-slow`.
+     * @prop --bs-side-panel-easing - Curve of the slide in/out. Aliased to `--bs-easing-standard`.
      */
     interface BsSidePanel {
         /**
@@ -5420,6 +5525,11 @@ export namespace Components {
      * - Interactive content or long text (use `bs-popover`).
      * @prop --bs-tooltip-trigger-offset - Gap between trigger and tooltip. Aliased to `--bs-spacing-100`.
      * @prop --bs-tooltip-trigger-z-index - Stacking order. Aliased to `--bs-z-index-popover`.
+     * @prop --bs-tooltip-trigger-duration - Length of the show/hide motion. Aliased to `--bs-duration-fast`.
+     * @prop --bs-tooltip-trigger-easing - Curve of the show/hide motion. Aliased to `--bs-easing-standard`.
+     * @prop --bs-tooltip-trigger-distance - How far the tooltip nudges while it fades. Aliased to `--bs-spacing-50`.
+     * The tooltip fades in while drifting a few pixels away from the trigger into place, and fades back out toward it. Under
+     * `prefers-reduced-motion: reduce` (or a duration of `0ms`) it appears and disappears instantly.
      */
     interface BsTooltipTrigger {
         /**
@@ -5876,6 +5986,10 @@ export interface BsPopoverCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLBsPopoverElement;
 }
+export interface BsPresenceCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLBsPresenceElement;
+}
 export interface BsProductTourCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLBsProductTourElement;
@@ -5963,6 +6077,10 @@ declare global {
      * (optionally managing which one(s) are expanded, e.g. "only one open at a time") themselves --
      * there's no accordion-group wrapper here, matching Figma's component which only specs the single
      * section, not a group behavior.
+     * @prop --bs-accordion-duration - Length of the expand/collapse motion. Aliased to `--bs-duration-default`.
+     * @prop --bs-accordion-easing - Curve of the expand/collapse motion. Aliased to `--bs-easing-standard`.
+     * Expanding and collapsing animate the body's height and rotate the caret. Under
+     * `prefers-reduced-motion: reduce` the duration token is `0ms`, so the body snaps.
      */
     interface HTMLBsAccordionElement extends Components.BsAccordion, HTMLStencilElement {
         addEventListener<K extends keyof HTMLBsAccordionElementEventMap>(type: K, listener: (this: HTMLBsAccordionElement, ev: BsAccordionCustomEvent<HTMLBsAccordionElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -6513,6 +6631,11 @@ declare global {
      * manages two things on those slide elements: the `hidden` attribute (off-page slides are hidden,
      * so they leave the tab order and the accessibility tree) and, only when not already set,
      * `role="group"`, `aria-roledescription="slide"` and an `aria-label` of "n of N".
+     * Changing page plays a short motion: the visible slides fade and slide out in the direction of travel,
+     * then the next page's slides fade and slide in (reversed for previous, and mirrored in RTL). The dots
+     * also grow and fade between pages. Motion length and distance follow `--bs-carousel-duration`,
+     * `--bs-carousel-easing` and `--bs-carousel-slide-distance`. Under `prefers-reduced-motion: reduce`
+     * the duration token is `0ms`, so pages switch instantly.
      * Composes `bs-pagination` (`tracker="numbers"`), `bs-icon-button` (previous/next for
      * `tracker="dots"`) and `bs-button` (Pause/Play) rather than re-implementing them.
      * ## When to use
@@ -7913,8 +8036,12 @@ declare global {
      * featured area on the right, and a footer with recently used items and a shortcut hint. Matches the Figma
      * "Mega menu" (types Columns, Column with featured, Compact and Compact with featured).
      * This is the panel only. Put it in `bs-navigation-header`'s `menu` slot, which anchors it under the bar at the
-     * header's full width, and toggle the host's `hidden` attribute from the tab that
-     * opens it; the panel does not open or close itself. Escape inside the panel fires `bsClose` so you can close it.
+     * header's full width, and show it from the tab that opens it; the panel does not open or close itself. Escape
+     * inside the panel fires `bsClose` so you can close it.
+     * There are two ways to show and hide it. Toggle the host's `hidden` attribute and it appears and disappears at once
+     * (the original contract, unchanged). Or set `open` and it fades and drops in from under the bar, then fades back out
+     * and is removed once the exit finishes. Leave `open` unset to keep using `hidden` only. `hidden` always wins: with it
+     * set the panel is not shown whatever `open` says.
      * Built from `bs-card` (panel surface), `bs-menu-block` or `bs-compact-menu-block` (the links), `bs-divider` and
      * `bs-key-caps` (the shortcut). The column layout, headings, featured text and footer row are plain layout
      * markup: no component covers them.
@@ -7941,6 +8068,10 @@ declare global {
      * @prop --bs-mega-menu-heading-color - Column headings. Aliased to `--bs-text-muted`.
      * @prop --bs-mega-menu-text-color - Featured title. Aliased to `--bs-text-default`.
      * @prop --bs-mega-menu-muted-color - Featured description and footer text. Aliased to `--bs-text-secondary`.
+     * @prop --bs-mega-menu-duration - Length of the open/close motion (`open` only). Aliased to `--bs-duration-default`.
+     * @prop --bs-mega-menu-easing - Curve of the open/close motion. Aliased to `--bs-easing-standard`.
+     * @prop --bs-mega-menu-distance - How far the panel drops while it fades. Aliased to `--bs-spacing-100`.
+     * Under `prefers-reduced-motion: reduce` (or a duration of `0ms`) setting `open` shows and hides the panel instantly.
      */
     interface HTMLBsMegaMenuElement extends Components.BsMegaMenu, HTMLStencilElement {
         addEventListener<K extends keyof HTMLBsMegaMenuElementEventMap>(type: K, listener: (this: HTMLBsMegaMenuElement, ev: BsMegaMenuCustomEvent<HTMLBsMegaMenuElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -8391,6 +8522,11 @@ declare global {
      * @prop --bs-popover-offset - Gap between trigger and popup. Aliased to `--bs-spacing-100`.
      * @prop --bs-popover-min-width - Minimum popup width. Aliased to `--bs-scale-1600`.
      * @prop --bs-popover-z-index - Popup stacking order. Aliased to `--bs-z-index-popover`.
+     * @prop --bs-popover-duration - Length of the open/close motion. Aliased to `--bs-duration-fast`.
+     * @prop --bs-popover-easing - Curve of the open/close motion. Aliased to `--bs-easing-standard`.
+     * @prop --bs-popover-distance - How far the popup nudges while it fades. Aliased to `--bs-spacing-50`.
+     * The popup fades and nudges toward its trigger when it opens and closes. Length, curve and travel are
+     * `--bs-popover-duration`, `--bs-popover-easing` and `--bs-popover-distance`; under `prefers-reduced-motion: reduce` it is instant.
      */
     interface HTMLBsPopoverElement extends Components.BsPopover, HTMLStencilElement {
         addEventListener<K extends keyof HTMLBsPopoverElementEventMap>(type: K, listener: (this: HTMLBsPopoverElement, ev: BsPopoverCustomEvent<HTMLBsPopoverElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -8406,6 +8542,40 @@ declare global {
         prototype: HTMLBsPopoverElement;
         new (): HTMLBsPopoverElement;
     };
+    interface HTMLBsPresenceElementEventMap {
+        "bsTransitionEnd": boolean;
+    }
+    /**
+     * Shows and hides slotted content with a short enter/exit transition.
+     * The motion uses the shared duration and easing tokens (`--bs-duration-*`, `--bs-easing-*`).
+     * Under `prefers-reduced-motion: reduce` those durations are already `0ms`, and this component
+     * forces `--bs-presence-duration` to `--bs-duration-instant` as well, so the content snaps
+     * instead of moving.
+     * ## When to use
+     * - Revealing a block that does not have its own enter/exit (a card, a form section, a panel).
+     * - Comparing duration and easing tokens while designing a screen.
+     * ## When not to use
+     * - Loading placeholders (`bs-skeleton`), spinners (`bs-spinner`), or progress.
+     * - Dialog, snackbar, toast, and command palette — those components own their motion.
+     * @prop --bs-presence-duration - Transition length. Set from the `duration` prop to a `--bs-duration-*` token.
+     * @prop --bs-presence-easing - Transition curve. Set from the `easing` prop to a `--bs-easing-*` token.
+     * @prop --bs-presence-distance - Travel distance for `slide-up` and `slide-down`. Aliased to `--bs-spacing-400`.
+     * @prop --bs-presence-scale - Closed scale for `scale`. No unitless scale token exists, so the default is `0.96`.
+     */
+    interface HTMLBsPresenceElement extends Components.BsPresence, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLBsPresenceElementEventMap>(type: K, listener: (this: HTMLBsPresenceElement, ev: BsPresenceCustomEvent<HTMLBsPresenceElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLBsPresenceElementEventMap>(type: K, listener: (this: HTMLBsPresenceElement, ev: BsPresenceCustomEvent<HTMLBsPresenceElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLBsPresenceElement: {
+        prototype: HTMLBsPresenceElement;
+        new (): HTMLBsPresenceElement;
+    };
     interface HTMLBsProductTourElementEventMap {
         "bsPrimary": void;
         "bsSecondary": void;
@@ -8550,6 +8720,32 @@ declare global {
         prototype: HTMLBsRadioElement;
         new (): HTMLBsRadioElement;
     };
+    /**
+     * A touch-ripple effect: on pointer press, a circle grows from the press point and fades out.
+     * It is a building block for pressable components (`bs-button`, `bs-icon-button`, ...), not something
+     * to place on a page by itself. Put it inside a positioned, pressable parent; it fills that parent,
+     * follows its corner radius, and listens for `pointerdown` on it. Pointer-events pass through, so the
+     * parent still receives every click.
+     * The motion uses the shared duration and easing tokens. Under `prefers-reduced-motion: reduce` those
+     * durations are `0ms`, and the ripple does not play at all.
+     * ## When to use
+     * - Inside a pressable `bs-*` component, to give press feedback.
+     * ## When not to use
+     * - As a hover or focus indicator. Those are colour changes on the parent.
+     * - On non-interactive surfaces.
+     * Set the custom properties on the `bs-ripple` element itself. Inside another component that means `::part(ripple)`,
+     * e.g. `bs-button::part(ripple) { --bs-ripple-color: white; }`.
+     * @prop --bs-ripple-color - Ripple colour. `currentColor` by default, so it follows the parent's text colour and works on every variant.
+     * @prop --bs-ripple-opacity - Starting opacity of the ripple. No opacity token fits, so the default is `0.24`.
+     * @prop --bs-ripple-duration - Length of the ripple. Aliased to `--bs-duration-slower`.
+     * @prop --bs-ripple-easing - Curve of the ripple. Aliased to `--bs-easing-decelerate`.
+     */
+    interface HTMLBsRippleElement extends Components.BsRipple, HTMLStencilElement {
+    }
+    var HTMLBsRippleElement: {
+        prototype: HTMLBsRippleElement;
+        new (): HTMLBsRippleElement;
+    };
     interface HTMLBsSearchItemElementEventMap {
         "bsItemSelect": string | undefined;
     }
@@ -8679,6 +8875,8 @@ declare global {
      * @prop --bs-side-panel-overlay-bg - Backdrop color. Aliased to `--bs-surface-overlay`.
      * @prop --bs-side-panel-color - Text color. Aliased to `--bs-text-default`.
      * @prop --bs-side-panel-z-index - Stacking order. Aliased to `--bs-z-index-modal`.
+     * @prop --bs-side-panel-duration - Length of the slide in/out. Aliased to `--bs-duration-slow`.
+     * @prop --bs-side-panel-easing - Curve of the slide in/out. Aliased to `--bs-easing-standard`.
      */
     interface HTMLBsSidePanelElement extends Components.BsSidePanel, HTMLStencilElement {
         addEventListener<K extends keyof HTMLBsSidePanelElementEventMap>(type: K, listener: (this: HTMLBsSidePanelElement, ev: BsSidePanelCustomEvent<HTMLBsSidePanelElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -9172,6 +9370,11 @@ declare global {
      * - Interactive content or long text (use `bs-popover`).
      * @prop --bs-tooltip-trigger-offset - Gap between trigger and tooltip. Aliased to `--bs-spacing-100`.
      * @prop --bs-tooltip-trigger-z-index - Stacking order. Aliased to `--bs-z-index-popover`.
+     * @prop --bs-tooltip-trigger-duration - Length of the show/hide motion. Aliased to `--bs-duration-fast`.
+     * @prop --bs-tooltip-trigger-easing - Curve of the show/hide motion. Aliased to `--bs-easing-standard`.
+     * @prop --bs-tooltip-trigger-distance - How far the tooltip nudges while it fades. Aliased to `--bs-spacing-50`.
+     * The tooltip fades in while drifting a few pixels away from the trigger into place, and fades back out toward it. Under
+     * `prefers-reduced-motion: reduce` (or a duration of `0ms`) it appears and disappears instantly.
      */
     interface HTMLBsTooltipTriggerElement extends Components.BsTooltipTrigger, HTMLStencilElement {
     }
@@ -9375,11 +9578,13 @@ declare global {
         "bs-page-header": HTMLBsPageHeaderElement;
         "bs-pagination": HTMLBsPaginationElement;
         "bs-popover": HTMLBsPopoverElement;
+        "bs-presence": HTMLBsPresenceElement;
         "bs-product-tour": HTMLBsProductTourElement;
         "bs-progress": HTMLBsProgressElement;
         "bs-progress-linear": HTMLBsProgressLinearElement;
         "bs-qr-code": HTMLBsQrCodeElement;
         "bs-radio": HTMLBsRadioElement;
+        "bs-ripple": HTMLBsRippleElement;
         "bs-search-item": HTMLBsSearchItemElement;
         "bs-session-timeout": HTMLBsSessionTimeoutElement;
         "bs-shortcut-row": HTMLBsShortcutRowElement;
@@ -9416,6 +9621,10 @@ declare namespace LocalJSX {
      * (optionally managing which one(s) are expanded, e.g. "only one open at a time") themselves --
      * there's no accordion-group wrapper here, matching Figma's component which only specs the single
      * section, not a group behavior.
+     * @prop --bs-accordion-duration - Length of the expand/collapse motion. Aliased to `--bs-duration-default`.
+     * @prop --bs-accordion-easing - Curve of the expand/collapse motion. Aliased to `--bs-easing-standard`.
+     * Expanding and collapsing animate the body's height and rotate the caret. Under
+     * `prefers-reduced-motion: reduce` the duration token is `0ms`, so the body snaps.
      */
     interface BsAccordion {
         /**
@@ -10264,6 +10473,11 @@ declare namespace LocalJSX {
      * manages two things on those slide elements: the `hidden` attribute (off-page slides are hidden,
      * so they leave the tab order and the accessibility tree) and, only when not already set,
      * `role="group"`, `aria-roledescription="slide"` and an `aria-label` of "n of N".
+     * Changing page plays a short motion: the visible slides fade and slide out in the direction of travel,
+     * then the next page's slides fade and slide in (reversed for previous, and mirrored in RTL). The dots
+     * also grow and fade between pages. Motion length and distance follow `--bs-carousel-duration`,
+     * `--bs-carousel-easing` and `--bs-carousel-slide-distance`. Under `prefers-reduced-motion: reduce`
+     * the duration token is `0ms`, so pages switch instantly.
      * Composes `bs-pagination` (`tracker="numbers"`), `bs-icon-button` (previous/next for
      * `tracker="dots"`) and `bs-button` (Pause/Play) rather than re-implementing them.
      * ## When to use
@@ -13049,8 +13263,12 @@ declare namespace LocalJSX {
      * featured area on the right, and a footer with recently used items and a shortcut hint. Matches the Figma
      * "Mega menu" (types Columns, Column with featured, Compact and Compact with featured).
      * This is the panel only. Put it in `bs-navigation-header`'s `menu` slot, which anchors it under the bar at the
-     * header's full width, and toggle the host's `hidden` attribute from the tab that
-     * opens it; the panel does not open or close itself. Escape inside the panel fires `bsClose` so you can close it.
+     * header's full width, and show it from the tab that opens it; the panel does not open or close itself. Escape
+     * inside the panel fires `bsClose` so you can close it.
+     * There are two ways to show and hide it. Toggle the host's `hidden` attribute and it appears and disappears at once
+     * (the original contract, unchanged). Or set `open` and it fades and drops in from under the bar, then fades back out
+     * and is removed once the exit finishes. Leave `open` unset to keep using `hidden` only. `hidden` always wins: with it
+     * set the panel is not shown whatever `open` says.
      * Built from `bs-card` (panel surface), `bs-menu-block` or `bs-compact-menu-block` (the links), `bs-divider` and
      * `bs-key-caps` (the shortcut). The column layout, headings, featured text and footer row are plain layout
      * markup: no component covers them.
@@ -13077,6 +13295,10 @@ declare namespace LocalJSX {
      * @prop --bs-mega-menu-heading-color - Column headings. Aliased to `--bs-text-muted`.
      * @prop --bs-mega-menu-text-color - Featured title. Aliased to `--bs-text-default`.
      * @prop --bs-mega-menu-muted-color - Featured description and footer text. Aliased to `--bs-text-secondary`.
+     * @prop --bs-mega-menu-duration - Length of the open/close motion (`open` only). Aliased to `--bs-duration-default`.
+     * @prop --bs-mega-menu-easing - Curve of the open/close motion. Aliased to `--bs-easing-standard`.
+     * @prop --bs-mega-menu-distance - How far the panel drops while it fades. Aliased to `--bs-spacing-100`.
+     * Under `prefers-reduced-motion: reduce` (or a duration of `0ms`) setting `open` shows and hides the panel instantly.
      */
     interface BsMegaMenu {
         /**
@@ -13101,6 +13323,10 @@ declare namespace LocalJSX {
           * Fires when a link is chosen (click or Enter), with the item. Cancelable: `preventDefault()` cancels the originating click.
          */
         "onBsMenuSelect"?: (event: BsMegaMenuCustomEvent<BsMegaMenuItem>) => void;
+        /**
+          * Shows the panel with an enter/exit motion. Unset (the default) leaves visibility to the host's `hidden` attribute, which shows and hides instantly. `true` shows the panel; `false` fades it out and then removes it. The panel stays in the DOM and is `inert` while it fades out.
+         */
+        "open"?: boolean;
         /**
           * Recently used destinations, already translated, shown in the footer. JS property only.
           * @default []
@@ -13806,6 +14032,11 @@ declare namespace LocalJSX {
      * @prop --bs-popover-offset - Gap between trigger and popup. Aliased to `--bs-spacing-100`.
      * @prop --bs-popover-min-width - Minimum popup width. Aliased to `--bs-scale-1600`.
      * @prop --bs-popover-z-index - Popup stacking order. Aliased to `--bs-z-index-popover`.
+     * @prop --bs-popover-duration - Length of the open/close motion. Aliased to `--bs-duration-fast`.
+     * @prop --bs-popover-easing - Curve of the open/close motion. Aliased to `--bs-easing-standard`.
+     * @prop --bs-popover-distance - How far the popup nudges while it fades. Aliased to `--bs-spacing-50`.
+     * The popup fades and nudges toward its trigger when it opens and closes. Length, curve and travel are
+     * `--bs-popover-duration`, `--bs-popover-easing` and `--bs-popover-distance`; under `prefers-reduced-motion: reduce` it is instant.
      */
     interface BsPopover {
         /**
@@ -13823,6 +14054,49 @@ declare namespace LocalJSX {
          */
         "placement"?: BsPopoverPlacement;
     }
+    /**
+     * Shows and hides slotted content with a short enter/exit transition.
+     * The motion uses the shared duration and easing tokens (`--bs-duration-*`, `--bs-easing-*`).
+     * Under `prefers-reduced-motion: reduce` those durations are already `0ms`, and this component
+     * forces `--bs-presence-duration` to `--bs-duration-instant` as well, so the content snaps
+     * instead of moving.
+     * ## When to use
+     * - Revealing a block that does not have its own enter/exit (a card, a form section, a panel).
+     * - Comparing duration and easing tokens while designing a screen.
+     * ## When not to use
+     * - Loading placeholders (`bs-skeleton`), spinners (`bs-spinner`), or progress.
+     * - Dialog, snackbar, toast, and command palette — those components own their motion.
+     * @prop --bs-presence-duration - Transition length. Set from the `duration` prop to a `--bs-duration-*` token.
+     * @prop --bs-presence-easing - Transition curve. Set from the `easing` prop to a `--bs-easing-*` token.
+     * @prop --bs-presence-distance - Travel distance for `slide-up` and `slide-down`. Aliased to `--bs-spacing-400`.
+     * @prop --bs-presence-scale - Closed scale for `scale`. No unitless scale token exists, so the default is `0.96`.
+     */
+    interface BsPresence {
+        /**
+          * When true, the slotted content is shown. Flipping this plays the exit or enter transition.
+          * @default false
+         */
+        "active"?: boolean;
+        /**
+          * Length of the transition, mapped to a `--bs-duration-*` token.
+          * @default 'default'
+         */
+        "duration"?: BsPresenceDuration;
+        /**
+          * Curve of the transition, mapped to a `--bs-easing-*` token.
+          * @default 'standard'
+         */
+        "easing"?: BsPresenceEasing;
+        /**
+          * Fires once when the transition to the new `active` state finishes. Payload is that state.
+         */
+        "onBsTransitionEnd"?: (event: BsPresenceCustomEvent<boolean>) => void;
+        /**
+          * Which transition to play.
+          * @default 'fade'
+         */
+        "preset"?: BsPresencePreset;
+    }
     /**
      * One step of a product tour: a centred **welcome** or **success** card with an art tile, or a
      * **pointer** card -- a compact step with a close button, a "1 of 3" progress label and Back/Next
@@ -14186,6 +14460,42 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    /**
+     * A touch-ripple effect: on pointer press, a circle grows from the press point and fades out.
+     * It is a building block for pressable components (`bs-button`, `bs-icon-button`, ...), not something
+     * to place on a page by itself. Put it inside a positioned, pressable parent; it fills that parent,
+     * follows its corner radius, and listens for `pointerdown` on it. Pointer-events pass through, so the
+     * parent still receives every click.
+     * The motion uses the shared duration and easing tokens. Under `prefers-reduced-motion: reduce` those
+     * durations are `0ms`, and the ripple does not play at all.
+     * ## When to use
+     * - Inside a pressable `bs-*` component, to give press feedback.
+     * ## When not to use
+     * - As a hover or focus indicator. Those are colour changes on the parent.
+     * - On non-interactive surfaces.
+     * Set the custom properties on the `bs-ripple` element itself. Inside another component that means `::part(ripple)`,
+     * e.g. `bs-button::part(ripple) { --bs-ripple-color: white; }`.
+     * @prop --bs-ripple-color - Ripple colour. `currentColor` by default, so it follows the parent's text colour and works on every variant.
+     * @prop --bs-ripple-opacity - Starting opacity of the ripple. No opacity token fits, so the default is `0.24`.
+     * @prop --bs-ripple-duration - Length of the ripple. Aliased to `--bs-duration-slower`.
+     * @prop --bs-ripple-easing - Curve of the ripple. Aliased to `--bs-easing-decelerate`.
+     */
+    interface BsRipple {
+        /**
+          * Always start the ripple from the centre instead of the press point. Use it for round or icon-only controls.
+          * @default false
+         */
+        "centered"?: boolean;
+        /**
+          * Turns the ripple off. A disabled parent (`<button disabled>`) also stops it.
+          * @default false
+         */
+        "disabled"?: boolean;
+        /**
+          * CSS selector of the element to listen on, found with `closest()` from the ripple (so it stays inside the same shadow tree). By default the ripple listens on its parent. Use it when the pressable element is bigger than the ripple's own parent, e.g. a switch whose ripple sits on the knob but whose whole `<label>` is the press target.
+         */
+        "triggerSelector"?: string;
+    }
     /**
      * One result or suggestion row of a search dropdown: a leading icon, a primary line, an optional
      * description line and trailing text. Static, not focusable -- focus stays in the search field and the
@@ -14439,6 +14749,8 @@ declare namespace LocalJSX {
      * @prop --bs-side-panel-overlay-bg - Backdrop color. Aliased to `--bs-surface-overlay`.
      * @prop --bs-side-panel-color - Text color. Aliased to `--bs-text-default`.
      * @prop --bs-side-panel-z-index - Stacking order. Aliased to `--bs-z-index-modal`.
+     * @prop --bs-side-panel-duration - Length of the slide in/out. Aliased to `--bs-duration-slow`.
+     * @prop --bs-side-panel-easing - Curve of the slide in/out. Aliased to `--bs-easing-standard`.
      */
     interface BsSidePanel {
         /**
@@ -15260,6 +15572,11 @@ declare namespace LocalJSX {
      * - Interactive content or long text (use `bs-popover`).
      * @prop --bs-tooltip-trigger-offset - Gap between trigger and tooltip. Aliased to `--bs-spacing-100`.
      * @prop --bs-tooltip-trigger-z-index - Stacking order. Aliased to `--bs-z-index-popover`.
+     * @prop --bs-tooltip-trigger-duration - Length of the show/hide motion. Aliased to `--bs-duration-fast`.
+     * @prop --bs-tooltip-trigger-easing - Curve of the show/hide motion. Aliased to `--bs-easing-standard`.
+     * @prop --bs-tooltip-trigger-distance - How far the tooltip nudges while it fades. Aliased to `--bs-spacing-50`.
+     * The tooltip fades in while drifting a few pixels away from the trigger into place, and fades back out toward it. Under
+     * `prefers-reduced-motion: reduce` (or a duration of `0ms`) it appears and disappears instantly.
      */
     interface BsTooltipTrigger {
         /**
@@ -16107,6 +16424,7 @@ declare namespace LocalJSX {
     }
     interface BsMegaMenuAttributes {
         "type": BsMegaMenuType;
+        "open": boolean;
         "label": string;
         "recentLabel": string;
         "shortcutLabel": string;
@@ -16200,6 +16518,12 @@ declare namespace LocalJSX {
         "open": boolean;
         "placement": BsPopoverPlacement;
     }
+    interface BsPresenceAttributes {
+        "active": boolean;
+        "preset": BsPresencePreset;
+        "duration": BsPresenceDuration;
+        "easing": BsPresenceEasing;
+    }
     interface BsProductTourAttributes {
         "type": BsProductTourType;
         "direction": BsProductTourDirection;
@@ -16259,6 +16583,11 @@ declare namespace LocalJSX {
         "checked": boolean;
         "disabled": boolean;
     }
+    interface BsRippleAttributes {
+        "centered": boolean;
+        "disabled": boolean;
+        "triggerSelector": string;
+    }
     interface BsSearchItemAttributes {
         "value": string;
         "active": boolean;
@@ -16543,11 +16872,13 @@ declare namespace LocalJSX {
         "bs-page-header": Omit<BsPageHeader, keyof BsPageHeaderAttributes> & { [K in keyof BsPageHeader & keyof BsPageHeaderAttributes]?: BsPageHeader[K] } & { [K in keyof BsPageHeader & keyof BsPageHeaderAttributes as `attr:${K}`]?: BsPageHeaderAttributes[K] } & { [K in keyof BsPageHeader & keyof BsPageHeaderAttributes as `prop:${K}`]?: BsPageHeader[K] };
         "bs-pagination": Omit<BsPagination, keyof BsPaginationAttributes> & { [K in keyof BsPagination & keyof BsPaginationAttributes]?: BsPagination[K] } & { [K in keyof BsPagination & keyof BsPaginationAttributes as `attr:${K}`]?: BsPaginationAttributes[K] } & { [K in keyof BsPagination & keyof BsPaginationAttributes as `prop:${K}`]?: BsPagination[K] };
         "bs-popover": Omit<BsPopover, keyof BsPopoverAttributes> & { [K in keyof BsPopover & keyof BsPopoverAttributes]?: BsPopover[K] } & { [K in keyof BsPopover & keyof BsPopoverAttributes as `attr:${K}`]?: BsPopoverAttributes[K] } & { [K in keyof BsPopover & keyof BsPopoverAttributes as `prop:${K}`]?: BsPopover[K] };
+        "bs-presence": Omit<BsPresence, keyof BsPresenceAttributes> & { [K in keyof BsPresence & keyof BsPresenceAttributes]?: BsPresence[K] } & { [K in keyof BsPresence & keyof BsPresenceAttributes as `attr:${K}`]?: BsPresenceAttributes[K] } & { [K in keyof BsPresence & keyof BsPresenceAttributes as `prop:${K}`]?: BsPresence[K] };
         "bs-product-tour": Omit<BsProductTour, keyof BsProductTourAttributes> & { [K in keyof BsProductTour & keyof BsProductTourAttributes]?: BsProductTour[K] } & { [K in keyof BsProductTour & keyof BsProductTourAttributes as `attr:${K}`]?: BsProductTourAttributes[K] } & { [K in keyof BsProductTour & keyof BsProductTourAttributes as `prop:${K}`]?: BsProductTour[K] };
         "bs-progress": Omit<BsProgress, keyof BsProgressAttributes> & { [K in keyof BsProgress & keyof BsProgressAttributes]?: BsProgress[K] } & { [K in keyof BsProgress & keyof BsProgressAttributes as `attr:${K}`]?: BsProgressAttributes[K] } & { [K in keyof BsProgress & keyof BsProgressAttributes as `prop:${K}`]?: BsProgress[K] };
         "bs-progress-linear": Omit<BsProgressLinear, keyof BsProgressLinearAttributes> & { [K in keyof BsProgressLinear & keyof BsProgressLinearAttributes]?: BsProgressLinear[K] } & { [K in keyof BsProgressLinear & keyof BsProgressLinearAttributes as `attr:${K}`]?: BsProgressLinearAttributes[K] } & { [K in keyof BsProgressLinear & keyof BsProgressLinearAttributes as `prop:${K}`]?: BsProgressLinear[K] };
         "bs-qr-code": Omit<BsQrCode, keyof BsQrCodeAttributes> & { [K in keyof BsQrCode & keyof BsQrCodeAttributes]?: BsQrCode[K] } & { [K in keyof BsQrCode & keyof BsQrCodeAttributes as `attr:${K}`]?: BsQrCodeAttributes[K] } & { [K in keyof BsQrCode & keyof BsQrCodeAttributes as `prop:${K}`]?: BsQrCode[K] };
         "bs-radio": Omit<BsRadio, keyof BsRadioAttributes> & { [K in keyof BsRadio & keyof BsRadioAttributes]?: BsRadio[K] } & { [K in keyof BsRadio & keyof BsRadioAttributes as `attr:${K}`]?: BsRadioAttributes[K] } & { [K in keyof BsRadio & keyof BsRadioAttributes as `prop:${K}`]?: BsRadio[K] };
+        "bs-ripple": Omit<BsRipple, keyof BsRippleAttributes> & { [K in keyof BsRipple & keyof BsRippleAttributes]?: BsRipple[K] } & { [K in keyof BsRipple & keyof BsRippleAttributes as `attr:${K}`]?: BsRippleAttributes[K] } & { [K in keyof BsRipple & keyof BsRippleAttributes as `prop:${K}`]?: BsRipple[K] };
         "bs-search-item": Omit<BsSearchItem, keyof BsSearchItemAttributes> & { [K in keyof BsSearchItem & keyof BsSearchItemAttributes]?: BsSearchItem[K] } & { [K in keyof BsSearchItem & keyof BsSearchItemAttributes as `attr:${K}`]?: BsSearchItemAttributes[K] } & { [K in keyof BsSearchItem & keyof BsSearchItemAttributes as `prop:${K}`]?: BsSearchItem[K] };
         "bs-session-timeout": Omit<BsSessionTimeout, keyof BsSessionTimeoutAttributes> & { [K in keyof BsSessionTimeout & keyof BsSessionTimeoutAttributes]?: BsSessionTimeout[K] } & { [K in keyof BsSessionTimeout & keyof BsSessionTimeoutAttributes as `attr:${K}`]?: BsSessionTimeoutAttributes[K] } & { [K in keyof BsSessionTimeout & keyof BsSessionTimeoutAttributes as `prop:${K}`]?: BsSessionTimeout[K] };
         "bs-shortcut-row": Omit<BsShortcutRow, keyof BsShortcutRowAttributes> & { [K in keyof BsShortcutRow & keyof BsShortcutRowAttributes]?: BsShortcutRow[K] } & { [K in keyof BsShortcutRow & keyof BsShortcutRowAttributes as `attr:${K}`]?: BsShortcutRowAttributes[K] } & { [K in keyof BsShortcutRow & keyof BsShortcutRowAttributes as `prop:${K}`]?: BsShortcutRow[K] };
@@ -16585,6 +16916,10 @@ declare module "@stencil/core" {
              * (optionally managing which one(s) are expanded, e.g. "only one open at a time") themselves --
              * there's no accordion-group wrapper here, matching Figma's component which only specs the single
              * section, not a group behavior.
+             * @prop --bs-accordion-duration - Length of the expand/collapse motion. Aliased to `--bs-duration-default`.
+             * @prop --bs-accordion-easing - Curve of the expand/collapse motion. Aliased to `--bs-easing-standard`.
+             * Expanding and collapsing animate the body's height and rotate the caret. Under
+             * `prefers-reduced-motion: reduce` the duration token is `0ms`, so the body snaps.
              */
             "bs-accordion": LocalJSX.IntrinsicElements["bs-accordion"] & JSXBase.HTMLAttributes<HTMLBsAccordionElement>;
             /**
@@ -16978,6 +17313,11 @@ declare module "@stencil/core" {
              * manages two things on those slide elements: the `hidden` attribute (off-page slides are hidden,
              * so they leave the tab order and the accessibility tree) and, only when not already set,
              * `role="group"`, `aria-roledescription="slide"` and an `aria-label` of "n of N".
+             * Changing page plays a short motion: the visible slides fade and slide out in the direction of travel,
+             * then the next page's slides fade and slide in (reversed for previous, and mirrored in RTL). The dots
+             * also grow and fade between pages. Motion length and distance follow `--bs-carousel-duration`,
+             * `--bs-carousel-easing` and `--bs-carousel-slide-distance`. Under `prefers-reduced-motion: reduce`
+             * the duration token is `0ms`, so pages switch instantly.
              * Composes `bs-pagination` (`tracker="numbers"`), `bs-icon-button` (previous/next for
              * `tracker="dots"`) and `bs-button` (Pause/Play) rather than re-implementing them.
              * ## When to use
@@ -17834,8 +18174,12 @@ declare module "@stencil/core" {
              * featured area on the right, and a footer with recently used items and a shortcut hint. Matches the Figma
              * "Mega menu" (types Columns, Column with featured, Compact and Compact with featured).
              * This is the panel only. Put it in `bs-navigation-header`'s `menu` slot, which anchors it under the bar at the
-             * header's full width, and toggle the host's `hidden` attribute from the tab that
-             * opens it; the panel does not open or close itself. Escape inside the panel fires `bsClose` so you can close it.
+             * header's full width, and show it from the tab that opens it; the panel does not open or close itself. Escape
+             * inside the panel fires `bsClose` so you can close it.
+             * There are two ways to show and hide it. Toggle the host's `hidden` attribute and it appears and disappears at once
+             * (the original contract, unchanged). Or set `open` and it fades and drops in from under the bar, then fades back out
+             * and is removed once the exit finishes. Leave `open` unset to keep using `hidden` only. `hidden` always wins: with it
+             * set the panel is not shown whatever `open` says.
              * Built from `bs-card` (panel surface), `bs-menu-block` or `bs-compact-menu-block` (the links), `bs-divider` and
              * `bs-key-caps` (the shortcut). The column layout, headings, featured text and footer row are plain layout
              * markup: no component covers them.
@@ -17862,6 +18206,10 @@ declare module "@stencil/core" {
              * @prop --bs-mega-menu-heading-color - Column headings. Aliased to `--bs-text-muted`.
              * @prop --bs-mega-menu-text-color - Featured title. Aliased to `--bs-text-default`.
              * @prop --bs-mega-menu-muted-color - Featured description and footer text. Aliased to `--bs-text-secondary`.
+             * @prop --bs-mega-menu-duration - Length of the open/close motion (`open` only). Aliased to `--bs-duration-default`.
+             * @prop --bs-mega-menu-easing - Curve of the open/close motion. Aliased to `--bs-easing-standard`.
+             * @prop --bs-mega-menu-distance - How far the panel drops while it fades. Aliased to `--bs-spacing-100`.
+             * Under `prefers-reduced-motion: reduce` (or a duration of `0ms`) setting `open` shows and hides the panel instantly.
              */
             "bs-mega-menu": LocalJSX.IntrinsicElements["bs-mega-menu"] & JSXBase.HTMLAttributes<HTMLBsMegaMenuElement>;
             /**
@@ -18155,8 +18503,31 @@ declare module "@stencil/core" {
              * @prop --bs-popover-offset - Gap between trigger and popup. Aliased to `--bs-spacing-100`.
              * @prop --bs-popover-min-width - Minimum popup width. Aliased to `--bs-scale-1600`.
              * @prop --bs-popover-z-index - Popup stacking order. Aliased to `--bs-z-index-popover`.
+             * @prop --bs-popover-duration - Length of the open/close motion. Aliased to `--bs-duration-fast`.
+             * @prop --bs-popover-easing - Curve of the open/close motion. Aliased to `--bs-easing-standard`.
+             * @prop --bs-popover-distance - How far the popup nudges while it fades. Aliased to `--bs-spacing-50`.
+             * The popup fades and nudges toward its trigger when it opens and closes. Length, curve and travel are
+             * `--bs-popover-duration`, `--bs-popover-easing` and `--bs-popover-distance`; under `prefers-reduced-motion: reduce` it is instant.
              */
             "bs-popover": LocalJSX.IntrinsicElements["bs-popover"] & JSXBase.HTMLAttributes<HTMLBsPopoverElement>;
+            /**
+             * Shows and hides slotted content with a short enter/exit transition.
+             * The motion uses the shared duration and easing tokens (`--bs-duration-*`, `--bs-easing-*`).
+             * Under `prefers-reduced-motion: reduce` those durations are already `0ms`, and this component
+             * forces `--bs-presence-duration` to `--bs-duration-instant` as well, so the content snaps
+             * instead of moving.
+             * ## When to use
+             * - Revealing a block that does not have its own enter/exit (a card, a form section, a panel).
+             * - Comparing duration and easing tokens while designing a screen.
+             * ## When not to use
+             * - Loading placeholders (`bs-skeleton`), spinners (`bs-spinner`), or progress.
+             * - Dialog, snackbar, toast, and command palette — those components own their motion.
+             * @prop --bs-presence-duration - Transition length. Set from the `duration` prop to a `--bs-duration-*` token.
+             * @prop --bs-presence-easing - Transition curve. Set from the `easing` prop to a `--bs-easing-*` token.
+             * @prop --bs-presence-distance - Travel distance for `slide-up` and `slide-down`. Aliased to `--bs-spacing-400`.
+             * @prop --bs-presence-scale - Closed scale for `scale`. No unitless scale token exists, so the default is `0.96`.
+             */
+            "bs-presence": LocalJSX.IntrinsicElements["bs-presence"] & JSXBase.HTMLAttributes<HTMLBsPresenceElement>;
             /**
              * One step of a product tour: a centred **welcome** or **success** card with an art tile, or a
              * **pointer** card -- a compact step with a close button, a "1 of 3" progress label and Back/Next
@@ -18237,6 +18608,27 @@ declare module "@stencil/core" {
              * - An on/off setting that takes effect immediately (no explicit form submission) -- use `bs-switch`.
              */
             "bs-radio": LocalJSX.IntrinsicElements["bs-radio"] & JSXBase.HTMLAttributes<HTMLBsRadioElement>;
+            /**
+             * A touch-ripple effect: on pointer press, a circle grows from the press point and fades out.
+             * It is a building block for pressable components (`bs-button`, `bs-icon-button`, ...), not something
+             * to place on a page by itself. Put it inside a positioned, pressable parent; it fills that parent,
+             * follows its corner radius, and listens for `pointerdown` on it. Pointer-events pass through, so the
+             * parent still receives every click.
+             * The motion uses the shared duration and easing tokens. Under `prefers-reduced-motion: reduce` those
+             * durations are `0ms`, and the ripple does not play at all.
+             * ## When to use
+             * - Inside a pressable `bs-*` component, to give press feedback.
+             * ## When not to use
+             * - As a hover or focus indicator. Those are colour changes on the parent.
+             * - On non-interactive surfaces.
+             * Set the custom properties on the `bs-ripple` element itself. Inside another component that means `::part(ripple)`,
+             * e.g. `bs-button::part(ripple) { --bs-ripple-color: white; }`.
+             * @prop --bs-ripple-color - Ripple colour. `currentColor` by default, so it follows the parent's text colour and works on every variant.
+             * @prop --bs-ripple-opacity - Starting opacity of the ripple. No opacity token fits, so the default is `0.24`.
+             * @prop --bs-ripple-duration - Length of the ripple. Aliased to `--bs-duration-slower`.
+             * @prop --bs-ripple-easing - Curve of the ripple. Aliased to `--bs-easing-decelerate`.
+             */
+            "bs-ripple": LocalJSX.IntrinsicElements["bs-ripple"] & JSXBase.HTMLAttributes<HTMLBsRippleElement>;
             /**
              * One result or suggestion row of a search dropdown: a leading icon, a primary line, an optional
              * description line and trailing text. Static, not focusable -- focus stays in the search field and the
@@ -18322,6 +18714,8 @@ declare module "@stencil/core" {
              * @prop --bs-side-panel-overlay-bg - Backdrop color. Aliased to `--bs-surface-overlay`.
              * @prop --bs-side-panel-color - Text color. Aliased to `--bs-text-default`.
              * @prop --bs-side-panel-z-index - Stacking order. Aliased to `--bs-z-index-modal`.
+             * @prop --bs-side-panel-duration - Length of the slide in/out. Aliased to `--bs-duration-slow`.
+             * @prop --bs-side-panel-easing - Curve of the slide in/out. Aliased to `--bs-easing-standard`.
              */
             "bs-side-panel": LocalJSX.IntrinsicElements["bs-side-panel"] & JSXBase.HTMLAttributes<HTMLBsSidePanelElement>;
             /**
@@ -18624,6 +19018,11 @@ declare module "@stencil/core" {
              * - Interactive content or long text (use `bs-popover`).
              * @prop --bs-tooltip-trigger-offset - Gap between trigger and tooltip. Aliased to `--bs-spacing-100`.
              * @prop --bs-tooltip-trigger-z-index - Stacking order. Aliased to `--bs-z-index-popover`.
+             * @prop --bs-tooltip-trigger-duration - Length of the show/hide motion. Aliased to `--bs-duration-fast`.
+             * @prop --bs-tooltip-trigger-easing - Curve of the show/hide motion. Aliased to `--bs-easing-standard`.
+             * @prop --bs-tooltip-trigger-distance - How far the tooltip nudges while it fades. Aliased to `--bs-spacing-50`.
+             * The tooltip fades in while drifting a few pixels away from the trigger into place, and fades back out toward it. Under
+             * `prefers-reduced-motion: reduce` (or a duration of `0ms`) it appears and disappears instantly.
              */
             "bs-tooltip-trigger": LocalJSX.IntrinsicElements["bs-tooltip-trigger"] & JSXBase.HTMLAttributes<HTMLBsTooltipTriggerElement>;
             /**