npm - @shopify/ui-extensions - Versions diffs - 2025.10.0-rc.9 → 2025.10.0 - Mend

@shopify/ui-extensions 2025.10.0-rc.9 → 2025.10.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 (1481) hide show

package/build/ts/surfaces/customer-account/components/components.d.ts CHANGED Viewed

@@ -13,7 +13,14 @@
  * https://github.com/Shopify/ui-api-design/issues/139
  */
 export type ComponentChildren = any;
-interface AbbreviationProps$1 {
+export type StringChildren = string;
+export interface GlobalProps {
+	/**
+	 * A unique identifier for the element.
+	 */
+	id?: string;
+}
+interface AbbreviationProps$1 extends GlobalProps {
 	/**
 	 * The content of the abbreviation or acronym.
 	 */
@@ -29,14 +36,136 @@ interface AbbreviationProps$1 {
 	 */
 	title?: string;
 }
-export type SizeKeyword = "small-500" | "small-400" | "small-300" | "small-200" | "small-100" | "small" | "base" | "large" | "large-100" | "large-200" | "large-300" | "large-400" | "large-500";
-export type ColorKeyword = "subdued" | "base" | "strong";
-export interface GlobalProps {
+export interface ActionSlots {
 	/**
-	 * A unique identifier for the element.
+	 * The primary action to perform, provided as a button or link type element.
 	 */
-	id?: string;
+	primaryAction?: ComponentChildren;
+	/**
+	 * The secondary actions to perform, provided as button or link type elements.
+	 */
+	secondaryActions?: ComponentChildren;
+}
+export interface BaseOverlayProps {
+	/**
+	 * Callback fired after the overlay is shown.
+	 */
+	onShow?: (event: Event) => void;
+	/**
+	 * Callback fired when the overlay is shown **after** any animations to show the overlay have finished.
+	 */
+	onAfterShow?: (event: Event) => void;
+	/**
+	 * Callback fired after the overlay is hidden.
+	 */
+	onHide?: (event: Event) => void;
+	/**
+	 * Callback fired when the overlay is hidden **after** any animations to hide the overlay have finished.
+	 */
+	onAfterHide?: (event: Event) => void;
+}
+/**
+ * Shared interfaces for web component methods.
+ *
+ * Methods are required (not optional) because:
+ * - Components implementing this interface must provide all methods
+ * - Unlike props/attributes, methods are not rendered in HTML but are JavaScript APIs
+ * - Consumers expect these methods to be consistently available on all instances
+ */
+export interface BaseOverlayMethods {
+	/**
+	 * Method to show an overlay.
+	 *
+	 * @implementation This is a method to be called on the element and not a callback and should hence be camelCase
+	 */
+	showOverlay: () => void;
+	/**
+	 * Method to hide an overlay.
+	 *
+	 * @implementation This is a method to be called on the element and not a callback and should hence be camelCase
+	 */
+	hideOverlay: () => void;
+	/**
+	 * Method to toggle the visiblity of an overlay.
+	 *
+	 * @implementation This is a method to be called on the element and not a callback and should hence be camelCase
+	 */
+	toggleOverlay: () => void;
+}
+export interface FocusEventProps {
+	/**
+	 * Callback when the element loses focus.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event
+	 */
+	onBlur?: (event: FocusEvent) => void;
+	/**
+	 * Callback when the element receives focus.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event
+	 */
+	onFocus?: (event: FocusEvent) => void;
+}
+export interface ToggleEventProps {
+	/**
+	 * Callback fired when the element state changes **after** any animations have finished.
+	 *
+	 * - If the element transitioned from hidden to showing, the `oldState` property will be set to `closed` and the
+	 *   `newState` property will be set to `open`.
+	 * - If the element transitioned from showing to hidden, the `oldState` property will be set to `open` and the
+	 *   `newState` will be `closed`.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState
+	 */
+	onAfterToggle?: (event: ToggleEvent$1) => void;
+	/**
+	 * Callback straight after the element state changes.
+	 *
+	 * - If the element is transitioning from hidden to showing, the `oldState` property will be set to `closed` and the
+	 *   `newState` property will be set to `open`.
+	 * - If the element is transitioning from showing to hidden, then `oldState` property will be set to `open` and the
+	 *   `newState` will be `closed`.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState
+	 */
+	onToggle?: (event: ToggleEvent$1) => void;
+}
+export type ToggleState = "open" | "closed";
+interface ToggleEvent$1 extends Event {
+	readonly newState: ToggleState;
+	readonly oldState: ToggleState;
+}
+export interface ExtendableEvent extends Event {
+	/**
+	 * Provide a promise that signals the length, and eventual success or failure of actions relating to the event.
+	 *
+	 * This may be called many times, which adds promises to the event.
+	 *
+	 * However, this may only be called synchronously during the dispatch of the event.
+	 * As in, you cannot call it after a `setTimeout` or microtask.
+	 */
+	waitUntil?: (promise: Promise<void>) => void;
+}
+interface AnnouncementProps$1 extends GlobalProps, ToggleEventProps {
+	/**
+	 * The content of the announcement.
+	 */
+	children?: ComponentChildren;
+	/**
+	 * Callback fired when the announcement is dismissed by the user
+	 * (either via the built-in dismiss button or programmatically).
+	 */
+	onDismiss?: (event: Event) => void;
+	/**
+	 * Method to programmatically dismiss the announcement.
+	 */
+	dismiss: () => void;
 }
+export type SizeKeyword = "small-500" | "small-400" | "small-300" | "small-200" | "small-100" | "small" | "base" | "large" | "large-100" | "large-200" | "large-300" | "large-400" | "large-500";
+export type ColorKeyword = "subdued" | "base" | "strong";
 export type BackgroundColorKeyword = "transparent" | ColorKeyword;
 export interface BackgroundProps {
 	/**
@@ -56,7 +185,7 @@ export interface BackgroundProps {
  *
  * @default 'auto'
  */
-export type ToneKeyword = "auto" | "neutral" | "info" | "success" | "caution" | "warning" | "critical" | "custom";
+export type ToneKeyword = "auto" | "neutral" | "info" | "success" | "caution" | "warning" | "critical" | "accent" | "custom";
 declare const privateIconArray: readonly [
 	"adjust",
 	"affiliate",
@@ -65,23 +194,23 @@ declare const privateIconArray: readonly [
 	"alert-circle",
 	"alert-diamond",
 	"alert-location",
-	"alert-octagon-filled",
 	"alert-octagon",
+	"alert-octagon-filled",
 	"alert-triangle",
 	"alert-triangle-filled",
 	"app-extension",
 	"apps",
 	"archive",
+	"arrow-down",
 	"arrow-down-circle",
 	"arrow-down-right",
-	"arrow-down",
-	"arrow-left-circle",
 	"arrow-left",
-	"arrow-right-circle",
+	"arrow-left-circle",
 	"arrow-right",
+	"arrow-right-circle",
+	"arrow-up",
 	"arrow-up-circle",
 	"arrow-up-right",
-	"arrow-up",
 	"arrows-in-horizontal",
 	"arrows-out-horizontal",
 	"attachment",
@@ -90,34 +219,39 @@ declare const privateIconArray: readonly [
 	"bag",
 	"bank",
 	"barcode",
+	"battery-low",
 	"bill",
 	"blank",
 	"blog",
-	"bolt-filled",
 	"bolt",
-	"book-open",
+	"bolt-filled",
 	"book",
+	"book-open",
 	"bug",
 	"bullet",
 	"business-entity",
-	"button-press",
 	"button",
+	"button-press",
 	"calculator",
+	"calendar",
 	"calendar-check",
 	"calendar-compare",
 	"calendar-list",
 	"calendar-time",
-	"calendar",
-	"camera-flip",
 	"camera",
+	"camera-flip",
 	"caret-down",
+	"caret-left",
+	"caret-right",
 	"caret-up",
+	"cart",
 	"cart-abandoned",
 	"cart-discount",
 	"cart-down",
+	"cart-filled",
 	"cart-sale",
+	"cart-send",
 	"cart-up",
-	"cart",
 	"cash-dollar",
 	"cash-euro",
 	"cash-pound",
@@ -129,8 +263,8 @@ declare const privateIconArray: readonly [
 	"chart-cohort",
 	"chart-donut",
 	"chart-funnel",
-	"chart-histogram-first-last",
 	"chart-histogram-first",
+	"chart-histogram-first-last",
 	"chart-histogram-flat",
 	"chart-histogram-full",
 	"chart-histogram-growth",
@@ -141,36 +275,36 @@ declare const privateIconArray: readonly [
 	"chart-popular",
 	"chart-stacked",
 	"chart-vertical",
+	"chat",
 	"chat-new",
 	"chat-referral",
-	"chat",
-	"check-circle-filled",
-	"check-circle",
 	"check",
+	"check-circle",
+	"check-circle-filled",
 	"checkbox",
-	"chevron-down-circle",
 	"chevron-down",
-	"chevron-left-circle",
+	"chevron-down-circle",
 	"chevron-left",
-	"chevron-right-circle",
+	"chevron-left-circle",
 	"chevron-right",
-	"chevron-up-circle",
+	"chevron-right-circle",
 	"chevron-up",
-	"circle-dashed",
+	"chevron-up-circle",
 	"circle",
+	"circle-dashed",
+	"clipboard",
 	"clipboard-check",
 	"clipboard-checklist",
-	"clipboard",
-	"clock-revert",
 	"clock",
-	"code-add",
+	"clock-revert",
 	"code",
+	"code-add",
+	"collection",
 	"collection-featured",
 	"collection-list",
 	"collection-reference",
-	"collection",
-	"color-none",
 	"color",
+	"color-none",
 	"compass",
 	"complete",
 	"compose",
@@ -181,76 +315,81 @@ declare const privateIconArray: readonly [
 	"corner-pill",
 	"corner-round",
 	"corner-square",
+	"credit-card",
 	"credit-card-cancel",
 	"credit-card-percent",
+	"credit-card-reader",
 	"credit-card-reader-chip",
 	"credit-card-reader-tap",
-	"credit-card-reader",
 	"credit-card-secure",
 	"credit-card-tap-chip",
-	"credit-card",
 	"crop",
 	"currency-convert",
+	"cursor",
 	"cursor-banner",
 	"cursor-option",
-	"cursor",
 	"data-presentation",
 	"data-table",
+	"database",
 	"database-add",
 	"database-connect",
-	"database",
 	"delete",
 	"delivered",
 	"delivery",
 	"desktop",
 	"disabled",
+	"disabled-filled",
+	"discount",
 	"discount-add",
+	"discount-automatic",
 	"discount-code",
-	"discount",
+	"discount-remove",
 	"dns-settings",
 	"dock-floating",
 	"dock-side",
+	"domain",
 	"domain-landing-page",
 	"domain-new",
 	"domain-redirect",
-	"domain",
 	"download",
 	"drag-drop",
 	"drag-handle",
+	"drawer",
 	"duplicate",
 	"edit",
+	"email",
 	"email-follow-up",
 	"email-newsletter",
-	"email",
 	"empty",
 	"enabled",
 	"enter",
-	"envelope-soft-pack",
 	"envelope",
+	"envelope-soft-pack",
 	"eraser",
 	"exchange",
 	"exit",
 	"export",
 	"external",
 	"eye-check-mark",
-	"eye-dropper-list",
 	"eye-dropper",
+	"eye-dropper-list",
 	"eye-first",
 	"eyeglasses",
 	"fav",
 	"favicon",
-	"file-list",
 	"file",
+	"file-list",
 	"filter",
+	"filter-active",
 	"flag",
 	"flip-horizontal",
 	"flip-vertical",
 	"flower",
+	"folder",
 	"folder-add",
 	"folder-down",
 	"folder-remove",
 	"folder-up",
-	"folder",
 	"food",
 	"foreground",
 	"forklift",
@@ -258,33 +397,35 @@ declare const privateIconArray: readonly [
 	"games",
 	"gauge",
 	"geolocation",
-	"gift-card",
 	"gift",
+	"gift-card",
 	"git-branch",
 	"git-commit",
 	"git-repository",
+	"globe",
 	"globe-asia",
 	"globe-europe",
 	"globe-lines",
 	"globe-list",
-	"globe",
+	"graduation-hat",
 	"grid",
+	"hashtag",
 	"hashtag-decimal",
 	"hashtag-list",
-	"hashtag",
 	"heart",
-	"hide-filled",
 	"hide",
+	"hide-filled",
 	"home",
+	"home-filled",
 	"icons",
 	"identity-card",
+	"image",
 	"image-add",
 	"image-alt",
 	"image-explore",
 	"image-magic",
 	"image-none",
 	"image-with-text-overlay",
-	"image",
 	"images",
 	"import",
 	"in-progress",
@@ -293,20 +434,25 @@ declare const privateIconArray: readonly [
 	"incomplete",
 	"info",
 	"info-filled",
-	"inventory-updated",
+	"inheritance",
 	"inventory",
+	"inventory-edit",
+	"inventory-list",
+	"inventory-transfer",
+	"inventory-updated",
 	"iq",
 	"key",
+	"keyboard",
 	"keyboard-filled",
 	"keyboard-hide",
-	"keyboard",
+	"keypad",
 	"label-printer",
-	"language-translate",
 	"language",
+	"language-translate",
 	"layout-block",
+	"layout-buy-button",
 	"layout-buy-button-horizontal",
 	"layout-buy-button-vertical",
-	"layout-buy-button",
 	"layout-column-1",
 	"layout-columns-2",
 	"layout-columns-3",
@@ -319,64 +465,73 @@ declare const privateIconArray: readonly [
 	"layout-sidebar-left",
 	"layout-sidebar-right",
 	"lightbulb",
-	"link-list",
 	"link",
+	"link-list",
 	"list-bulleted",
+	"list-bulleted-filled",
 	"list-numbered",
 	"live",
-	"location-none",
+	"live-critical",
+	"live-none",
 	"location",
+	"location-none",
 	"lock",
 	"map",
+	"markets",
 	"markets-euro",
 	"markets-rupee",
 	"markets-yen",
-	"markets",
 	"maximize",
-	"measurement-size-list",
 	"measurement-size",
-	"measurement-volume-list",
+	"measurement-size-list",
 	"measurement-volume",
-	"measurement-weight-list",
+	"measurement-volume-list",
 	"measurement-weight",
+	"measurement-weight-list",
 	"media-receiver",
 	"megaphone",
 	"mention",
+	"menu",
+	"menu-filled",
 	"menu-horizontal",
 	"menu-vertical",
-	"menu",
 	"merge",
 	"metafields",
+	"metaobject",
 	"metaobject-list",
 	"metaobject-reference",
-	"metaobject",
 	"microphone",
 	"minimize",
-	"minus-circle",
 	"minus",
+	"minus-circle",
 	"mobile",
-	"money-none",
 	"money",
+	"money-none",
+	"money-split",
 	"moon",
 	"nature",
-	"note-add",
 	"note",
+	"note-add",
 	"notification",
+	"order",
 	"order-batches",
 	"order-draft",
+	"order-filled",
 	"order-first",
 	"order-fulfilled",
 	"order-repeat",
 	"order-unfulfilled",
-	"order",
 	"orders-status",
 	"organization",
 	"outdent",
 	"outgoing",
+	"package",
+	"package-cancel",
 	"package-fulfilled",
 	"package-on-hold",
+	"package-reassign",
 	"package-returned",
-	"package",
+	"page",
 	"page-add",
 	"page-attachment",
 	"page-clock",
@@ -387,7 +542,6 @@ declare const privateIconArray: readonly [
 	"page-remove",
 	"page-report",
 	"page-up",
-	"page",
 	"pagination-end",
 	"pagination-start",
 	"paint-brush-flat",
@@ -397,49 +551,55 @@ declare const privateIconArray: readonly [
 	"passkey",
 	"paste",
 	"pause-circle",
-	"payment-capture",
 	"payment",
+	"payment-capture",
+	"payout",
 	"payout-dollar",
 	"payout-euro",
 	"payout-pound",
 	"payout-rupee",
 	"payout-yen",
-	"payout",
+	"person",
 	"person-add",
 	"person-exit",
+	"person-filled",
 	"person-list",
 	"person-lock",
 	"person-remove",
 	"person-segment",
-	"person",
 	"personalized-text",
+	"phablet",
+	"phone",
 	"phone-in",
 	"phone-out",
-	"phone",
 	"pin",
 	"pin-remove",
 	"plan",
-	"play-circle",
 	"play",
+	"play-circle",
+	"plus",
 	"plus-circle",
 	"plus-circle-down",
+	"plus-circle-filled",
 	"plus-circle-up",
-	"plus",
 	"point-of-sale",
+	"point-of-sale-register",
 	"price-list",
 	"print",
+	"product",
 	"product-add",
 	"product-cost",
+	"product-filled",
 	"product-list",
 	"product-reference",
 	"product-remove",
 	"product-return",
 	"product-unavailable",
-	"product",
-	"profile-filled",
 	"profile",
-	"question-circle-filled",
+	"profile-filled",
 	"question-circle",
+	"question-circle-filled",
+	"receipt",
 	"receipt-dollar",
 	"receipt-euro",
 	"receipt-folded",
@@ -448,7 +608,6 @@ declare const privateIconArray: readonly [
 	"receipt-refund",
 	"receipt-rupee",
 	"receipt-yen",
-	"receipt",
 	"receivables",
 	"redo",
 	"referral-code",
@@ -466,10 +625,12 @@ declare const privateIconArray: readonly [
 	"sandbox",
 	"save",
 	"savings",
+	"scan-qr-code",
+	"search",
+	"search-add",
 	"search-list",
 	"search-recent",
 	"search-resource",
-	"search",
 	"select",
 	"send",
 	"settings",
@@ -479,6 +640,7 @@ declare const privateIconArray: readonly [
 	"shield-pending",
 	"shield-person",
 	"shipping-label",
+	"shipping-label-cancel",
 	"shopcodes",
 	"slideshow",
 	"smiley-happy",
@@ -487,68 +649,70 @@ declare const privateIconArray: readonly [
 	"smiley-sad",
 	"social-ad",
 	"social-post",
+	"sort",
 	"sort-ascending",
 	"sort-descending",
-	"sort",
 	"sound",
 	"sports",
+	"star",
+	"star-circle",
 	"star-filled",
 	"star-half",
 	"star-list",
-	"star",
-	"status-active",
 	"status",
+	"status-active",
 	"stop-circle",
+	"store",
 	"store-import",
 	"store-managed",
 	"store-online",
-	"store",
 	"sun",
-	"table-masonry",
 	"table",
+	"table-masonry",
 	"tablet",
 	"target",
 	"tax",
 	"team",
+	"text",
 	"text-align-center",
 	"text-align-left",
 	"text-align-right",
 	"text-block",
 	"text-bold",
 	"text-color",
-	"text-font-list",
 	"text-font",
+	"text-font-list",
 	"text-grammar",
 	"text-in-columns",
 	"text-in-rows",
-	"text-indent-remove",
 	"text-indent",
+	"text-indent-remove",
 	"text-italic",
 	"text-quote",
 	"text-title",
 	"text-underline",
 	"text-with-image",
-	"text",
+	"theme",
 	"theme-edit",
 	"theme-store",
 	"theme-template",
-	"theme",
 	"three-d-environment",
 	"thumbs-down",
 	"thumbs-up",
 	"tip-jar",
 	"toggle-off",
 	"toggle-on",
+	"transaction",
+	"transaction-fee-add",
 	"transaction-fee-dollar",
 	"transaction-fee-euro",
 	"transaction-fee-pound",
 	"transaction-fee-rupee",
 	"transaction-fee-yen",
-	"transaction",
+	"transfer",
 	"transfer-in",
 	"transfer-internal",
 	"transfer-out",
-	"transfer",
 	"truck",
 	"undo",
 	"unknown-device",
@@ -564,12 +728,12 @@ declare const privateIconArray: readonly [
 	"wand",
 	"watch",
 	"wifi",
-	"work-list",
 	"work",
+	"work-list",
 	"wrench",
-	"x-circle-filled",
+	"x",
 	"x-circle",
-	"x"
+	"x-circle-filled"
 ];
 export type IconType = (typeof privateIconArray)[number];
 /**
@@ -578,6 +742,7 @@ export type IconType = (typeof privateIconArray)[number];
 export type ExtractStrict<T, U extends T> = Extract<T, U>;
 export type MaybeAllValuesShorthandProperty<T extends string> = T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`;
 export type MaybeTwoValuesShorthandProperty<T extends string> = T | `${T} ${T}`;
+export type MaybeResponsive<T> = T | `@container${string}`;
 /**
  * Prevents widening string literal types in a union to `string`.
  * @example
@@ -587,44 +752,48 @@ export type MaybeTwoValuesShorthandProperty<T extends string> = T | `${T} ${T}`;
  * //   ^? 'foo' | 'bar' | (string & {})
  */
 export type AnyString = string & {};
-export interface ActionSlots {
+/**
+ * This is purely to give the ability
+ * to have a space or not in the string literal types.
+ *
+ * For example in the `aspectRatio` property, `16/9` and `16 / 9` are both valid.
+ */
+export type optionalSpace = "" | " ";
+interface BadgeProps$1 extends GlobalProps {
 	/**
-	 * The primary action to perform, provided as a button or link type element.
+	 * The content of the Badge.
 	 */
-	primaryAction?: ComponentChildren;
+	children?: ComponentChildren;
 	/**
-	 * The secondary actions to perform, provided as button or link type elements.
+	 * Sets the tone of the Badge, based on the intention of the information being conveyed.
+	 *
+	 * @default 'auto'
 	 */
-	secondaryActions?: ComponentChildren;
-}
-/**
- * Used for Container Query-related props.
- */
-export interface ContainerProps {
+	tone?: ToneKeyword;
 	/**
-	 * The name of the container used for Container Queries.
+	 * Modify the color to be more or less intense.
 	 *
-	 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/container-name
+	 * @default 'base'
+	 */
+	color?: ColorKeyword;
+	/**
+	 * The type of icon to be displayed in the badge.
 	 *
 	 * @default ''
-	 *
-	 * @implementation All components that implement this interface must put a containerName of `s-default` on the root element of that component, regardless of the value of `containerType`.
-	 * The developer-supplied containerName here would be in addition to the above-mentioned containerName.
 	 */
-	containerName?: string;
+	icon?: IconType | AnyString;
 	/**
-	 * The type of container used for Container Queries.
-	 *
-	 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/container-type
-	 *
-	 * - `normal`: The element is not a query container for any container size queries.
-	 * - `inline-size`: Establishes a query container for dimensional queries on the inline axis of the container. Applies layout, style, and inline-size containment to the element.
+	 * The position of the icon in relation to the text.
+	 */
+	iconPosition?: "start" | "end";
+	/**
+	 * Adjusts the size.
 	 *
-	 * @default 'normal'
+	 * @default 'base'
 	 */
-	containerType?: "normal" | "inline-size";
+	size?: SizeKeyword;
 }
-interface BannerProps$1 extends GlobalProps, ActionSlots, ContainerProps {
+interface BannerProps$1 extends GlobalProps, ActionSlots {
 	/**
 	 * The title of the banner.
 	 *
@@ -675,7 +844,7 @@ interface BannerProps$1 extends GlobalProps, ActionSlots, ContainerProps {
 	 *
 	 * The `hidden` property will be `false` when this event fires.
 	 */
-	onDismiss?: () => void;
+	onDismiss?: (event: Event) => void;
 	/**
 	 * Event handler when the banner has fully hidden.
 	 *
@@ -685,7 +854,7 @@ interface BannerProps$1 extends GlobalProps, ActionSlots, ContainerProps {
 	 * this event must fire after the banner has fully hidden.
 	 * We can add an `onHide` event in future if we want to provide a hook for the start of the animation.
 	 */
-	onAfterHide?: () => void;
+	onAfterHide?: (event: Event) => void;
 	/**
 	 * Determines whether the banner is hidden.
 	 *
@@ -709,7 +878,7 @@ export interface DisplayProps {
 	 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/display
 	 * @default 'auto'
 	 */
-	display?: "auto" | "none";
+	display?: MaybeResponsive<"auto" | "none">;
 }
 export interface AccessibilityRoleProps {
 	/**
@@ -884,7 +1053,7 @@ export interface PaddingProps {
 	 *
 	 * @default 'none'
 	 */
-	padding?: MaybeAllValuesShorthandProperty<PaddingKeyword>;
+	padding?: MaybeResponsive<MaybeAllValuesShorthandProperty<PaddingKeyword>>;
 	/**
 	 * Adjust the block-padding.
 	 *
@@ -894,7 +1063,7 @@ export interface PaddingProps {
 	 *
 	 * @default '' - meaning no override
 	 */
-	paddingBlock?: MaybeTwoValuesShorthandProperty<PaddingKeyword> | "";
+	paddingBlock?: MaybeResponsive<MaybeTwoValuesShorthandProperty<PaddingKeyword> | "">;
 	/**
 	 * Adjust the block-start padding.
 	 *
@@ -902,7 +1071,7 @@ export interface PaddingProps {
 	 *
 	 * @default '' - meaning no override
 	 */
-	paddingBlockStart?: PaddingKeyword | "";
+	paddingBlockStart?: MaybeResponsive<PaddingKeyword | "">;
 	/**
 	 * Adjust the block-end padding.
 	 *
@@ -910,7 +1079,7 @@ export interface PaddingProps {
 	 *
 	 * @default '' - meaning no override
 	 */
-	paddingBlockEnd?: PaddingKeyword | "";
+	paddingBlockEnd?: MaybeResponsive<PaddingKeyword | "">;
 	/**
 	 * Adjust the inline padding.
 	 *
@@ -920,7 +1089,7 @@ export interface PaddingProps {
 	 *
 	 * @default '' - meaning no override
 	 */
-	paddingInline?: MaybeTwoValuesShorthandProperty<PaddingKeyword> | "";
+	paddingInline?: MaybeResponsive<MaybeTwoValuesShorthandProperty<PaddingKeyword> | "">;
 	/**
 	 * Adjust the inline-start padding.
 	 *
@@ -928,7 +1097,7 @@ export interface PaddingProps {
 	 *
 	 * @default '' - meaning no override
 	 */
-	paddingInlineStart?: PaddingKeyword | "";
+	paddingInlineStart?: MaybeResponsive<PaddingKeyword | "">;
 	/**
 	 * Adjust the inline-end padding.
 	 *
@@ -936,7 +1105,7 @@ export interface PaddingProps {
 	 *
 	 * @default '' - meaning no override
 	 */
-	paddingInlineEnd?: PaddingKeyword | "";
+	paddingInlineEnd?: MaybeResponsive<PaddingKeyword | "">;
 }
 export type SizeUnits = `${number}px` | `${number}%` | `0`;
 export type SizeUnitsOrAuto = SizeUnits | "auto";
@@ -949,7 +1118,7 @@ export interface SizingProps {
 	 *
 	 * @default 'auto'
 	 */
-	blockSize?: SizeUnitsOrAuto;
+	blockSize?: MaybeResponsive<SizeUnitsOrAuto>;
 	/**
 	 * Adjust the minimum block size.
 	 *
@@ -957,7 +1126,7 @@ export interface SizingProps {
 	 *
 	 * @default '0'
 	 */
-	minBlockSize?: SizeUnits;
+	minBlockSize?: MaybeResponsive<SizeUnits>;
 	/**
 	 * Adjust the maximum block size.
 	 *
@@ -965,7 +1134,7 @@ export interface SizingProps {
 	 *
 	 * @default 'none'
 	 */
-	maxBlockSize?: SizeUnitsOrNone;
+	maxBlockSize?: MaybeResponsive<SizeUnitsOrNone>;
 	/**
 	 * Adjust the inline size.
 	 *
@@ -973,7 +1142,7 @@ export interface SizingProps {
 	 *
 	 * @default 'auto'
 	 */
-	inlineSize?: SizeUnitsOrAuto;
+	inlineSize?: MaybeResponsive<SizeUnitsOrAuto>;
 	/**
 	 * Adjust the minimum inline size.
 	 *
@@ -981,7 +1150,7 @@ export interface SizingProps {
 	 *
 	 * @default '0'
 	 */
-	minInlineSize?: SizeUnits;
+	minInlineSize?: MaybeResponsive<SizeUnits>;
 	/**
 	 * Adjust the maximum inline size.
 	 *
@@ -989,7 +1158,7 @@ export interface SizingProps {
 	 *
 	 * @default 'none'
 	 */
-	maxInlineSize?: SizeUnitsOrNone;
+	maxInlineSize?: MaybeResponsive<SizeUnitsOrNone>;
 }
 export type BorderStyleKeyword = "none" | "solid" | "dashed" | "dotted" | "auto";
 export type BorderSizeKeyword = SizeKeyword | "none";
@@ -1095,7 +1264,7 @@ export interface OverflowProps {
 	 */
 	overflow?: "hidden" | "visible";
 }
-export interface BaseBoxProps extends GlobalProps, AccessibilityVisibilityProps, BackgroundProps, DisplayProps, SizingProps, PaddingProps, BorderProps, OverflowProps, ContainerProps {
+export interface BaseBoxProps extends AccessibilityVisibilityProps, BackgroundProps, DisplayProps, SizingProps, PaddingProps, BorderProps, OverflowProps {
 	/**
 	 * The content of the Box.
 	 */
@@ -1110,49 +1279,11 @@ export interface BaseBoxProps extends GlobalProps, AccessibilityVisibilityProps,
 }
 export interface BaseBoxPropsWithRole extends BaseBoxProps, AccessibilityRoleProps {
 }
-interface BoxProps$1 extends BaseBoxPropsWithRole {
-}
-export interface FocusEventProps {
-	/**
-	 * Callback when the element loses focus.
-	 */
-	onBlur?: () => void;
-	/**
-	 * Callback when the element receives focus.
-	 */
-	onFocus?: () => void;
-}
-export interface ToggleEventProps {
-	/**
-	 * Callback fired when the element state changes **after** any animations have finished.
-	 *
-	 * - If the element transitioned from hidden to showing, the `oldState` property will be set to `closed` and the
-	 *   `newState` property will be set to `open`.
-	 * - If the element transitioned from showing to hidden, the `oldState` property will be set to `open` and the
-	 *   `newState` will be `closed`.
-	 *
-	 * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState
-	 * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState
-	 */
-	onAfterToggle?: (oldState: ToggleState, newState: ToggleState) => void;
-	/**
-	 * Callback straight after the element state changes.
-	 *
-	 * - If the element is transitioning from hidden to showing, the `oldState` property will be set to `closed` and the
-	 *   `newState` property will be set to `open`.
-	 * - If the element is transitioning from showing to hidden, then `oldState` property will be set to `open` and the
-	 *   `newState` will be `closed`.
-	 *
-	 * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event
-	 * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState
-	 * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState
-	 */
-	onToggle?: (oldState: ToggleState, newState: ToggleState) => void;
+interface BoxProps$1 extends BaseBoxPropsWithRole, GlobalProps {
 }
-export type ToggleState = "open" | "closed";
 export interface ButtonBehaviorProps extends InteractionProps, FocusEventProps {
 	/**
-	 * The behavior of the button.
+	 * The behavior of the Button.
 	 *
 	 * - `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.
 	 * - `button`: Used to indicate the component acts as a button, meaning it has no default action.
@@ -1164,12 +1295,14 @@ export interface ButtonBehaviorProps extends InteractionProps, FocusEventProps {
 	 */
 	type?: "submit" | "button" | "reset";
 	/**
-	 * Callback when the button is activated.
+	 * Callback when the Button is activated.
 	 * This will be called before the action indicated by `type`.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event
 	 */
-	onClick?: () => void;
+	onClick?: (event: Event) => void;
 	/**
-	 * Disables the button, meaning it cannot be clicked or receive focus.
+	 * Disables the Button meaning it cannot be clicked or receive focus.
 	 *
 	 * @default false
 	 */
@@ -1177,7 +1310,7 @@ export interface ButtonBehaviorProps extends InteractionProps, FocusEventProps {
 	/**
 	 * Replaces content with a loading indicator while a background action is being performed.
 	 *
-	 * This also disables the button.
+	 * This also disables the Button.
 	 *
 	 * @default false
 	 */
@@ -1207,15 +1340,17 @@ export interface LinkBehaviorProps extends InteractionProps, FocusEventProps {
 	target?: "auto" | "_blank" | "_self" | "_parent" | "_top" | AnyString;
 	/**
 	 * Causes the browser to treat the linked URL as a download with the string being the file name.
-	 * Download only works for same-origin URLs, or the blob: and data: schemes.
+	 * Download only works for same-origin URLs or the `blob:` and `data:` schemes.
 	 * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download
 	 */
 	download?: string;
 	/**
 	 * Callback when the link is activated.
 	 * This will be called before navigating to the location specified by `href`.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event
 	 */
-	onClick?: () => void;
+	onClick?: (event: Event) => void;
 }
 export interface InteractionProps {
 	/**
@@ -1242,6 +1377,10 @@ export interface InteractionProps {
 	 * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command
 	 */
 	command?: "--auto" | "--show" | "--hide" | "--toggle" | "--copy";
+	/**
+	 * ID of a component that should respond to interest (e.g. hover and focus) on this component.
+	 */
+	interestFor?: string;
 }
 export interface BaseClickableProps extends ButtonBehaviorProps, LinkBehaviorProps {
 }
@@ -1249,7 +1388,7 @@ interface ButtonProps$1 extends GlobalProps, BaseClickableProps {
 	/**
 	 * A label that describes the purpose or contents of the Button. It will be read to users using assistive technologies such as screen readers.
 	 *
-	 * Use this when using only an icon or the button text is not enough context
+	 * Use this when using only an icon or the Button text is not enough context
 	 * for users using assistive technologies.
 	 */
 	accessibilityLabel?: string;
@@ -1258,13 +1397,13 @@ interface ButtonProps$1 extends GlobalProps, BaseClickableProps {
 	 */
 	children?: ComponentChildren;
 	/**
-	 * The type of icon to be displayed in the button.
+	 * The type of icon to be displayed in the Button.
 	 *
 	 * @default ''
 	 */
 	icon?: IconType | AnyString;
 	/**
-	 * The displayed inline width of the button.
+	 * The displayed inline width of the Button.
 	 *
 	 * - `auto`: the size of the button depends on the surface and context.
 	 * - `fill`: the button will takes up 100% of the available inline size.
@@ -1280,7 +1419,7 @@ interface ButtonProps$1 extends GlobalProps, BaseClickableProps {
 	 */
 	variant?: "auto" | "primary" | "secondary" | "tertiary";
 	/**
-	 * Sets the tone of the Button, based on the intention of the information being conveyed.
+	 * Sets the tone of the Button based on the intention of the information being conveyed.
 	 *
 	 * @default 'auto'
 	 */
@@ -1307,12 +1446,16 @@ export interface BaseInputProps {
 export interface InputProps extends BaseInputProps {
 	/**
 	 * Callback when the user has **finished editing** a field, e.g. once they have blurred the field.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event
 	 */
-	onChange?: (newValue: string) => void;
+	onChange?: (event: Event) => void;
 	/**
 	 * Callback when the user makes any changes in the field.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event
 	 */
-	onInput?: (newValue: string) => void;
+	onInput?: (event: Event) => void;
 	/**
 	 * The current value for the field. If omitted, the field will be empty.
 	 */
@@ -1324,22 +1467,54 @@ export interface InputProps extends BaseInputProps {
 	 */
 	defaultValue?: string;
 }
-export interface FileInputProps<T extends File[] | File = File[]> extends BaseInputProps {
+export interface MultipleInputProps extends BaseInputProps {
 	/**
-	 * Callback when the user has **finished editing** a field, e.g. once they have blurred the field.
+	 * Callback when the user has selected option(s).
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event
 	 */
-	onChange?: (newValue: T) => void;
+	onChange?: (event: Event) => void;
 	/**
-	 * Callback when the user makes any changes in the field.
+	 * Callback when the user has selected option(s).
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event
+	 */
+	onInput?: (event: Event) => void;
+	/**
+	 * An array of the `value`s of the selected options.
+	 *
+	 * This is a convenience prop for setting the `selected` prop on child options.
+	 */
+	values?: string[];
+}
+export interface FileInputProps extends BaseInputProps {
+	/**
+	 * Callback when the user has **finished selecting** a file or files.
+	 */
+	onChange?: (event: Event) => void;
+	/**
+	 * Callback when the user makes any changes in the file selection.
+	 */
+	onInput?: (event: Event) => void;
+	/**
+	 * A string that represents the path to the selected file(s). If no file is selected yet, the value is an empty string ("").
+	 * When the user selected multiple files, the value represents the first file in the list of files they selected.
+	 * The value is always the file's name prefixed with "C:\fakepath\", which isn't the real path of the file.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/file#value
+	 *
+	 * @default ''
 	 */
-	onInput?: (newValue: T) => void;
+	value?: string;
 	/**
-	 * The current value for the field.
+	 * An array of File objects representing the files currently selected by the user.
+	 *
+	 * This property is read-only and cannot be directly modified.
+	 * To clear the selected files, set the `value` prop to an empty string or null.
 	 *
-	 * TODO: This is a read-only getter.
-	 * We haven't agreed how to represent that yet.
+	 * @default []
 	 */
-	value?: T;
+	files?: readonly File[];
 }
 export interface FieldErrorProps {
 	/**
@@ -1541,12 +1716,16 @@ export interface BaseCheckableProps extends BaseSelectableProps, InteractionProp
 	name?: string;
 	/**
 	 * A callback that is run whenever the control is changed.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event
 	 */
-	onChange?: (checked: boolean) => void;
+	onChange?: (event: Event) => void;
 	/**
 	 * A callback that is run whenever the control is changed.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event
 	 */
-	onInput?: (checked: boolean) => void;
+	onInput?: (event: Event) => void;
 }
 interface CheckboxProps$1 extends GlobalProps, BaseCheckableProps, FieldErrorProps, FieldDetailsProps {
 	/**
@@ -1582,7 +1761,107 @@ interface CheckboxProps$1 extends GlobalProps, BaseCheckableProps, FieldErrorPro
 	 */
 	required?: boolean;
 }
-interface ClickableProps$1 extends BaseBoxProps, BaseClickableProps {
+export interface ChipProps$1 {
+	/**
+	 * The content of the chip.
+	 */
+	children?: ComponentChildren;
+	/**
+	 * The graphic to display inside of the chip.
+	 *
+	 * @implementation Only `s-icon` is supported.
+	 */
+	graphic?: ComponentChildren;
+	/**
+	 * A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers.
+	 */
+	accessibilityLabel?: string;
+	/**
+	 * Modify the color to be more or less intense.
+	 *
+	 * @default 'base'
+	 */
+	color?: ColorKeyword;
+}
+interface ChipProps$1 extends ChipProps$1, GlobalProps {
+}
+interface ChoiceProps$1 extends GlobalProps, BaseOptionProps {
+	/**
+	 * Content to use as the choice label.
+	 *
+	 * @implementation (StringChildren) The label is produced by extracting and
+	 * concatenating the text nodes from the provided content; any markup or
+	 * element structure is ignored.
+	 *
+	 * @implementation (ComponentChildren) Behaves as a slot: any elements passed
+	 * are rendered as the label content (subject to surface constraints); there
+	 * is no coercion to a string.
+	 */
+	children?: ComponentChildren | StringChildren;
+	/**
+	 * Additional text to provide context or guidance for the input.
+	 *
+	 * This text is displayed along with the input and its label
+	 * to offer more information or instructions to the user.
+	 *
+	 * @implementation this content should be linked to the input with an `aria-describedby` attribute.
+	 */
+	details?: ComponentChildren;
+	/**
+	 * Set to `true` to associate a choice with the error passed to `ChoiceList`
+	 *
+	 * @default false
+	 */
+	error?: boolean;
+	/**
+	 * Secondary content for a choice.
+	 */
+	secondaryContent?: ComponentChildren;
+	/**
+	 * Content to display when the option is selected.
+	 *
+	 * This can be used to provide additional information or options related to the choice.
+	 */
+	selectedContent?: ComponentChildren;
+}
+interface ChoiceListProps$1 extends GlobalProps, Pick<BasicFieldProps, "label" | "labelAccessibilityVisibility" | "error">, MultipleInputProps, FieldDetailsProps {
+	/**
+	 * Whether multiple choices can be selected.
+	 *
+	 * @default false
+	 */
+	multiple?: boolean;
+	/**
+	 * The choices a user can select from.
+	 *
+	 * Accepts `Choice` components.
+	 */
+	children?: ComponentChildren;
+	/**
+	 * Disables the field, disallowing any interaction.
+	 *
+	 * `disabled` on any child choices is ignored when this is true.
+	 *
+	 * @default false
+	 */
+	disabled?: MultipleInputProps["disabled"];
+	/**
+	 * The variant of the choice grid.
+	 *
+	 * - `auto`: The variant is determined by the context.
+	 * - `list`: The choices are displayed in a list.
+	 * - `inline`: The choices are displayed on the inline axis.
+	 * - `block`: The choices are displayed on the block axis.
+	 * - `grid`: The choices are displayed in a grid.
+	 *
+	 * @implementation The `block`, `inline` and `grid` variants are more suitable for button looking choices, but it's at the
+	 * discretion of each surface.
+	 *
+	 * @default 'auto'
+	 */
+	variant?: "auto" | "list" | "inline" | "block" | "grid";
+}
+interface ClickableProps$1 extends GlobalProps, BaseBoxProps, BaseClickableProps {
 	/**
 	 * Disables the clickable, and indicates to assistive technology that the loading is in progress.
 	 *
@@ -1610,6 +1889,56 @@ interface ClickableProps$1 extends BaseBoxProps, BaseClickableProps {
 	 */
 	lang?: string;
 }
+interface ClickableChipProps$1 extends ChipProps$1, GlobalProps {
+	/**
+	 * Callback when the chip is clicked.
+	 */
+	onClick?: (event: Event) => void;
+	/**
+	 * The URL to link to.
+	 *
+	 * - If set, it will navigate to the location specified by `href` after executing the `click` event.
+	 */
+	href?: string;
+	/**
+	 * Whether the chip is removable.
+	 *
+	 * @default false
+	 */
+	removable?: boolean;
+	/**
+	 * Callback when the chip is removed.
+	 */
+	onRemove?: (event: Event) => void;
+	/**
+	 * Determines whether the chip is hidden.
+	 *
+	 * If this property is being set on each framework render (as in 'controlled' usage),
+	 * and the chip is `removable`,
+	 * ensure you update app state for this property when the `remove` event fires.
+	 *
+	 * If the chip is not `removable`, it can still be hidden by setting this property.
+	 *
+	 * @default false
+	 */
+	hidden?: boolean;
+	/**
+	 * Event handler when the chip has fully hidden.
+	 *
+	 * The `hidden` property will be `true` when this event fires.
+	 *
+	 * @implementation If implementations animate the hiding of the chip,
+	 * this event must fire after the chip has fully hidden.
+	 * We can add an `onHide` event in future if we want to provide a hook for the start of the animation.
+	 */
+	onAfterHide?: (event: Event) => void;
+	/**
+	 * Disables the chip, disallowing any interaction.
+	 *
+	 * @default false
+	 */
+	disabled?: boolean;
+}
 interface ClipboardItemProps$1 extends GlobalProps {
 	/**
 	 * Plain text to be written to the clipboard.
@@ -1620,11 +1949,11 @@ interface ClipboardItemProps$1 extends GlobalProps {
 	/**
 	 * Callback run when the copy to clipboard succeeds.
 	 */
-	onCopy?: () => void;
+	onCopy?: (event: ClipboardEvent) => void;
 	/**
 	 * Callback run when the copy to clipboard fails.
 	 */
-	onCopyError?: () => void;
+	onCopyError?: (event: Event) => void;
 }
 export interface AutocompleteProps<AutocompleteField extends AnyAutocompleteField> {
 	/**
@@ -1667,93 +1996,310 @@ export type AutocompleteGroup = "shipping" | "billing";
 export type AutocompleteAddressGroup = "fax" | "home" | "mobile" | "pager";
 export type AnyAutocompleteField = "additional-name" | "address-level1" | "address-level2" | "address-level3" | "address-level4" | "address-line1" | "address-line2" | "address-line3" | "country-name" | "country" | "current-password" | "email" | "family-name" | "given-name" | "honorific-prefix" | "honorific-suffix" | "language" | "name" | "new-password" | "nickname" | "one-time-code" | "organization-title" | "organization" | "photo" | "postal-code" | "sex" | "street-address" | "transaction-amount" | "transaction-currency" | "url" | "username" | "bday-day" | "bday-month" | "bday-year" | "bday" | "cc-additional-name" | "cc-expiry-month" | "cc-expiry-year" | "cc-expiry" | "cc-family-name" | "cc-given-name" | "cc-name" | "cc-number" | "cc-csc" | "cc-type" | `${AutocompleteAddressGroup} email` | "impp" | `${AutocompleteAddressGroup} impp` | "tel" | "tel-area-code" | "tel-country-code" | "tel-extension" | "tel-local-prefix" | "tel-local-suffix" | "tel-local" | "tel-national" | `${AutocompleteAddressGroup} tel` | `${AutocompleteAddressGroup} tel-area-code` | `${AutocompleteAddressGroup} tel-country-code` | `${AutocompleteAddressGroup} tel-extension` | `${AutocompleteAddressGroup} tel-local-prefix` | `${AutocompleteAddressGroup} tel-local-suffix` | `${AutocompleteAddressGroup} tel-local` | `${AutocompleteAddressGroup} tel-national`;
 export type TextAutocompleteField = ExtractStrict<AnyAutocompleteField, "additional-name" | "address-level1" | "address-level2" | "address-level3" | "address-level4" | "address-line1" | "address-line2" | "address-line3" | "country-name" | "country" | "family-name" | "given-name" | "honorific-prefix" | "honorific-suffix" | "language" | "name" | "nickname" | "one-time-code" | "organization-title" | "organization" | "postal-code" | "sex" | "street-address" | "transaction-currency" | "username" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-type">;
-interface DetailsProps$1 extends GlobalProps, ToggleEventProps, ContainerProps {
-	/**
-	 * The content of the details.
-	 *
-	 * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details
-	 */
-	children?: ComponentChildren;
+export type ConsentPolicy = "sms-marketing";
+interface ConsentCheckboxProps$1 extends GlobalProps, CheckboxProps$1 {
 	/**
-	 * Name of the element.
-	 *
-	 * This can be used to create multiple named disclosure boxes that where only one can be open at a time.
+	 * The policy for which user consent is being collected for.
 	 *
-	 * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#multiple_named_disclosure_boxes
+	 * `sms-marketing`: Represents the policy for SMS marketing consent.
 	 */
-	name?: string;
+	policy?: ConsentPolicy;
+}
+export type PhoneAutocompleteField = ExtractStrict<AnyAutocompleteField, "tel" | "tel-area-code" | "tel-country-code" | "tel-extension" | "tel-local-prefix" | "tel-local-suffix" | "tel-local" | "tel-national" | `${AutocompleteAddressGroup} tel` | `${AutocompleteAddressGroup} tel-area-code` | `${AutocompleteAddressGroup} tel-country-code` | `${AutocompleteAddressGroup} tel-extension` | `${AutocompleteAddressGroup} tel-local-prefix` | `${AutocompleteAddressGroup} tel-local-suffix` | `${AutocompleteAddressGroup} tel-local` | `${AutocompleteAddressGroup} tel-national`>;
+interface PhoneFieldProps$1 extends GlobalProps, BaseTextFieldProps, Pick<FieldDecorationProps, "accessory">, AutocompleteProps<PhoneAutocompleteField> {
 	/**
-	 * Indicates whether the element should be open by default.
+	 * The type of number to collect.
 	 *
-	 * This reflects to the `defaultopen` attribute.
+	 * Specific style may be applied to each type to provide extra guidance to users. Note that no extra validation is performed based on the type.
 	 *
-	 * @default false
+	 * @default '' meaning no specific kind of phone number
 	 */
-	defaultOpen?: boolean;
+	type?: "mobile" | "";
+}
+interface ConsentPhoneFieldProps$1 extends GlobalProps, PhoneFieldProps$1 {
 	/**
-	 * Sets the transition between the two states.
+	 * The policy for which user consent is being collected for.
 	 *
-	 * @default 'auto'
+	 * `sms-marketing`: Represents the policy for SMS marketing consent.
 	 */
-	toggleTransition?: "none" | "auto";
+	policy?: ConsentPolicy;
 }
-interface DropZoneProps$1 extends GlobalProps, FileInputProps<File[]>, BasicFieldProps {
+interface DatePickerProps$1 extends GlobalProps, InputProps, FocusEventProps {
 	/**
-	 * A string representing the types of files that are accepted by the dropzone.
-	 * This string is a comma-separated list of unique file type specifiers which can be one of the following:
-	 * - A file extension starting with a period (".") character (e.g. .jpg, .pdf, .doc)
-	 * - A valid MIME type string with no extensions
+	 * Default month to display in `YYYY-MM` format.
 	 *
-	 * If left empty, the dropzone will accept all files.
+	 * This value is used until `view` is set, either directly or as a result of user interaction.
 	 *
-	 * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept
-	 */
-	accept?: string;
-	/**
-	 * A label that describes the purpose or contents of the item. When set,
-	 * it will be announced to buyers using assistive technologies and will
-	 * provide them with more context.
+	 * Defaults to the current month in the user's locale.
 	 */
-	accessibilityLabel?: string;
+	defaultView?: string;
 	/**
-	 * Defines if the user can select or drop multiple files at once.
+	 * Displayed month in `YYYY-MM` format.
 	 *
-	 * @default false
+	 * `onViewChange` is called when this value changes.
+	 *
+	 * Defaults to `defaultView`.
 	 */
-	multiple?: boolean;
+	view?: string;
 	/**
-	 * Callback when rejected files are dropped. Files are rejected based on the `accept` prop.
+	 * Called whenever the month to display changes.
+	 *
+	 * @param view The new month to display in `YYYY-MM` format.
 	 */
-	onDropRejected?(files: File[]): void;
-}
-interface EmailFieldProps$1 extends GlobalProps, BaseTextFieldProps, MinMaxLengthProps, AutocompleteProps<EmailAutocompleteField> {
-}
-export type EmailAutocompleteField = ExtractStrict<AnyAutocompleteField, "email" | `${AutocompleteAddressGroup} email`>;
-export interface ExtendableEvent extends Event {
+	onViewChange?: (view: string) => void;
 	/**
-	 * Provide a promise that signals the length, and eventual success or failure of actions relating to the event.
+	 * The type of selection the date picker allows.
 	 *
-	 * This may be called many times, which adds promises to the event.
+	 * - `single` allows selecting a single date.
+	 * - `multiple` allows selecting multiple non-contiguous dates.
+	 * - `range` allows selecting a single range of dates.
 	 *
-	 * However, this may only be called synchronously during the dispatch of the event.
-	 * As in, you cannot call it after a `setTimeout` or microtask.
+	 * @default "single"
 	 */
-	waitUntil: (promise: Promise<void>) => void;
-}
-interface FormProps$1 extends GlobalProps, ContainerProps {
+	type?: "single" | "multiple" | "range";
 	/**
-	 * Whether input elements within the form can be automatically completed by the browser.
+	 * Dates that can be selected.
+	 *
+	 * A comma-separated list of dates, date ranges. Whitespace is allowed after commas.
+	 *
+	 * The default `''` allows all dates.
+	 *
+	 * - Dates in `YYYY-MM-DD` format allow a single date.
+	 * - Dates in `YYYY-MM` format allow a whole month.
+	 * - Dates in `YYYY` format allow a whole year.
+	 * - Ranges are expressed as `start--end`.
+	 *     - Ranges are inclusive.
+	 *     - If either `start` or `end` is omitted, the range is unbounded in that direction.
+	 *     - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.
+	 *       So `2024--` is equivalent to `2024-01-01--`.
+	 *     - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.
+	 *       So `--2024` is equivalent to `--2024-12-31`.
+	 *     - Whitespace is allowed either side of `--`.
 	 *
-	 * @default 'on'
+	 * @default ""
+	 *
+	 * @example
+	 * `2024-02--2025` // allow any date from February 2024 to the end of 2025
+	 * `2024-02--` // allow any date from February 2024 to the end of the month
+	 * `2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024
 	 */
-	autocomplete?: "on" | "off";
+	allow?: string;
 	/**
-	 * Whether the form is able to be submitted.
+	 * Dates that cannot be selected. These subtract from `allow`.
 	 *
-	 * When set to `true`, this will also disable the implicit submit behavior of the form.
+	 * A comma-separated list of dates, date ranges. Whitespace is allowed after commas.
+	 *
+	 * The default `''` has no effect on `allow`.
+	 *
+	 * - Dates in `YYYY-MM-DD` format disallow a single date.
+	 * - Dates in `YYYY-MM` format disallow a whole month.
+	 * - Dates in `YYYY` format disallow a whole year.
+	 * - Ranges are expressed as `start--end`.
+	 *     - Ranges are inclusive.
+	 *     - If either `start` or `end` is omitted, the range is unbounded in that direction.
+	 *     - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.
+	 *       So `2024--` is equivalent to `2024-01-01--`.
+	 *     - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.
+	 *       So `--2024` is equivalent to `--2024-12-31`.
+	 *     - Whitespace is allowed either side of `--`.
+	 *
+	 * @default ""
+	 *
+	 * @example
+	 * `--2024-02` // disallow any date before February 2024
+	 * `2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024
+	 */
+	disallow?: string;
+	/**
+	 * Days of the week that can be selected. These intersect with the result of `allow` and `disallow`.
+	 *
+	 * A comma-separated list of days. Whitespace is allowed after commas.
+	 *
+	 * The default `''` has no effect on the result of `allow` and `disallow`.
+	 *
+	 * Days are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.
+	 *
+	 * @default ""
+	 *
+	 * @example
+	 * 'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.
+	 */
+	allowDays?: string;
+	/**
+	 * Days of the week that cannot be selected. This subtracts from `allowDays`, and intersects with the result of `allow` and `disallow`.
+	 *
+	 * A comma-separated list of days. Whitespace is allowed after commas.
+	 *
+	 * The default `''` has no effect on `allowDays`.
+	 *
+	 * Days are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.
+	 *
+	 * @default ""
+	 *
+	 * @example
+	 * 'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.
+	 */
+	disallowDays?: string;
+	/**
+	 * Default selected value.
+	 *
+	 * The default means no date is selected.
+	 *
+	 * If the provided value is invalid, no date is selected.
+	 *
+	 * - If `type="single"`, this is a date in `YYYY-MM-DD` format.
+	 * - If `type="multiple"`, this is a comma-separated list of dates in `YYYY-MM-DD` format.
+	 * - If `type="range"`, this is a range in `YYYY-MM-DD--YYYY-MM-DD` format. The range is inclusive.
+	 *
+	 * @default ""
+	 */
+	defaultValue?: string;
+	/**
+	 * Current selected value.
+	 *
+	 * The default means no date is selected.
+	 *
+	 * If the provided value is invalid, no date is selected.
+	 *
+	 * Otherwise:
+	 *
+	 * - If `type="single"`, this is a date in `YYYY-MM-DD` format.
+	 * - If `type="multiple"`, this is a comma-separated list of dates in `YYYY-MM-DD` format.
+	 * - If `type="range"`, this is a range in `YYYY-MM-DD--YYYY-MM-DD` format. The range is inclusive.
+	 *
+	 * @default ""
+	 */
+	value?: string;
+	/**
+	 * Callback when any date is selected. Will fire before `onChange`.
+	 */
+	onInput?: (event: Event) => void;
+	/**
+	 * Callback when the `value` is changed. For `type="single"` and `type="multiple"`, this is the same as `onInput`.
+	 *      For `type="range"`, this is only called when the range is completed by selecting the end date of the range.
+	 */
+	onChange?: (event: Event) => void;
+}
+interface DateFieldProps$1 extends GlobalProps, BaseTextFieldProps, Pick<DatePickerProps$1, "view" | "defaultView" | "value" | "defaultValue" | "allow" | "disallow" | "allowDays" | "disallowDays" | "onViewChange">, AutocompleteProps<DateAutocompleteField> {
+	/**
+	 * Callback when the field has an invalid date.
+	 * This callback will be called, if the date typed is invalid or disabled.
+	 *
+	 * Dates that don’t exist or have formatting errors are considered invalid. Some examples of invalid dates are:
+	 * - 2021-02-31: February doesn’t have 31 days
+	 * - 2021-02-00: The day can’t be 00
+	 *
+	 * Disallowed dates are considered invalid.
+	 *
+	 * It’s important to note that this callback will be called only when the user **finishes editing** the date,
+	 * and it’s called right after the `onChange` callback.
+	 * The field is **not** validated on every change to the input. Once the buyer has signalled that
+	 * they have finished editing the field (typically, by blurring the field), the field gets validated and the callback is run if the value is invalid.
+	 */
+	onInvalid?: (event: Event) => void;
+}
+export type DateAutocompleteField = ExtractStrict<AnyAutocompleteField, "bday" | "bday-day" | "bday-month" | "bday-year" | "cc-expiry" | "cc-expiry-month" | "cc-expiry-year">;
+interface DetailsProps$1 extends GlobalProps, ToggleEventProps {
+	/**
+	 * The content of the details.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details
+	 */
+	children?: ComponentChildren;
+	/**
+	 * Name of the element.
+	 *
+	 * This can be used to create multiple named disclosure boxes that where only one can be open at a time.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#multiple_named_disclosure_boxes
+	 */
+	name?: string;
+	/**
+	 * Whether the element is open.
+	 *
+	 * This does not reflect to any attribute.
+	 *
+	 * @default false
+	 */
+	open?: boolean;
+	/**
+	 * Indicates whether the element should be open by default.
+	 *
+	 * This reflects to the `open` attribute.
+	 *
+	 * @default false
+	 */
+	defaultOpen?: boolean;
+	/**
+	 * Sets the transition between the two states.
+	 *
+	 * @default 'auto'
+	 */
+	toggleTransition?: "none" | "auto";
+}
+interface DividerProps$1 extends GlobalProps {
+	/**
+	 * Specify the direction of the divider. This uses [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).
+	 *
+	 * @default 'inline'
+	 */
+	direction?: "inline" | "block";
+	/**
+	 * Modify the color to be more or less intense.
+	 *
+	 * @default 'base'
+	 */
+	color?: ColorKeyword;
+}
+interface DropZoneProps$1 extends GlobalProps, FileInputProps, BasicFieldProps {
+	/**
+	 * A string representing the types of files that are accepted by the drop zone.
+	 * This string is a comma-separated list of unique file type specifiers which can be one of the following:
+	 * - A file extension starting with a period (".") character (e.g. .jpg, .pdf, .doc)
+	 * - A valid MIME type string with no extensions
+	 *
+	 * If omitted, all file types are accepted.
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept
+	 * @default ''
+	 */
+	accept?: string;
+	/**
+	 * A label that describes the purpose or contents of the item. When set,
+	 * it will be announced to buyers using assistive technologies and will
+	 * provide them with more context.
+	 */
+	accessibilityLabel?: string;
+	/**
+	 * Whether multiple files can be selected or dropped at once.
 	 *
 	 * @default false
 	 */
+	multiple?: boolean;
+	/**
+	 * Callback fired when rejected files are dropped.
+	 * Files are rejected based on the `accept` prop and are not added to `files`.
+	 */
+	onDropRejected?: (event: Event) => void;
+}
+interface EmailFieldProps$1 extends GlobalProps, BaseTextFieldProps, MinMaxLengthProps, AutocompleteProps<EmailAutocompleteField> {
+}
+export type EmailAutocompleteField = ExtractStrict<AnyAutocompleteField, "email" | `${AutocompleteAddressGroup} email`>;
+interface FormProps$1 extends GlobalProps {
+	/**
+	 * The content of the form.
+	 */
+	children?: ComponentChildren;
+	/**
+	 * Whether the form is able to be submitted.
+	 *
+	 * When set to `true`, this will also disable the implicit submit behavior of the form.
+	 *
+	 * @default false
+	 *
+	 * @deprecated Prevent default within the onSubmit callback using a local state instead. Deprecated in v1.6.0
+	 * @private
+	 */
 	disabled?: boolean;
 	/**
 	 * A callback that is run when the form is submitted.
@@ -1765,11 +2311,7 @@ interface FormProps$1 extends GlobalProps, ContainerProps {
 	/**
 	 * A callback that is run when the form is reset.
 	 */
-	onReset?: () => void;
-	/**
-	 * The content of the form.
-	 */
-	children?: ComponentChildren;
+	onReset?: (event: Event) => void;
 }
 export type SpacingKeyword = SizeKeyword | "none";
 export interface GapProps {
@@ -1781,7 +2323,7 @@ export interface GapProps {
 	 *
 	 * @default 'none'
 	 */
-	gap?: MaybeTwoValuesShorthandProperty<SpacingKeyword>;
+	gap?: MaybeResponsive<MaybeTwoValuesShorthandProperty<SpacingKeyword>>;
 	/**
 	 * Adjust spacing between elements in the block axis.
 	 *
@@ -1789,7 +2331,7 @@ export interface GapProps {
 	 *
 	 * @default '' - meaning no override
 	 */
-	rowGap?: SpacingKeyword | "";
+	rowGap?: MaybeResponsive<SpacingKeyword | "">;
 	/**
 	 * Adjust spacing between elements in the inline axis.
 	 *
@@ -1797,12 +2339,18 @@ export interface GapProps {
 	 *
 	 * @default '' - meaning no override
 	 */
-	columnGap?: SpacingKeyword | "";
+	columnGap?: MaybeResponsive<SpacingKeyword | "">;
 }
 export type BaselinePosition = "baseline" | "first baseline" | "last baseline";
 export type ContentDistribution = "space-between" | "space-around" | "space-evenly" | "stretch";
 export type ContentPosition = "center" | "start" | "end";
 export type OverflowPosition = `unsafe ${ContentPosition}` | `safe ${ContentPosition}`;
+/**
+ * Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items
+ */
+export type JustifyItemsKeyword = "normal" | "stretch" | BaselinePosition | OverflowPosition | ContentPosition;
 /**
  * Align items sets the align-self value on all direct children as a group.
  *
@@ -1821,6 +2369,90 @@ export type JustifyContentKeyword = "normal" | ContentDistribution | OverflowPos
  * @see https://developer.mozilla.org/en-US/docs/Web/CSS/align-content
  */
 export type AlignContentKeyword = "normal" | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition;
+interface GridProps$1 extends GlobalProps, BaseBoxPropsWithRole, GapProps {
+	/**
+	  Define columns and specify their size.
+	  @see https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns
+	  @default 'none'
+	*/
+	gridTemplateColumns?: MaybeResponsive<string>;
+	/**
+	  Define rows and specify their size.
+	  @see https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-rows
+	  @default 'none'
+	*/
+	gridTemplateRows?: MaybeResponsive<string>;
+	/**
+	  Aligns the grid items along the inline (row) axis.
+	  This overrides the inline value of `placeItems`.
+	  @see https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items
+	  @default '' - meaning no override
+	*/
+	justifyItems?: MaybeResponsive<JustifyItemsKeyword | "">;
+	/**
+	  Aligns the grid items along the block (column) axis.
+	  This overrides the block value of `placeItems`.
+	  @see https://developer.mozilla.org/en-US/docs/Web/CSS/align-items
+	  @default '' - meaning no override
+	*/
+	alignItems?: MaybeResponsive<AlignItemsKeyword | "">;
+	/**
+	  A shorthand property for `justify-items` and `align-items`.
+	  @see https://developer.mozilla.org/en-US/docs/Web/CSS/place-items
+	  @default 'normal normal'
+	*/
+	placeItems?: MaybeResponsive<`${AlignItemsKeyword} ${JustifyItemsKeyword}` | AlignItemsKeyword>;
+	/**
+	  Aligns the grid along the inline (row) axis.
+	  This overrides the inline value of `placeContent`.
+	  @see https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content
+	  @default '' - meaning no override
+	*/
+	justifyContent?: MaybeResponsive<JustifyContentKeyword | "">;
+	/**
+	  Aligns the grid along the block (column) axis.
+	  This overrides the block value of `placeContent`.
+	  @see https://developer.mozilla.org/en-US/docs/Web/CSS/align-content
+	  @default '' - meaning no override
+	*/
+	alignContent?: MaybeResponsive<AlignContentKeyword | "">;
+	/**
+	  A shorthand property for `justify-content` and `align-content`.
+	  @see https://developer.mozilla.org/en-US/docs/Web/CSS/place-content
+	  @default 'normal normal'
+	*/
+	placeContent?: MaybeResponsive<`${AlignContentKeyword} ${JustifyContentKeyword}` | AlignContentKeyword>;
+}
+interface GridItemProps$1 extends GlobalProps, BaseBoxPropsWithRole {
+	/**
+	 * Number of columns the item will span across
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column
+	 *
+	 * @default 'auto'
+	 */
+	gridColumn?: `span ${number}` | "auto";
+	/**
+	 * Number of rows the item will span across
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row
+	 *
+	 * @default 'auto'
+	 */
+	gridRow?: `span ${number}` | "auto";
+}
 export interface BaseTypographyProps {
 	/**
 	 * Modify the color to be more or less intense.
@@ -1876,7 +2508,7 @@ export interface BlockTypographyProps {
 	 */
 	lineClamp?: number;
 }
-interface HeadingProps$1 extends GlobalProps, AccessibilityVisibilityProps, BlockTypographyProps, ContainerProps {
+interface HeadingProps$1 extends GlobalProps, AccessibilityVisibilityProps, BlockTypographyProps {
 	/**
 	 * The content of the Heading.
 	 */
@@ -1900,7 +2532,7 @@ interface HeadingProps$1 extends GlobalProps, AccessibilityVisibilityProps, Bloc
 	 */
 	accessibilityRole?: "heading" | ExtractStrict<AccessibilityRole, "presentation" | "none">;
 }
-interface IconProps$1 extends GlobalProps {
+interface IconProps$1 extends GlobalProps, Pick<InteractionProps, "interestFor"> {
 	/**
 	 * Sets the tone of the icon, based on the intention of the information being conveyed.
 	 *
@@ -1966,13 +2598,6 @@ export interface BaseImageProps {
 	 */
 	srcSet?: string;
 }
-/**
- * This is purely to give the ability
- * to have a space or not in the string literal types.
- *
- * For example in the `aspectRatio` property, `16/9` and `16 / 9` are both valid.
- */
-export type optionalSpace = "" | " ";
 interface ImageProps$1 extends GlobalProps, BaseImageProps, BorderProps {
 	/**
 	 * Sets the semantic meaning of the component’s content. When set,
@@ -2036,13 +2661,13 @@ interface ImageProps$1 extends GlobalProps, BaseImageProps, BorderProps {
 	 *
 	 * @see https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload
 	 */
-	onLoad?: () => void;
+	onLoad?: (event: Event) => void;
 	/**
 	 * Invoked on load error.
 	 *
 	 * @see https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror
 	 */
-	onError?: () => void;
+	onError?: (event: Event) => void;
 }
 interface LinkProps$1 extends GlobalProps, LinkBehaviorProps {
 	/**
@@ -2128,19 +2753,19 @@ interface MapProps$1 extends GlobalProps, SizingProps {
 	/**
 	 * Callback when the viewport bounds have changed or the map is resized.
 	 */
-	onBoundsChange?: (bounds: Bounds) => void;
+	onBoundsChange?: (event: MapBoundsChangeEvent) => void;
 	/**
 	 * Callback when the map view changes.
 	 */
-	onViewChange?: (location: Location$1, zoom: number) => void;
+	onViewChange?: (event: MapViewChangeEvent) => void;
 	/**
 	 * Callback when the user clicks on the map.
 	 */
-	onClick?: (location: Location$1) => void;
+	onClick?: (event: MapClickEvent) => void;
 	/**
 	 * Callback when the user double-clicks on the map.
 	 */
-	onDblClick?: (location: Location$1) => void;
+	onDblClick?: (event: MapDblClickEvent) => void;
 }
 interface Location$1 {
 	latitude?: number;
@@ -2150,6 +2775,19 @@ export interface Bounds {
 	northEast?: Location$1;
 	southWest?: Location$1;
 }
+export interface MapViewChangeEvent extends Event {
+	location?: Location$1;
+	zoom?: number;
+}
+export interface MapBoundsChangeEvent extends Event {
+	bounds?: Bounds;
+}
+export interface MapClickEvent extends Event {
+	location?: Location$1;
+}
+export interface MapDblClickEvent extends Event {
+	location?: Location$1;
+}
 interface MapMarkerProps$1 extends GlobalProps, InteractionProps, Pick<SizingProps, "blockSize" | "inlineSize"> {
 	/**
 	 * Marker’s location latitude in degrees.
@@ -2186,27 +2824,9 @@ interface MapMarkerProps$1 extends GlobalProps, InteractionProps, Pick<SizingPro
 	 *
 	 * It does not trigger a click event on the map itself.
 	 */
-	onClick?: () => void;
+	onClick?: (event: Event) => void;
 }
-export interface BaseOverlayProps {
-	/**
-	 * Callback fired after the overlay is shown.
-	 */
-	onShow?: () => void;
-	/**
-	 * Callback fired when the overlay is shown **after** any animations to show the overlay have finished.
-	 */
-	onAfterShow?: () => void;
-	/**
-	 * Callback fired after the overlay is hidden.
-	 */
-	onHide?: () => void;
-	/**
-	 * Callback fired when the overlay is hidden **after** any animations to hide the overlay have finished.
-	 */
-	onAfterHide?: () => void;
-}
-interface ModalProps$1 extends GlobalProps, BaseOverlayProps, ActionSlots, ContainerProps {
+interface ModalProps$1 extends GlobalProps, BaseOverlayProps, BaseOverlayMethods, ActionSlots {
 	/**
 	 * A label that describes the purpose of the modal. When set,
 	 * it will be announced to users using assistive technologies and will
@@ -2245,6 +2865,9 @@ interface ModalProps$1 extends GlobalProps, BaseOverlayProps, ActionSlots, Conta
 	 */
 	children?: ComponentChildren;
 }
+interface MoneyFieldProps$1 extends GlobalProps, BaseTextFieldProps, NumberConstraintsProps, AutocompleteProps<MoneyAutocompleteField> {
+}
+export type MoneyAutocompleteField = ExtractStrict<AnyAutocompleteField, "transaction-amount">;
 interface NumberFieldProps$1 extends GlobalProps, BaseTextFieldProps, AutocompleteProps<NumberAutocompleteField>, NumberConstraintsProps, FieldDecorationProps {
 	/**
 	 * Sets the virtual keyboard.
@@ -2263,7 +2886,7 @@ interface OptionProps$1 extends GlobalProps, BaseOptionProps {
 }
 interface OrderedListProps$1 extends GlobalProps {
 }
-interface ParagraphProps$1 extends GlobalProps, BaseTypographyProps, BlockTypographyProps, AccessibilityVisibilityProps, ContainerProps {
+interface ParagraphProps$1 extends GlobalProps, BaseTypographyProps, BlockTypographyProps, AccessibilityVisibilityProps {
 	/**
 	 * The content of the Text.
 	 */
@@ -2295,6 +2918,9 @@ export type ParagraphType =
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/small
  */
  | "small";
+interface PasswordFieldProps$1 extends GlobalProps, BaseTextFieldProps, MinMaxLengthProps, AutocompleteProps<PasswordAutocompleteField> {
+}
+export type PasswordAutocompleteField = ExtractStrict<AnyAutocompleteField, "new-password" | "current-password">;
 interface PaymentIconProps$1 extends GlobalProps {
 	/**
 	 * The icon type of the payment method
@@ -2312,16 +2938,27 @@ interface PaymentIconProps$1 extends GlobalProps {
 	accessibilityLabel?: string;
 }
 export type PaymentIconName = "abn" | "acima-leasing" | "acuotaz" | "ada" | "addi" | "adyen" | "aeropay" | "affin-bank" | "affirm" | "aftee" | "afterpay-paynl-version" | "afterpay" | "airtel-money" | "airteltigo-mobile-money" | "aktia" | "akulaku-paylater" | "akulaku" | "alandsbanken" | "alfamart" | "alfamidi" | "alipay-hk" | "alipay-paynl-version" | "alipay" | "alliance-bank" | "alma" | "aman" | "amazon" | "ambank" | "american-express" | "amex" | "ansa-stored-value" | "ansa" | "anyday" | "apecoin" | "aplazo" | "apple-pay" | "aqsat" | "arbitrum" | "arhaus" | "arvato" | "ashley-plcc" | "ask" | "astrapay" | "atm-bersama" | "atobaraidotcom" | "atome" | "atone" | "atrato" | "au-kantan-kessai" | "au-pay" | "authorize-net" | "avalanche" | "axs" | "bancnet" | "banco-azteca" | "bancomat" | "bancontact" | "bangkok-bank" | "bank-islam" | "bank-muamalat" | "bank-rakyat" | "barclays" | "base" | "bbva-cie" | "bc-card" | "bca-klikpay" | "bca" | "bdo" | "belfius" | "benefit" | "best-buy-card" | "biercheque-paynl-version" | "bigc" | "billease" | "biller-paynl-version" | "billie" | "billink-method" | "billink" | "bitcoin-cash" | "bitcoin" | "bizum" | "blik" | "bnbchain" | "bni" | "bnp" | "bogus-app-coin" | "bogus" | "boleto" | "boodil" | "boost" | "bpi" | "braintree" | "bread-pay" | "bread" | "bri-direct-debit" | "bri" | "brimo" | "bsi" | "bsn" | "bss" | "busd" | "careem-pay" | "cartes-bancaires" | "cash-app-pay" | "cash" | "cashew" | "cashinvoice-latin-america" | "catch-payments" | "cebuana" | "cembrapay" | "centi" | "cetelem" | "checkout-finance" | "chinabank" | "cimb-clicks" | "cimb" | "circle-k" | "citadele" | "citi-pay" | "clave-telered" | "clearpay" | "clerq" | "cleverpay" | "clip" | "cliq" | "codensa" | "coinsph" | "collector-bank" | "coop" | "coppel-pay" | "credit-agricole" | "credit-key" | "creditclick-paynl-version" | "credix" | "cuotas" | "d-barai" | "dai" | "daily-yamazaki" | "dan-dan" | "dana" | "danamon-online" | "dankort" | "danske-bank" | "dappmx" | "dash" | "daviplata" | "de-cadeaukaart" | "depay" | "deutsche-bank" | "dinacard" | "diners-club" | "direct-bank-transfer-latin-america" | "directa24" | "directpay" | "discover" | "divido" | "dnb" | "docomo-barai" | "dogecoin" | "dropp" | "duitnow" | "duologi" | "dwolla" | "easywallet" | "ebucks" | "echelon-financing" | "ecpay" | "edenred" | "efecty" | "eft-secure" | "eftpos-au" | "eghl" | "elo" | "elv" | "empty" | "enets" | "eos" | "epayments" | "epospay" | "eps" | "erste" | "escrowcom" | "esr-paymentslip-switzerland" | "ethereum" | "etihad-guest-pay" | "etika" | "ewallet-indonesia" | "ewallet-philippines" | "ewallet-southkorea" | "facebook-pay" | "fairstone-payments" | "fam" | "familymart" | "fantom" | "farmlands" | "fashion-giftcard-paynlversion" | "fashioncheque" | "favepay" | "fawry" | "finloup" | "fintecture" | "fintoc" | "flexiti" | "float-payments" | "flying-blue-plus" | "forbrugsforeningen" | "forsa" | "fortiva" | "fps" | "fpx" | "freecharge" | "freedompay" | "futurepay-mytab" | "gcash" | "generalfinancing" | "generic" | "genoapay" | "gezondheidsbon-paynl-version" | "giftcard" | "giropay" | "givacard" | "glbe-paypal" | "glbe-plus" | "gmo-atokara" | "gmo-bank-transfer" | "gmo-postpay" | "gmo-virtualaccount" | "gnosis" | "google-pay" | "google-wallet" | "gopay" | "grabpay" | "grailpay" | "gusd" | "hana-card" | "handelsbanken" | "happy-pay" | "hello-clever" | "heylight" | "hitrustpay-transfer" | "home-credit" | "hong-leong-bank" | "hong-leong-connect" | "hsbc" | "huis-tuin-cadeau" | "humm" | "hyper" | "hypercard" | "hypercash" | "hyundai-card" | "ibexpay" | "ideal" | "in3-via-ideal" | "in3" | "inbank" | "indomaret" | "ing-homepay" | "interac" | "ivy" | "iwocapay-pay-later" | "jcb" | "jenius" | "jko" | "jousto" | "kakao-pay" | "kakebaraidotcom" | "kasikornbank" | "kasssh" | "katapult" | "kb-card" | "kbc-cbc" | "kcp-credit-card" | "kfast" | "khqr" | "klarna-pay-later" | "klarna-pay-now" | "klarna-slice-it" | "klarna" | "knaken-settle" | "knet" | "koalafi" | "koin" | "krediidipank" | "kredivo" | "krungsri" | "krungthai-bank" | "kueski-pay" | "kunst-en-cultuur-cadeaukaart" | "kuwait-finance-house" | "land-bank" | "laser" | "latitude-creditline-au" | "latitude-gem-au" | "latitude-gem-nz" | "latitude-go-au" | "latitudepay" | "lawson" | "laybuy-heart" | "laybuy" | "lbc" | "lhv" | "line-pay" | "linkaja" | "linkpay" | "litecoin" | "lku" | "lloyds" | "lotte-card" | "lpb" | "luminor" | "lunch-check" | "lydia" | "mach" | "mada" | "maestro" | "mandiri" | "mash" | "master" | "mastercard" | "masterpass" | "maxima" | "maya-bank" | "maya" | "maybank-qrpay" | "maybank" | "maybankm2u" | "mb-way" | "mb" | "mcash" | "medicinos-bankas" | "meeza" | "mercado-credito" | "mercado-pago" | "merpay" | "meta-pay" | "metro-bank" | "military-starcard" | "minicuotas" | "ministop" | "mobicred" | "mobikwik" | "mobilepay" | "mode" | "mokka" | "momopay" | "mondido" | "monero" | "monzo" | "mpesa" | "mtn-mobile-money" | "multisafepay" | "mybank" | "myfatoorah" | "n26" | "naps" | "nationale-bioscoopbon" | "nationale-entertainmentcard" | "natwest" | "naver-pay" | "nelo" | "nequi" | "netbanking" | "neteller" | "nh-card" | "nordea" | "notyd" | "novuna" | "npatobarai" | "npkakebarai" | "oca" | "ocbc-bank" | "octo-clicks" | "octopus" | "offline-bank-transfer-latin-america" | "ola-money" | "omannet" | "omasp" | "oney" | "online-banking" | "online-banktransfer" | "op" | "opay" | "openpay" | "optimism" | "orange-mobile-money" | "overstock-citicobrand" | "overstock-citiplcc" | "ovo" | "oxxo" | "ozow" | "pagoefectivo" | "paid" | "paidy" | "palawa" | "palawan" | "pastpay" | "pay-after-delivery-instalments" | "pay-by-bank-us" | "pay-by-bank" | "pay-easy" | "pay-pay" | "paybylink" | "paycash" | "payco" | "payconiq" | "payd" | "payfast-instant-eft" | "payflex" | "payid" | "payitmonthly" | "payjustnow" | "paymark-online-eftpos" | "paymaya" | "payme" | "paynow-mbank" | "paynow" | "payoo-qr" | "payoo" | "paypal" | "payplan" | "paypo" | "payrexx-bank-transfer" | "payright" | "paysafecard-paynl-version" | "paysafecard" | "paysafecash" | "paysera" | "paysquad" | "paytm" | "payto" | "paytomorrow" | "payu" | "payzapp" | "pei" | "perlasfinance" | "permata" | "pf-pay" | "pivo" | "pix" | "podium-cadeaukaart" | "pointspay" | "poli" | "polygon" | "poppankki" | "postfinance-card" | "postfinance-efinance" | "postpay" | "powered-by-ansa-stored-value" | "powered-by-ansa" | "powerpay" | "pps" | "prepaysolutions" | "progressive-leasing" | "przelew24" | "przelewy24-paynl-version" | "przelewy24" | "pse" | "public-bank" | "publicbank-pbe" | "qasitli" | "qliro" | "qr-promptpay" | "qris" | "qrph" | "rabbit-line-pay" | "rabobank" | "rakuten-pay" | "rapid-transfer" | "ratepay" | "raty-pekao" | "rcbc" | "rcs" | "reka" | "resolve-pay" | "revolut" | "rhb-bank" | "rhb-now" | "rietumu" | "riverty-paynl-version" | "riverty" | "rupay" | "saastopankki" | "sadad" | "sam" | "samsung-card" | "samsung-pay" | "santander" | "satisfi" | "satispay" | "sbpl" | "scalapay" | "scream-truck-wallet" | "scream-truck" | "seb" | "seicomart" | "sepa-bank-transfer" | "sepa-direct-debit" | "sequra" | "seven-eleven" | "sezzle" | "shib" | "shinhan-card" | "shop-pay" | "shopeepay" | "shopify-pay" | "siam-commercial" | "siauliu-bankas" | "siirto" | "sika-fsa" | "sika-hsa" | "sika" | "simpl" | "simple-pay" | "sinpe-movil" | "sistecredito" | "skeps" | "skrill-digital-wallet" | "slice-fnbo" | "smartpay" | "snap-checkout" | "snapmint" | "societe-generale" | "sofort" | "softbank" | "solana-pay-helio" | "solana-pay" | "solana" | "souhoola" | "spankki" | "sparkasse" | "spei" | "splitit" | "spotii" | "spraypay" | "standard-chartered" | "stc-pay" | "stoov" | "store-credit" | "stripe" | "sunkus" | "super-payments" | "svea-b2b-faktura" | "svea-b2b-invoice" | "svea-checkout" | "svea-credit-account" | "svea-delbetalning" | "svea-faktura" | "svea-invoice" | "svea-lasku" | "svea-ostukonto" | "svea-part-payment" | "svea-yrityslasku" | "sveaeramaksu" | "swedbank" | "swiftpay" | "swish" | "swissbilling" | "sympl" | "synchrony-pay" | "synchrony" | "tabby" | "tabit" | "taly" | "tamara" | "tandympayment" | "tasa-cero" | "tbi-bank" | "tcf" | "tendopay" | "tensile" | "tesco-lotus" | "thanachart-bank" | "timepayment" | "tiptop" | "todopay" | "toss" | "touch-n-go" | "tpay" | "trevipay" | "truelayer" | "truemoney-pay" | "trustly" | "twig-pay" | "twint" | "twoinvoice" | "uae-visa" | "uangme" | "ubp" | "underpay" | "unionpay" | "unipay" | "uob-ez-pay" | "uob-thai" | "uob" | "upi" | "urbo" | "urpay" | "usdc" | "usdp" | "v-pay" | "valu" | "venmo" | "ventipay" | "venus-plcc" | "viabill" | "vipps" | "visa-electron" | "visa" | "volksbank" | "volt" | "vvv-cadeaukaart-paynl-version" | "vvv-giftcard" | "waave-pay-by-bank" | "wallet" | "walley" | "wbtc" | "webshop-giftcard" | "wechat-pay" | "wechat-paynl-version" | "wegetfinancing" | "whish-checkout" | "whish-pay" | "wise" | "wissel" | "world-chain" | "xrp" | "yape" | "yappy" | "ymobile" | "younited-pay" | "zalopay" | "zapper" | "zingala" | "zinia" | "zip" | "zoodpay" | "zulily-credit-card" | "zustaina";
-export type PhoneAutocompleteField = ExtractStrict<AnyAutocompleteField, "tel" | "tel-area-code" | "tel-country-code" | "tel-extension" | "tel-local-prefix" | "tel-local-suffix" | "tel-local" | "tel-national" | `${AutocompleteAddressGroup} tel` | `${AutocompleteAddressGroup} tel-area-code` | `${AutocompleteAddressGroup} tel-country-code` | `${AutocompleteAddressGroup} tel-extension` | `${AutocompleteAddressGroup} tel-local-prefix` | `${AutocompleteAddressGroup} tel-local-suffix` | `${AutocompleteAddressGroup} tel-local` | `${AutocompleteAddressGroup} tel-national`>;
-interface PhoneFieldProps$1 extends GlobalProps, BaseTextFieldProps, Pick<FieldDecorationProps, "accessory">, AutocompleteProps<PhoneAutocompleteField> {
+interface PopoverProps$1 extends GlobalProps, BaseOverlayProps, BaseOverlayMethods, ToggleEventProps, SizingProps {
 	/**
-	 * The type of number to collect.
+	 * The content of the popover.
+	 */
+	children?: ComponentChildren;
+}
+interface PressButtonProps$1 extends GlobalProps, Pick<ButtonProps$1, "accessibilityLabel" | "children" | "icon" | "inlineSize" | "lang" | "tone" | "variant" | "disabled" | "loading" | "onClick" | "onBlur" | "onFocus"> {
+	/**
+	 * Whether the button is pressed.
 	 *
-	 * Specific style may be applied to each type to provide extra guidance to users. Note that no extra validation is performed based on the type.
+	 * @default false
+	 */
+	pressed?: boolean;
+	/**
+	 * Whether the button is pressed by default.
 	 *
-	 * @default '' meaning no specific kind of phone number
+	 * @default false
+	 *
+	 * @implementation `defaultPressed` reflects to the `pressed` attribute.
 	 */
-	type?: "mobile" | "";
+	defaultPressed?: boolean;
 }
 interface ProductThumbnailProps$1 extends GlobalProps, BaseImageProps {
 	/**
@@ -2339,13 +2976,13 @@ interface ProductThumbnailProps$1 extends GlobalProps, BaseImageProps {
 	 *
 	 * @see https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload
 	 */
-	onLoad?: () => void;
+	onLoad?: (event: Event) => void;
 	/**
 	 * Invoked on load error of provided image.
 	 *
 	 * @see https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror
 	 */
-	onError?: () => void;
+	onError?: (event: Event) => void;
 }
 interface ProgressProps$1 extends GlobalProps {
 	/**
@@ -2424,7 +3061,7 @@ interface QRCodeProps$1 extends GlobalProps {
 	 * Invoked when the conversion of `content` to a QR code fails.
 	 * If an error occurs, the QR code and its child elements will not be displayed.
 	 */
-	onError?: () => void;
+	onError?: (event: Event) => void;
 	/**
 	 * URL of an image to be displayed in the center of the QR code.
 	 * This is useful for branding or to indicate to the user what scanning the QR code will do.
@@ -2432,7 +3069,45 @@ interface QRCodeProps$1 extends GlobalProps {
 	 */
 	logo?: string;
 }
-interface SectionProps$1 extends GlobalProps, ContainerProps {
+interface QueryContainerProps$1 extends GlobalProps {
+	/**
+	 * The content of the container.
+	 */
+	children?: ComponentChildren;
+	/**
+	 * The name of the container, which can be used in your container queries to target this container specifically.
+	 *
+	 * We place the container name of `s-default` on every container. Because of this, it is not required to add a `containerName` identifier in your queries. For example, a `@container (inline-size <= 300px) none, auto` query is equivalent to `@container s-default (inline-size <= 300px) none, auto`.
+	 *
+	 * Any value set in `containerName` will be set alongside alongside `s-default`. For example, `containerName="my-container-name"` will result in a value of `s-default my-container-name` set on the `container-name` CSS property of the rendered HTML.
+	 *
+	 * @default ''
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/container-name
+	 *
+	 * @implementation You must always have a CSS `container-name` of `s-default` for this component.
+	 */
+	containerName?: string;
+}
+export type OverflowKeyword = "auto" | "hidden";
+interface ScrollBoxProps$1 extends GlobalProps, Omit<BaseBoxPropsWithRole, "overflow"> {
+	/**
+	 * Sets the overflow behavior of the element.
+	 *
+	 * - `hidden`: clips the content when it is larger than the element’s container and the element will not be scrollable in that axis.
+	 * - `auto`: clips the content when it is larger than the element’s container and make it scrollable in that axis.
+	 *
+	 * 1-to-2-value syntax is supported but note that, contrary to the CSS, it uses flow-relative values and the order is:
+	 *
+	 * - 2 values: `block inline`
+	 *
+	 * @default 'auto'
+	 *
+	 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/overflow
+	 */
+	overflow?: OverflowKeyword | `${OverflowKeyword} ${OverflowKeyword}`;
+}
+interface SectionProps$1 extends GlobalProps, ActionSlots {
 	/**
 	 * The content of the Section.
 	 */
@@ -2470,6 +3145,66 @@ interface SelectProps$1 extends GlobalProps, AutocompleteProps<AnyAutocompleteFi
 	 */
 	children?: ComponentChildren;
 }
+interface SheetProps$1 extends BaseOverlayProps, BaseOverlayMethods, ToggleEventProps, GlobalProps, ActionSlots {
+	/**
+	 * A label that describes the purpose of the sheet. When set,
+	 * it will be announced to users using assistive technologies and will
+	 * provide them with more context.
+	 *
+	 * This overrides the `heading` prop for screen readers.
+	 */
+	accessibilityLabel?: string;
+	/**
+	 * The content of the Sheet.
+	 */
+	children?: ComponentChildren;
+	/**
+	 * Indicates whether the Sheet should be open by default.
+	 * This property is necessary in some cases, but its usage is generally discouraged due to potential negative impacts on user experience.
+	 *
+	 * Developers should:
+	 * - Only set this property to true when there are vitally important behaviors of the application that depend on the user interacting with the sheet.
+	 * - Make every effort to conditionally hide the sheet based on the state of checkout. An explicit example is custom privacy consent, where the sheet should only be displayed when consent is necessary and has not yet been explicitly given by the user.
+	 *
+	 * This property is useful for when the Sheet needs to be rendered on the page load and not triggered by a user action.
+	 * The property should only take effect when the `Sheet` is rendered for the first time.
+	 * To toggle the Sheet after it has been rendered, use the `ui.showOverlay()` method instead.
+	 *
+	 * @default false
+	 */
+	defaultOpen?: boolean;
+	/**
+	 * A title that describes the content of the sheet.
+	 */
+	heading?: string;
+	/**
+	 * Adjust the padding of all edges.
+	 *
+	 * `base`: applies padding that is appropriate for the element. Note that it may result in no padding if Shopify
+	 * believes this is the right design decision in a particular context.
+	 *
+	 * `none`: removes all padding from the element. This can be useful when elements inside the Sheet need to span
+	 * to the edge of the Sheet. For example, a full-width image. In this case, rely on `Box` with a padding of 'base'
+	 * to bring back the desired padding for the rest of the content.
+	 *
+	 * @default 'base'
+	 */
+	padding?: "base" | "none";
+}
+interface SkeletonParagraphProps$1 extends GlobalProps {
+	/**
+	 * The content to be used as a base for the skeleton. This content will be hidden when the skeleton is visible.
+	 *
+	 * This can be useful when the skeleton is representing a known piece of content which is part of a larger
+	 * element that has not yet fully loaded.
+	 *
+	 * @implementation When `content` is specified, the visual skeleton should be the size of the content. The element should
+	 * still be a block layout.
+	 *
+	 * @default ''
+	 */
+	content?: string;
+}
 interface SpinnerProps$1 extends GlobalProps {
 	/**
 	 * Adjusts the size of the spinner icon.
@@ -2486,40 +3221,40 @@ interface SpinnerProps$1 extends GlobalProps {
 	 */
 	accessibilityLabel?: string;
 }
-interface StackProps$1 extends BaseBoxPropsWithRole, GapProps {
+interface StackProps$1 extends GlobalProps, BaseBoxPropsWithRole, GapProps {
 	/**
 	 * The content of the Stack.
 	 */
 	children?: ComponentChildren;
 	/**
-	 * Sets how the children are placed within the Stack.
+	 * Sets how the children are placed within the Stack. This uses [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).
 	 *
 	 * @default 'block'
 	 *
 	 * @implementation the content will wrap if the direction is 'inline', and not wrap if the direction is 'block'
 	 */
-	direction?: "block" | "inline";
+	direction?: MaybeResponsive<"block" | "inline">;
 	/**
 	 * Aligns the Stack along the main axis.
 	 *
 	 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content
 	 * @default 'normal'
 	 */
-	justifyContent?: JustifyContentKeyword;
+	justifyContent?: MaybeResponsive<JustifyContentKeyword>;
 	/**
 	 * Aligns the Stack's children along the cross axis.
 	 *
 	 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/align-items
 	 * @default 'normal'
 	 */
-	alignItems?: AlignItemsKeyword;
+	alignItems?: MaybeResponsive<AlignItemsKeyword>;
 	/**
 	 * Aligns the Stack along the cross axis.
 	 *
 	 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/align-content
 	 * @default 'normal'
 	 */
-	alignContent?: AlignContentKeyword;
+	alignContent?: MaybeResponsive<AlignContentKeyword>;
 }
 interface SummaryProps$1 extends GlobalProps {
 	/**
@@ -2537,7 +3272,9 @@ interface SummaryProps$1 extends GlobalProps {
 	 */
 	children?: ComponentChildren;
 }
-interface TextProps$1 extends GlobalProps, AccessibilityVisibilityProps, BaseTypographyProps, DisplayProps {
+interface SwitchProps$1 extends GlobalProps, BaseCheckableProps, BasicFieldProps, FieldDetailsProps, FieldErrorProps {
+}
+interface TextProps$1 extends GlobalProps, AccessibilityVisibilityProps, BaseTypographyProps, DisplayProps, Pick<InteractionProps, "interestFor"> {
 	/**
 	 * The content of the Text.
 	 */
@@ -2545,7 +3282,7 @@ interface TextProps$1 extends GlobalProps, AccessibilityVisibilityProps, BaseTyp
 	/**
 	 * Provide semantic meaning and default styling to the text.
 	 *
-	 * Other presentation properties on `<s-text>` override the default styling.
+	 * Other presentation properties on Text override the default styling.
 	 *
 	 * @default 'generic'
 	 */
@@ -2643,7 +3380,7 @@ interface TextAreaProps$1 extends GlobalProps, BaseTextFieldProps, MinMaxLengthP
 }
 interface TextFieldProps$1 extends GlobalProps, BaseTextFieldProps, MinMaxLengthProps, AutocompleteProps<TextAutocompleteField>, FieldDecorationProps {
 }
-interface TimeProps$1 {
+interface TimeProps$1 extends GlobalProps {
 	/**
 	 * The content of the Time.
 	 */
@@ -2659,13 +3396,25 @@ interface TimeProps$1 {
 	 */
 	dateTime?: string;
 }
+interface TooltipProps$1 extends GlobalProps {
+	/**
+	 * The content of the Tooltip.
+	 */
+	children?: ComponentChildren;
+}
 interface UnorderedListProps$1 extends GlobalProps {
 }
+export interface URLFieldProps extends GlobalProps, BaseTextFieldProps, MinMaxLengthProps, AutocompleteProps<URLAutocompleteField> {
+}
+export type URLAutocompleteField = ExtractStrict<AnyAutocompleteField, "url" | "photo" | "impp" | `${AutocompleteAddressGroup} impp`>;
-import { ReactNode } from 'react';
+type ReducedAlignContentKeyword = Extract<AlignContentKeyword, 'normal' | 'space-between' | 'space-around' | 'space-evenly' | 'stretch' | 'center' | 'start' | 'end'>;
+type ReducedAlignItemsKeyword = Extract<AlignItemsKeyword, 'normal' | 'stretch' | 'baseline' | 'center' | 'start' | 'end'>;
+type ReducedJustifyContentKeyword = Extract<JustifyContentKeyword, 'normal' | 'space-between' | 'space-around' | 'space-evenly' | 'stretch' | 'center' | 'start' | 'end'>;
+type ReducedJustifyItemsKeyword = Extract<JustifyItemsKeyword, 'normal' | 'stretch' | 'baseline' | 'center' | 'start' | 'end'>;
 type ReducedBorderSizeKeyword = Extract<BorderSizeKeyword, 'none' | 'base' | 'large' | 'large-100' | 'large-200'>;
 type ReducedColorKeyword = Extract<ColorKeyword, 'base'>;
 type BorderShorthand = ReducedBorderSizeKeyword | `${ReducedBorderSizeKeyword} ${ReducedColorKeyword}` | `${ReducedBorderSizeKeyword} ${ReducedColorKeyword} ${BorderStyleKeyword}`;
@@ -2684,54 +3433,105 @@ interface BaseElementPropsWithChildren<TClass = HTMLElement> extends BaseElement
     children?: preact.ComponentChildren;
 }
 /**
- * The list of available icon types.
+ * Used as the single source of truth for checkout icon types.
  *
  * @see https://github.com/Shopify/ui-api-design/blob/main/packages/ui-api-design/src/components/Icon/Icon.ts#L10
  */
-type ReducedIconTypes = Extract<IconType, 'alert-circle' | 'alert-triangle-filled' | 'alert-triangle' | 'arrow-down' | 'arrow-left' | 'arrow-right' | 'arrow-up-right' | 'arrow-up' | 'bag' | 'bullet' | 'calendar' | 'camera' | 'caret-down' | 'cart' | 'cash-dollar' | 'categories' | 'check-circle' | 'check' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'chevron-up' | 'circle' | 'clipboard' | 'clock' | 'credit-card' | 'delete' | 'delivered' | 'delivery' | 'disabled' | 'discount' | 'edit' | 'email' | 'empty' | 'external' | 'filter' | 'geolocation' | 'gift-card' | 'globe' | 'grid' | 'image' | 'info-filled' | 'info' | 'list-bulleted' | 'location' | 'lock' | 'map' | 'menu-horizontal' | 'menu-vertical' | 'menu' | 'minus' | 'mobile' | 'note' | 'order' | 'organization' | 'plus' | 'profile' | 'question-circle-filled' | 'question-circle' | 'reorder' | 'reset' | 'return' | 'savings' | 'search' | 'settings' | 'star-filled' | 'star-half' | 'star' | 'store' | 'truck' | 'upload' | 'x-circle-filled' | 'x-circle' | 'x'>;
+declare const CHECKOUT_AVAILABLE_ICONS: readonly ["alert-circle", "alert-triangle-filled", "alert-triangle", "arrow-down", "arrow-left", "arrow-right", "arrow-up-right", "arrow-up", "bag", "bullet", "calendar", "camera", "caret-down", "cart", "cash-dollar", "categories", "check-circle", "check", "chevron-down", "chevron-left", "chevron-right", "chevron-up", "circle", "clipboard", "clock", "credit-card", "delete", "delivered", "delivery", "disabled", "discount", "edit", "email", "empty", "external", "filter", "geolocation", "gift-card", "globe", "grid", "image", "info-filled", "info", "list-bulleted", "location", "lock", "map", "menu-horizontal", "menu-vertical", "menu", "minus", "mobile", "note", "order", "organization", "plus", "profile", "question-circle-filled", "question-circle", "reorder", "reset", "return", "savings", "search", "settings", "star-filled", "star-half", "star", "store", "truck", "upload", "x-circle-filled", "x-circle", "x"];
+type ReducedIconTypes = (typeof CHECKOUT_AVAILABLE_ICONS)[number];
-declare const tagName$B = "s-abbreviation";
-interface AbbreviationProps extends Pick<AbbreviationProps$1, 'title'> {
+declare const tagName$Z = "s-abbreviation";
+interface AbbreviationProps extends Pick<AbbreviationProps$1, 'title' | 'id'> {
 }
 interface AbbreviationElement extends AbbreviationProps, Omit<HTMLElement, 'id' | 'title'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$Z]: AbbreviationElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$Z]: AbbreviationProps & BaseElementPropsWithChildren<AbbreviationElement>;
+        }
+    }
+}
+declare const tagName$Y = "s-announcement";
+interface AnnouncementEvents extends Pick<AnnouncementProps$1, 'onAfterToggle' | 'onDismiss' | 'onToggle'> {
+}
+interface AnnouncementElement extends AnnouncementMethods, Omit<HTMLElement, 'id' | 'ontoggle'> {
+    onaftertoggle?: AnnouncementEvents['onAfterToggle'];
+    ondismiss?: AnnouncementEvents['onDismiss'];
+    ontoggle?: AnnouncementEvents['onToggle'];
+}
+interface AnnouncementProps extends AnnouncementEvents {
+}
+interface AnnouncementMethods {
+    dismiss: () => void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$Y]: AnnouncementElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$Y]: AnnouncementProps & BaseElementPropsWithChildren<AnnouncementElement>;
+        }
+    }
+}
+declare const tagName$X = "s-badge";
+interface BadgeProps extends Pick<BadgeProps$1, 'color' | 'icon' | 'iconPosition' | 'id' | 'size' | 'tone'> {
+    size?: Extract<BadgeProps$1['size'], 'small' | 'small-100' | 'base'>;
+    tone?: Extract<BadgeProps$1['tone'], 'auto' | 'neutral' | 'critical'>;
+    color?: Extract<BadgeProps$1['color'], 'base' | 'subdued'>;
+    icon?: '' | ReducedIconTypes;
+}
+interface BadgeElement extends BadgeProps, Omit<HTMLElement, 'id'> {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$X]: BadgeElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$B]: AbbreviationProps & BaseElementPropsWithChildren<AbbreviationElement>;
+            [tagName$X]: BadgeProps & BaseElementPropsWithChildren<BadgeElement>;
         }
     }
 }
-declare const tagName$A = "s-banner";
-interface BannerBaseProps extends Pick<BannerProps$1, 'collapsible' | 'dismissible' | 'heading' | 'hidden' | 'id' | 'tone'> {
+declare const tagName$W = "s-banner";
+interface BannerElementProps extends Pick<BannerProps$1, 'collapsible' | 'dismissible' | 'heading' | 'hidden' | 'id' | 'tone'> {
     tone?: Extract<BannerProps$1['tone'], 'auto' | 'info' | 'success' | 'warning' | 'critical'>;
 }
 interface BannerEvents extends Pick<BannerProps$1, 'onAfterHide' | 'onDismiss'> {
 }
-interface BannerElement extends BannerBaseProps, Omit<BannerEvents, 'onAfterHide' | 'onDismiss'>, Omit<HTMLElement, 'id' | 'title' | 'hidden'> {
+interface BannerElement extends BannerElementProps, Omit<HTMLElement, 'id' | 'title' | 'hidden'> {
     onafterhide: BannerEvents['onAfterHide'];
     ondismiss: BannerEvents['onDismiss'];
 }
-interface BannerProps extends BannerBaseProps, BannerEvents {
+interface BannerProps extends BannerElementProps, BannerEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$W]: BannerElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$A]: BannerProps & BaseElementPropsWithChildren<BannerElement>;
+            [tagName$W]: BannerProps & BaseElementPropsWithChildren<BannerElement>;
         }
     }
 }
-declare const tagName$z = "s-box";
+declare const tagName$V = "s-box";
 interface BoxProps extends Pick<BoxProps$1, 'accessibilityLabel' | 'accessibilityRole' | 'accessibilityVisibility' | 'background' | 'blockSize' | 'border' | 'borderRadius' | 'borderStyle' | 'borderWidth' | 'display' | 'id' | 'inlineSize' | 'maxBlockSize' | 'maxInlineSize' | 'minBlockSize' | 'minInlineSize' | 'overflow' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart'> {
     background?: Extract<BoxProps$1['background'], 'transparent' | 'subdued' | 'base'>;
     border?: BorderShorthand;
@@ -2742,18 +3542,19 @@ interface BoxElement extends BoxProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$V]: BoxElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$z]: BoxProps & BaseElementPropsWithChildren<BoxElement>;
+            [tagName$V]: BoxProps & BaseElementPropsWithChildren<BoxElement>;
         }
     }
 }
-declare const tagName$y = "s-button";
-interface ButtonBaseProps extends Pick<ButtonProps$1, 'accessibilityLabel' | 'command' | 'commandFor' | 'disabled' | 'href' | 'id' | 'inlineSize' | 'loading' | 'target' | 'tone' | 'type' | 'variant'> {
+declare const tagName$U = "s-button";
+interface ButtonElementProps extends Pick<ButtonProps$1, 'accessibilityLabel' | 'command' | 'commandFor' | 'disabled' | 'href' | 'id' | 'inlineSize' | 'interestFor' | 'loading' | 'target' | 'tone' | 'type' | 'variant'> {
     target?: Extract<ButtonProps$1['target'], 'auto' | '_blank'>;
     tone?: Extract<ButtonProps$1['tone'], 'auto' | 'neutral' | 'critical'>;
     type?: Extract<ButtonProps$1['type'], 'submit' | 'button'>;
@@ -2761,48 +3562,111 @@ interface ButtonBaseProps extends Pick<ButtonProps$1, 'accessibilityLabel' | 'co
 }
 interface ButtonEvents extends Pick<ButtonProps$1, 'onClick'> {
 }
-interface ButtonElement extends ButtonBaseProps, Omit<ButtonEvents, 'onClick'>, Omit<HTMLElement, 'id' | 'onclick'> {
+interface ButtonElement extends ButtonElementProps, Omit<HTMLElement, 'id' | 'onclick'> {
     onclick: ButtonEvents['onClick'];
 }
-interface ButtonProps extends ButtonBaseProps, ButtonEvents {
+interface ButtonProps extends ButtonElementProps, ButtonEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$U]: ButtonElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$y]: ButtonProps & BaseElementPropsWithChildren<ButtonElement>;
+            [tagName$U]: ButtonProps & BaseElementPropsWithChildren<ButtonElement>;
         }
     }
 }
-declare const tagName$x = "s-checkbox";
-interface CheckboxBaseProps extends Pick<CheckboxProps$1, 'accessibilityLabel' | 'checked' | 'command' | 'commandFor' | 'defaultChecked' | 'disabled' | 'error' | 'id' | 'label' | 'name' | 'required' | 'value'> {
+declare const tagName$T = "s-checkbox";
+interface CheckboxElementProps extends Pick<CheckboxProps$1, 'accessibilityLabel' | 'checked' | 'command' | 'commandFor' | 'defaultChecked' | 'disabled' | 'error' | 'id' | 'label' | 'name' | 'required' | 'value'> {
+    command?: Extract<CheckboxProps$1['command'], '--auto' | '--show' | '--hide' | '--toggle'>;
 }
 interface CheckboxEvents extends Pick<CheckboxProps$1, 'onChange'> {
 }
-interface CheckboxElement extends CheckboxBaseProps, Omit<CheckboxEvents, 'onChange'>, Omit<HTMLElement, 'id' | 'onchange'> {
+interface CheckboxElement extends CheckboxElementProps, Omit<HTMLElement, 'id' | 'onchange'> {
     onchange: CheckboxEvents['onChange'];
 }
-interface CheckboxProps extends CheckboxBaseProps, CheckboxEvents {
+interface CheckboxProps extends CheckboxElementProps, CheckboxEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$T]: CheckboxElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$T]: CheckboxProps & BaseElementProps<CheckboxElement>;
+        }
+    }
+}
+declare const tagName$S = "s-chip";
+interface ChipElementProps extends Pick<ChipProps$1, 'accessibilityLabel' | 'id'> {
+}
+interface ChipProps extends ChipElementProps {
+}
+interface ChipElement extends ChipProps, Omit<HTMLElement, 'id'> {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$S]: ChipElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$S]: ChipProps & BaseElementPropsWithChildren<ChipElement>;
+        }
+    }
+}
+declare const tagName$R = "s-choice";
+interface ChoiceProps extends Pick<ChoiceProps$1, 'accessibilityLabel' | 'defaultSelected' | 'disabled' | 'id' | 'selected' | 'error' | 'value'> {
+}
+interface ChoiceElement extends ChoiceProps, Omit<HTMLElement, 'id'> {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$R]: ChoiceElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$R]: ChoiceProps & BaseElementPropsWithChildren<ChoiceElement>;
+        }
+    }
+}
+declare const tagName$Q = "s-choice-list";
+interface ChoiceListElementProps extends Pick<ChoiceListProps$1, 'disabled' | 'error' | 'id' | 'label' | 'labelAccessibilityVisibility' | 'multiple' | 'name' | 'values' | 'variant'> {
+}
+interface ChoiceListEvents extends Pick<ChoiceListProps$1, 'onChange'> {
+}
+interface ChoiceListElement extends ChoiceListElementProps, Omit<HTMLElement, 'id' | 'onchange'> {
+    onchange: ChoiceListEvents['onChange'];
+}
+interface ChoiceListProps extends ChoiceListElementProps, ChoiceListEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$x]: CheckboxElement;
+        [tagName$Q]: ChoiceListElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$x]: CheckboxProps & BaseElementProps<CheckboxElement>;
+            [tagName$Q]: ChoiceListProps & BaseElementPropsWithChildren<ChoiceListElement>;
         }
     }
 }
-declare const tagName$w = "s-clickable";
-interface ClickableProps extends Pick<ClickableProps$1, 'accessibilityLabel' | 'accessibilityVisibility' | 'background' | 'blockSize' | 'border' | 'borderRadius' | 'borderStyle' | 'borderWidth' | 'command' | 'commandFor' | 'disabled' | 'display' | 'href' | 'id' | 'inlineSize' | 'lang' | 'loading' | 'maxBlockSize' | 'maxInlineSize' | 'minBlockSize' | 'minInlineSize' | 'onBlur' | 'onClick' | 'onFocus' | 'overflow' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart' | 'target' | 'type'> {
+declare const tagName$P = "s-clickable";
+interface ClickableElementProps extends Pick<ClickableProps$1, 'accessibilityLabel' | 'accessibilityVisibility' | 'background' | 'blockSize' | 'border' | 'borderRadius' | 'borderStyle' | 'borderWidth' | 'command' | 'commandFor' | 'disabled' | 'display' | 'href' | 'id' | 'inlineSize' | 'interestFor' | 'lang' | 'loading' | 'maxBlockSize' | 'maxInlineSize' | 'minBlockSize' | 'minInlineSize' | 'overflow' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart' | 'target' | 'type'> {
     background?: Extract<ClickableProps$1['background'], 'transparent' | 'subdued' | 'base'>;
     border?: BorderShorthand;
     borderWidth?: MaybeAllValuesShorthandProperty<ReducedBorderSizeKeyword> | '';
@@ -2810,160 +3674,419 @@ interface ClickableProps extends Pick<ClickableProps$1, 'accessibilityLabel' | '
     target?: Extract<ClickableProps$1['target'], 'auto' | '_blank'>;
     type?: Extract<ClickableProps$1['type'], 'submit' | 'button'>;
 }
-interface ClickableElement extends Omit<ClickableProps, 'onBlur' | 'onClick' | 'onFocus'>, Omit<HTMLElement, 'id' | 'lang' | 'onblur' | 'onclick' | 'onfocus'> {
-    onblur: ClickableProps['onBlur'];
-    onclick: ClickableProps['onClick'];
-    onfocus: ClickableProps['onFocus'];
+interface ClickableEvents extends Pick<ClickableProps$1, 'onBlur' | 'onClick' | 'onFocus'> {
+}
+interface ClickableElement extends ClickableElementProps, Omit<HTMLElement, 'id' | 'lang' | 'onblur' | 'onclick' | 'onfocus'> {
+    onblur: ClickableEvents['onBlur'];
+    onclick: ClickableEvents['onClick'];
+    onfocus: ClickableEvents['onFocus'];
+}
+interface ClickableProps extends ClickableElementProps, ClickableEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$P]: ClickableElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$P]: ClickableProps & BaseElementPropsWithChildren<ClickableElement>;
+        }
+    }
+}
+declare const tagName$O = "s-clickable-chip";
+interface ClickableChipElementProps extends Pick<ClickableChipProps$1, 'accessibilityLabel' | 'disabled' | 'hidden' | 'href' | 'id' | 'removable'> {
+}
+interface ClickableChipEvents extends Pick<ClickableChipProps$1, 'onAfterHide' | 'onClick' | 'onRemove'> {
+}
+interface ClickableChipElement extends ClickableChipElementProps, Omit<HTMLElement, 'id' | 'hidden' | 'onclick'> {
+    onafterhide: ClickableChipEvents['onAfterHide'];
+    onclick: ClickableChipEvents['onClick'];
+    onremove: ClickableChipEvents['onRemove'];
+}
+interface ClickableChipProps extends ClickableChipElementProps, ClickableChipEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$O]: ClickableChipElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$O]: ClickableChipProps & BaseElementPropsWithChildren<ClickableChipElement>;
+        }
+    }
+}
+declare const tagName$N = "s-clipboard-item";
+interface ClipboardItemElementProps extends Pick<ClipboardItemProps$1, 'id' | 'text'> {
+}
+interface ClipboardItemEvents extends Pick<ClipboardItemProps$1, 'onCopy' | 'onCopyError'> {
+}
+interface ClipboardItemElement extends ClipboardItemElementProps, Omit<HTMLElement, 'id' | 'oncopy'> {
+    oncopy: ClipboardItemEvents['onCopy'];
+    oncopyerror: ClipboardItemEvents['onCopyError'];
+}
+interface ClipboardItemProps extends ClipboardItemElementProps, ClipboardItemEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$N]: ClipboardItemElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$N]: ClipboardItemProps & BaseElementProps<ClipboardItemElement>;
+        }
+    }
+}
+declare const tagName$M = "s-consent-checkbox";
+interface ConsentCheckboxElementProps extends Pick<ConsentCheckboxProps$1, 'accessibilityLabel' | 'checked' | 'command' | 'commandFor' | 'defaultChecked' | 'disabled' | 'error' | 'id' | 'label' | 'name' | 'policy' | 'value'> {
+    command?: Extract<ConsentCheckboxProps$1['command'], '--auto' | '--show' | '--hide' | '--toggle'>;
+}
+interface ConsentCheckboxEvents extends Pick<CheckboxEvents, 'onChange'> {
+}
+interface ConsentCheckboxElement extends ConsentCheckboxElementProps, Omit<HTMLElement, 'id' | 'onchange'> {
+    onchange: ConsentCheckboxEvents['onChange'];
+}
+interface ConsentCheckboxProps extends ConsentCheckboxElementProps, ConsentCheckboxEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$M]: ConsentCheckboxElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$M]: ConsentCheckboxProps & BaseElementProps<ConsentCheckboxElement>;
+        }
+    }
+}
+declare const tagName$L = "s-phone-field";
+interface PhoneFieldElementProps extends Pick<PhoneFieldProps$1, 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'id' | 'label' | 'labelAccessibilityVisibility' | 'name' | 'readOnly' | 'required' | 'value' | 'type'> {
+    /**
+     * @deprecated Use `label` instead.
+     * @private
+     */
+    placeholder?: string;
+}
+interface PhoneFieldEvents extends Pick<PhoneFieldProps$1, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
+}
+interface PhoneFieldElement extends PhoneFieldElementProps, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus' | 'oninput' | 'prefix'> {
+    onblur: PhoneFieldEvents['onBlur'];
+    onchange: PhoneFieldEvents['onChange'];
+    onfocus: PhoneFieldEvents['onFocus'];
+    oninput: PhoneFieldEvents['onInput'];
+}
+interface PhoneFieldProps extends PhoneFieldElementProps, PhoneFieldEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$L]: PhoneFieldElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$L]: PhoneFieldProps & BaseElementPropsWithChildren<PhoneFieldElement>;
+        }
+    }
+}
+declare const tagName$K = "s-consent-phone-field";
+interface ConsentPhoneFieldElementProps extends Pick<ConsentPhoneFieldProps$1, 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'id' | 'label' | 'labelAccessibilityVisibility' | 'name' | 'policy' | 'readOnly' | 'required' | 'type' | 'value'> {
+    /**
+     * @deprecated Use `label` instead.
+     * @private
+     */
+    placeholder?: string;
+}
+interface ConsentPhoneFieldEvents extends Pick<PhoneFieldEvents, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
+}
+interface ConsentPhoneFieldElement extends ConsentPhoneFieldElementProps, Omit<ConsentPhoneFieldEvents, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
+    onblur: ConsentPhoneFieldEvents['onBlur'];
+    onchange: ConsentPhoneFieldEvents['onChange'];
+    onfocus: ConsentPhoneFieldEvents['onFocus'];
+    oninput: ConsentPhoneFieldEvents['onInput'];
+}
+interface ConsentPhoneFieldProps extends ConsentPhoneFieldElementProps, ConsentPhoneFieldEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$K]: ConsentPhoneFieldElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$K]: ConsentPhoneFieldProps & BaseElementProps<ConsentPhoneFieldElement>;
+        }
+    }
+}
+declare const tagName$J = "s-date-field";
+interface DateFieldElementProps extends Pick<DateFieldProps$1, 'allow' | 'allowDays' | 'autocomplete' | 'defaultValue' | 'defaultView' | 'disabled' | 'disallow' | 'disallowDays' | 'error' | 'id' | 'label' | 'name' | 'readOnly' | 'required' | 'value' | 'view'> {
+    /**
+     * @deprecated Use `label` instead.
+     * @private
+     */
+    placeholder?: string;
+}
+interface DateFieldEvents extends Pick<DateFieldProps$1, 'onBlur' | 'onChange' | 'onFocus' | 'onInput' | 'onInvalid' | 'onViewChange'> {
+}
+interface DateFieldElement extends DateFieldElementProps, Omit<DateFieldEvents, 'onBlur' | 'onChange' | 'onFocus' | 'onInput' | 'onInvalid' | 'onViewChange'>, Omit<HTMLElement, 'id' | 'inputMode' | 'onblur' | 'onchange' | 'onfocus' | 'oninput' | 'oninvalid' | 'prefix'> {
+    onblur: DateFieldEvents['onBlur'];
+    onchange: DateFieldEvents['onChange'];
+    onfocus: DateFieldEvents['onFocus'];
+    oninput: DateFieldEvents['onInput'];
+    oninvalid: DateFieldEvents['onInvalid'];
+    onviewchange: DateFieldEvents['onViewChange'];
+}
+interface DateFieldProps extends DateFieldElementProps, DateFieldEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$J]: DateFieldElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$J]: DateFieldProps & BaseElementProps<DateFieldElement>;
+        }
+    }
+}
+declare const tagName$I = "s-date-picker";
+interface DatePickerElementProps extends Pick<DatePickerProps$1, 'allow' | 'allowDays' | 'defaultValue' | 'defaultView' | 'disabled' | 'disallow' | 'disallowDays' | 'id' | 'name' | 'type' | 'value' | 'view'> {
+}
+interface DatePickerEvents extends Pick<DatePickerProps$1, 'onBlur' | 'onChange' | 'onFocus' | 'onInput' | 'onViewChange'> {
+}
+interface DatePickerElement extends DatePickerElementProps, Omit<DatePickerEvents, 'onBlur' | 'onChange' | 'onFocus' | 'onInput' | 'onViewChange'>, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus' | 'oninput'> {
+    onblur: DatePickerEvents['onBlur'];
+    onchange: DatePickerEvents['onChange'];
+    onfocus: DatePickerEvents['onFocus'];
+    oninput: DatePickerEvents['onInput'];
+    onviewchange: DatePickerEvents['onViewChange'];
+}
+interface DatePickerProps extends DatePickerElementProps, DatePickerEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$w]: ClickableElement;
+        [tagName$I]: DatePickerElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$w]: ClickableProps & BaseElementPropsWithChildren<ClickableElement>;
+            [tagName$I]: DatePickerProps & BaseElementProps<DatePickerElement>;
         }
     }
 }
-declare const tagName$v = "s-clipboard-item";
-interface ClipboardItemBaseProps extends Pick<ClipboardItemProps$1, 'id' | 'text'> {
+declare const tagName$H = "s-details";
+interface DetailsElementProps extends Pick<DetailsProps$1, 'defaultOpen' | 'id' | 'open' | 'toggleTransition'> {
 }
-interface ClipboardItemEvents extends Pick<ClipboardItemProps$1, 'onCopy' | 'onCopyError'> {
+interface DetailsEvents extends Pick<DetailsProps$1, 'onToggle' | 'onAfterToggle'> {
 }
-interface ClipboardItemElement extends ClipboardItemBaseProps, Omit<ClipboardItemEvents, 'onCopy' | 'onCopyError'>, Omit<HTMLElement, 'id' | 'oncopy'> {
-    oncopy: ClipboardItemEvents['onCopy'];
-    oncopyerror: ClipboardItemEvents['onCopyError'];
+interface DetailsElement extends Omit<HTMLElement, 'ontoggle' | 'id'> {
+    ontoggle: DetailsEvents['onToggle'];
+    onaftertoggle: DetailsEvents['onAfterToggle'];
 }
-interface ClipboardItemProps extends ClipboardItemBaseProps, ClipboardItemEvents {
+interface DetailsProps extends DetailsElementProps, DetailsEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$H]: DetailsElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$v]: ClipboardItemProps & BaseElementProps<ClipboardItemElement>;
+            [tagName$H]: DetailsProps & BaseElementPropsWithChildren<DetailsElement>;
         }
     }
 }
-declare const tagName$u = "s-details";
-interface DetailsProps extends Pick<DetailsProps$1, 'defaultOpen' | 'onToggle' | 'name' | 'id'> {
+declare const tagName$G = "s-divider";
+interface DividerProps extends Pick<DividerProps$1, 'direction' | 'id'> {
 }
-interface DetailsElement extends Omit<DetailsProps, 'onToggle'>, Omit<HTMLElement, 'ontoggle' | 'id'> {
-    ontoggle: DetailsProps['onToggle'];
+interface DividerElement extends DividerProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$u]: DetailsElement;
+        [tagName$G]: DividerElement;
     }
 }
 declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$u]: DetailsProps & BaseProps;
+            [tagName$G]: DividerProps & BaseElementPropsWithChildren<DividerElement>;
         }
     }
 }
-declare const tagName$t = "s-drop-zone";
-interface DropZoneBaseProps extends Pick<DropZoneProps$1, 'accept' | 'accessibilityLabel' | 'disabled' | 'error' | 'id' | 'label' | 'multiple' | 'name' | 'required'> {
+declare const tagName$F = "s-drop-zone";
+interface DropZoneElementProps extends Pick<DropZoneProps$1, 'accept' | 'accessibilityLabel' | 'disabled' | 'error' | 'id' | 'label' | 'multiple' | 'name' | 'required' | 'value'> {
 }
-interface DropZoneEvents extends Pick<DropZoneProps$1, 'onDropRejected' | 'onInput'> {
+interface DropZoneEvents extends Pick<DropZoneProps$1, 'onDropRejected' | 'onInput' | 'onChange'> {
 }
-interface DropZoneElement extends DropZoneBaseProps, Omit<DropZoneEvents, 'onDropRejected' | 'onInput'>, Omit<HTMLElement, 'id' | 'oninput'> {
+interface DropZoneElement extends DropZoneElementProps, Omit<HTMLElement, 'id' | 'oninput' | 'onchange'> {
     ondroprejected: DropZoneEvents['onDropRejected'];
     oninput: DropZoneEvents['onInput'];
+    onchange: DropZoneEvents['onChange'];
 }
-interface DropZoneProps extends DropZoneBaseProps, DropZoneEvents {
+interface DropZoneProps extends DropZoneElementProps, DropZoneEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$F]: DropZoneElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$t]: DropZoneProps & BaseElementProps<DropZoneElement>;
+            [tagName$F]: DropZoneProps & BaseElementProps<DropZoneElement>;
         }
     }
 }
-declare const tagName$s = "s-email-field";
-interface EmailFieldBaseProps extends Pick<EmailFieldProps$1, 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'maxLength' | 'minLength' | 'id' | 'label' | 'labelAccessibilityVisibility' | 'name' | 'placeholder' | 'readOnly' | 'required' | 'value'> {
+declare const tagName$E = "s-email-field";
+interface EmailFieldElementProps extends Pick<EmailFieldProps$1, 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'maxLength' | 'minLength' | 'id' | 'label' | 'labelAccessibilityVisibility' | 'name' | 'readOnly' | 'required' | 'value'> {
+    /**
+     * @deprecated Use `label` instead.
+     * @private
+     */
+    placeholder?: string;
 }
 interface EmailFieldEvents extends Pick<EmailFieldProps$1, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
 }
-interface EmailFieldElement extends EmailFieldBaseProps, Omit<EmailFieldEvents, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'>, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus' | 'oninput' | 'prefix'> {
+interface EmailFieldElement extends EmailFieldElementProps, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus' | 'oninput' | 'prefix'> {
     onblur: EmailFieldEvents['onBlur'];
     onchange: EmailFieldEvents['onChange'];
     onfocus: EmailFieldEvents['onFocus'];
     oninput: EmailFieldEvents['onInput'];
 }
-interface EmailFieldProps extends EmailFieldBaseProps, EmailFieldEvents {
+interface EmailFieldProps extends EmailFieldElementProps, EmailFieldEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$s]: EmailFieldElement;
+        [tagName$E]: EmailFieldElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$s]: EmailFieldProps & BaseElementProps<EmailFieldElement>;
+            [tagName$E]: EmailFieldProps & BaseElementProps<EmailFieldElement>;
         }
     }
 }
-declare const tagName$r = "s-form";
-interface FormBaseProps extends Pick<FormProps$1, 'id' | 'disabled'> {
+declare const tagName$D = "s-form";
+interface FormElementProps extends Pick<FormProps$1, 'disabled' | 'id'> {
 }
 interface FormEvents extends Pick<FormProps$1, 'onSubmit'> {
+    /**
+     * A callback that is run when the form is submitted.
+     */
     onSubmit?: () => void;
 }
-interface FormElement extends Omit<FormBaseProps, 'children'>, Omit<FormEvents, 'onSubmit'>, Omit<HTMLElement, 'id' | 'onsubmit'> {
+interface FormElement extends FormElementProps, Omit<HTMLElement, 'id' | 'onsubmit'> {
     onsubmit: FormEvents['onSubmit'];
 }
-interface FormProps extends FormBaseProps, FormEvents {
+interface FormProps extends FormElementProps, FormEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$D]: FormElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$D]: FormProps & BaseElementPropsWithChildren<FormElement>;
+        }
+    }
+}
+declare const tagName$C = "s-grid-item";
+interface GridItemProps extends Pick<GridItemProps$1, 'accessibilityLabel' | 'accessibilityRole' | 'accessibilityVisibility' | 'background' | 'blockSize' | 'border' | 'borderColor' | 'borderRadius' | 'borderStyle' | 'borderWidth' | 'display' | 'gridColumn' | 'gridRow' | 'id' | 'inlineSize' | 'maxBlockSize' | 'maxInlineSize' | 'minBlockSize' | 'minInlineSize' | 'overflow' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart'> {
+    background?: Extract<GridItemProps$1['background'], 'transparent' | 'subdued' | 'base'>;
+    border?: BorderShorthand;
+    borderColor?: ReducedColorKeyword | '';
+    borderWidth?: MaybeAllValuesShorthandProperty<ReducedBorderSizeKeyword> | '';
+    borderRadius?: MaybeAllValuesShorthandProperty<Extract<GridItemProps$1['borderRadius'], 'none' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'max'>>;
+}
+interface GridItemElement extends GridItemProps, Omit<HTMLElement, 'id'> {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$C]: GridItemElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$C]: GridItemProps & BaseElementPropsWithChildren<GridItemElement>;
+        }
+    }
+}
+declare const tagName$B = "s-grid";
+interface GridProps extends Pick<GridProps$1, 'accessibilityLabel' | 'accessibilityRole' | 'accessibilityVisibility' | 'alignContent' | 'alignItems' | 'background' | 'blockSize' | 'border' | 'borderColor' | 'borderRadius' | 'borderStyle' | 'borderWidth' | 'columnGap' | 'display' | 'gap' | 'gridTemplateColumns' | 'gridTemplateRows' | 'id' | 'inlineSize' | 'justifyContent' | 'justifyItems' | 'maxBlockSize' | 'maxInlineSize' | 'minBlockSize' | 'minInlineSize' | 'overflow' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart' | 'placeContent' | 'placeItems' | 'rowGap'> {
+    alignContent?: MaybeResponsive<ReducedAlignContentKeyword | ''>;
+    alignItems?: MaybeResponsive<ReducedAlignItemsKeyword | ''>;
+    background?: Extract<GridProps$1['background'], 'transparent' | 'subdued' | 'base'>;
+    border?: BorderShorthand;
+    borderColor?: ReducedColorKeyword | '';
+    borderWidth?: MaybeAllValuesShorthandProperty<ReducedBorderSizeKeyword> | '';
+    borderRadius?: MaybeAllValuesShorthandProperty<Extract<GridProps$1['borderRadius'], 'none' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'max'>>;
+    justifyContent?: MaybeResponsive<ReducedJustifyContentKeyword | ''>;
+    justifyItems?: MaybeResponsive<ReducedJustifyItemsKeyword | ''>;
+    placeContent?: MaybeResponsive<`${ReducedAlignContentKeyword} ${ReducedJustifyContentKeyword}` | ReducedAlignContentKeyword>;
+    placeItems?: MaybeResponsive<`${ReducedAlignItemsKeyword} ${ReducedJustifyItemsKeyword}` | ReducedAlignItemsKeyword>;
+}
+interface GridElement extends GridProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$B]: GridElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$r]: FormProps & BaseElementPropsWithChildren<FormElement>;
+            [tagName$B]: GridProps & BaseElementPropsWithChildren<GridElement>;
         }
     }
 }
-declare const tagName$q = "s-heading";
+declare const tagName$A = "s-heading";
 interface HeadingProps extends Pick<HeadingProps$1, 'accessibilityRole' | 'id'> {
 }
 interface HeadingElement extends HeadingProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$A]: HeadingElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$q]: HeadingProps & BaseElementPropsWithChildren<HeadingElement>;
+            [tagName$A]: HeadingProps & BaseElementPropsWithChildren<HeadingElement>;
         }
     }
 }
-declare const tagName$p = "s-icon";
+declare const tagName$z = "s-icon";
 interface IconProps extends Pick<IconProps$1, 'id' | 'size' | 'tone' | 'type'> {
     tone?: Extract<IconProps$1['tone'], 'auto' | 'neutral' | 'info' | 'success' | 'warning' | 'critical' | 'custom'>;
     size?: Extract<IconProps$1['size'], 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100'>;
@@ -2973,17 +4096,18 @@ interface IconElement extends IconProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$z]: IconElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$p]: IconProps & BaseElementProps<IconElement>;
+            [tagName$z]: IconProps & BaseElementProps<IconElement>;
         }
     }
 }
-declare const tagName$o = "s-image";
+declare const tagName$y = "s-image";
 interface ImageProps extends Pick<ImageProps$1, 'accessibilityRole' | 'alt' | 'aspectRatio' | 'border' | 'borderRadius' | 'borderStyle' | 'borderWidth' | 'id' | 'inlineSize' | 'loading' | 'objectFit' | 'sizes' | 'src' | 'srcSet'> {
     border?: BorderShorthand;
     borderWidth?: MaybeAllValuesShorthandProperty<ReducedBorderSizeKeyword> | '';
@@ -2993,211 +4117,233 @@ interface ImageElement extends ImageProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$y]: ImageElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$o]: ImageProps & BaseElementProps<ImageElement>;
+            [tagName$y]: ImageProps & BaseElementProps<ImageElement>;
         }
     }
 }
-declare const tagName$n = "s-link";
-interface LinkBaseProps extends Pick<LinkProps$1, 'accessibilityLabel' | 'command' | 'commandFor' | 'href' | 'id' | 'lang' | 'target' | 'tone'> {
+declare const tagName$x = "s-link";
+interface LinkElementProps extends Pick<LinkProps$1, 'accessibilityLabel' | 'command' | 'commandFor' | 'href' | 'id' | 'interestFor' | 'lang' | 'target' | 'tone'> {
     target?: Extract<LinkProps$1['target'], 'auto' | '_blank'>;
     tone?: Extract<LinkProps$1['tone'], 'auto' | 'neutral'>;
 }
 interface LinkEvents extends Pick<LinkProps$1, 'onClick'> {
 }
-interface LinkElement extends LinkBaseProps, Omit<LinkEvents, 'onClick'>, Omit<HTMLElement, 'id' | 'lang' | 'onclick'> {
+interface LinkElement extends LinkElementProps, Omit<HTMLElement, 'id' | 'lang' | 'onclick'> {
     onclick: LinkEvents['onClick'];
 }
-interface LinkProps extends LinkBaseProps, LinkEvents {
+interface LinkProps extends LinkElementProps, LinkEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$x]: LinkElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$n]: LinkProps & BaseElementPropsWithChildren<LinkElement>;
+            [tagName$x]: LinkProps & BaseElementPropsWithChildren<LinkElement>;
         }
     }
 }
-declare const tagName$m = "s-list-item";
+declare const tagName$w = "s-list-item";
 interface ListItemProps extends Pick<ListItemProps$1, 'id'> {
 }
 interface ListItemElement extends ListItemProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$w]: ListItemElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$w]: ListItemProps & BaseElementPropsWithChildren<ListItemElement>;
+        }
+    }
+}
+declare const tagName$v = "s-map-marker";
+interface MapMarkerElementProps extends Pick<MapMarkerProps$1, 'accessibilityLabel' | 'blockSize' | 'command' | 'commandFor' | 'clusterable' | 'inlineSize' | 'latitude' | 'longitude'> {
+    command?: Extract<MapMarkerProps$1['command'], '--auto' | '--show' | '--hide' | '--toggle'>;
+}
+interface MapMarkerEvents extends Pick<MapMarkerProps$1, 'onClick'> {
+}
+interface MapMarkerElement extends MapMarkerElementProps, Omit<HTMLElement, 'id' | 'onclick'> {
+    onclick: MapMarkerEvents['onClick'];
+}
+interface MapMarkerProps extends MapMarkerElementProps, MapMarkerEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$v]: MapMarkerElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$m]: ListItemProps & BaseElementPropsWithChildren<ListItemElement>;
+            [tagName$v]: MapMarkerProps & BaseElementPropsWithChildren<MapMarkerElement>;
         }
     }
 }
-declare const tagName$l = "s-map";
-interface MapBaseProps extends Pick<MapProps$1, 'accessibilityLabel' | 'apiKey' | 'blockSize' | 'id' | 'inlineSize' | 'latitude' | 'longitude' | 'maxBlockSize' | 'maxInlineSize' | 'maxZoom' | 'minBlockSize' | 'minInlineSize' | 'minZoom' | 'zoom'> {
+declare const tagName$u = "s-map";
+interface MapElementProps extends Pick<MapProps$1, 'accessibilityLabel' | 'apiKey' | 'blockSize' | 'id' | 'inlineSize' | 'latitude' | 'longitude' | 'maxBlockSize' | 'maxInlineSize' | 'maxZoom' | 'minBlockSize' | 'minInlineSize' | 'minZoom' | 'zoom'> {
 }
 interface MapEvents extends Pick<MapProps$1, 'onBoundsChange' | 'onClick' | 'onDblClick' | 'onViewChange'> {
 }
-interface MapElement extends MapBaseProps, Omit<MapEvents, 'onBoundsChange' | 'onClick' | 'onDblClick' | 'onViewChange'>, Omit<HTMLElement, 'id' | 'onclick' | 'ondblclick'> {
+interface MapElement extends MapElementProps, Omit<HTMLElement, 'id' | 'onclick' | 'ondblclick'> {
     onboundschange: MapEvents['onBoundsChange'];
     onclick: MapEvents['onClick'];
     ondblclick: MapEvents['onDblClick'];
     onviewchange: MapEvents['onViewChange'];
 }
-interface MapProps extends MapBaseProps, MapEvents {
+interface MapProps extends MapElementProps, MapEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$l]: MapElement;
+        [tagName$u]: MapElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$l]: MapProps & BaseElementPropsWithChildren<MapElement>;
+            [tagName$u]: MapProps & BaseElementPropsWithChildren<MapElement>;
         }
     }
 }
-declare const tagName$k = "s-map-marker";
-interface MapMarkerBaseProps extends Pick<MapMarkerProps$1, 'accessibilityLabel' | 'blockSize' | 'clusterable' | 'inlineSize' | 'latitude' | 'longitude'> {
+declare const tagName$t = "s-modal";
+interface ModalElementProps extends Pick<ModalProps$1, 'accessibilityLabel' | 'heading' | 'id' | 'padding' | 'size'> {
+    size?: Extract<ModalProps$1['size'], 'small-100' | 'small' | 'base' | 'large-100' | 'large' | 'max'>;
 }
-interface MapMarkerEvents extends Pick<MapMarkerProps$1, 'onClick'> {
+interface ModalEvents extends Pick<ModalProps$1, 'onAfterHide' | 'onAfterShow' | 'onHide' | 'onShow'> {
 }
-interface MapMarkerSlots {
-    /**
-     * The graphic to use as the marker.
-     *
-     * If unset, it will default to the provider’s default marker.
-     */
-    graphic?: ReactNode;
+interface ModalElementMethods extends Pick<ModalProps$1, 'hideOverlay'> {
 }
-interface MapMarkerElement extends MapMarkerBaseProps, MapMarkerSlots, Omit<HTMLElement, 'id' | 'onclick'> {
-    onclick: MapMarkerEvents['onClick'];
+interface ModalElement extends ModalElementProps, ModalElementMethods, Omit<HTMLElement, 'id'> {
+    onafterhide: ModalEvents['onAfterHide'];
+    onaftershow: ModalEvents['onAfterShow'];
+    onhide: ModalEvents['onHide'];
+    onshow: ModalEvents['onShow'];
 }
-interface MapMarkerProps extends MapMarkerBaseProps, MapMarkerEvents {
+interface ModalProps extends ModalElementProps, ModalEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$k]: MapMarkerElement;
+        [tagName$t]: ModalElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$k]: MapMarkerProps & BaseElementProps<MapMarkerElement>;
+            [tagName$t]: ModalProps & BaseElementPropsWithChildren<ModalElement>;
         }
     }
 }
-declare const tagName$j = "s-modal";
-interface ModalBaseProps extends Pick<ModalProps$1, 'accessibilityLabel' | 'heading' | 'id' | 'padding' | 'size'> {
-    size?: Extract<ModalProps$1['size'], 'small-100' | 'small' | 'base' | 'large-100' | 'large' | 'max'>;
-}
-interface ModalSlots extends Pick<ModalProps$1, 'primaryAction' | 'secondaryActions'> {
-    /**
-     * The primary action to perform, provided as a button type element.
-     */
-    primaryAction?: ReactNode;
-    /**
-     * The secondary actions to perform, provided as button type elements.
-     */
-    secondaryActions?: ReactNode;
+declare const tagName$s = "s-money-field";
+interface MoneyFieldElementProps extends Pick<MoneyFieldProps$1, 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'id' | 'label' | 'labelAccessibilityVisibility' | 'max' | 'min' | 'name' | 'readOnly' | 'required' | 'step' | 'value'> {
 }
-interface ModalEvents extends Pick<ModalProps$1, 'onHide' | 'onShow' | 'onAfterHide' | 'onAfterShow'> {
+interface MoneyFieldEvents extends Pick<MoneyFieldProps$1, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
 }
-interface ModalElement extends ModalBaseProps, ModalSlots, Omit<ModalEvents, 'onHide' | 'onShow'>, Omit<HTMLElement, 'id'> {
-    onhide: ModalEvents['onHide'];
-    onshow: ModalEvents['onShow'];
+interface MoneyFieldElement extends MoneyFieldElementProps {
+    onblur: MoneyFieldEvents['onBlur'];
+    onchange: MoneyFieldEvents['onChange'];
+    onfocus: MoneyFieldEvents['onFocus'];
+    oninput: MoneyFieldEvents['onInput'];
 }
-interface ModalProps extends ModalBaseProps, ModalSlots, ModalEvents {
+interface MoneyFieldProps extends MoneyFieldElementProps, MoneyFieldEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$j]: ModalElement;
+        [tagName$s]: MoneyFieldElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$j]: ModalProps & BaseElementPropsWithChildren<ModalElement>;
+            [tagName$s]: MoneyFieldProps & BaseElementProps<MoneyFieldElement>;
         }
     }
 }
-declare const tagName$i = "s-number-field";
-interface NumberFieldBaseProps extends NumberFieldProps$1 {
+declare const tagName$r = "s-number-field";
+interface NumberFieldElementProps extends Pick<NumberFieldProps$1, 'autocomplete' | 'controls' | 'defaultValue' | 'details' | 'disabled' | 'error' | 'icon' | 'id' | 'inputMode' | 'label' | 'labelAccessibilityVisibility' | 'max' | 'min' | 'name' | 'prefix' | 'readOnly' | 'required' | 'step' | 'suffix' | 'value'> {
+    /**
+     * @deprecated Use `label` instead.
+     * @private
+     */
+    placeholder?: string;
 }
 interface NumberFieldEvents extends Pick<NumberFieldProps$1, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
 }
-interface NumberFieldElement extends NumberFieldBaseProps, Omit<NumberFieldEvents, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'>, Omit<HTMLElement, 'id' | 'inputMode' | 'onblur' | 'onchange' | 'onfocus' | 'oninput' | 'prefix'> {
+interface NumberFieldElement extends NumberFieldElementProps, Omit<HTMLElement, 'id' | 'inputMode' | 'onblur' | 'onchange' | 'onfocus' | 'oninput' | 'prefix'> {
     onblur: NumberFieldEvents['onBlur'];
     onchange: NumberFieldEvents['onChange'];
     onfocus: NumberFieldEvents['onFocus'];
     oninput: NumberFieldEvents['onInput'];
 }
-interface NumberFieldProps extends NumberFieldBaseProps, NumberFieldEvents {
+interface NumberFieldProps extends NumberFieldElementProps, NumberFieldEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$i]: NumberFieldElement;
+        [tagName$r]: NumberFieldElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$i]: NumberFieldProps & BaseElementProps<NumberFieldElement>;
+            [tagName$r]: NumberFieldProps & BaseElementPropsWithChildren<NumberFieldElement>;
         }
     }
 }
-declare const tagName$h = "s-ordered-list";
-interface OrderedListProps extends OrderedListProps$1 {
+declare const tagName$q = "s-option";
+interface OptionProps extends Pick<OptionProps$1, 'accessibilityLabel' | 'defaultSelected' | 'disabled' | 'id' | 'selected' | 'value'> {
 }
-interface OrderedListElement extends OrderedListProps, Omit<HTMLElement, 'id'> {
+interface OptionElement extends OptionProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$q]: OptionElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$h]: OrderedListProps & BaseElementPropsWithChildren<OrderedListElement>;
+            [tagName$q]: OptionProps & BaseElementPropsWithChildren<OptionElement>;
         }
     }
 }
-declare const tagName$g = "s-option";
-interface OptionProps extends Pick<OptionProps$1, 'accessibilityLabel' | 'defaultSelected' | 'disabled' | 'id' | 'selected' | 'value'> {
+declare const tagName$p = "s-ordered-list";
+interface OrderedListProps extends OrderedListProps$1 {
 }
-interface OptionElement extends OptionProps, Omit<HTMLElement, 'id'> {
+interface OrderedListElement extends OrderedListProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$g]: OptionElement;
+        [tagName$p]: OrderedListElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$g]: OptionProps & BaseElementPropsWithChildren<OptionElement>;
+            [tagName$p]: OrderedListProps & BaseElementPropsWithChildren<OrderedListElement>;
         }
     }
 }
-declare const tagName$f = "s-paragraph";
+declare const tagName$o = "s-paragraph";
 interface ParagraphProps extends Pick<ParagraphProps$1, 'accessibilityVisibility' | 'color' | 'dir' | 'id' | 'lang' | 'tone' | 'type'> {
     color?: Extract<ParagraphProps$1['color'], 'subdued' | 'base'>;
     tone?: Extract<ParagraphProps$1['tone'], 'auto' | 'info' | 'success' | 'warning' | 'critical' | 'neutral' | 'custom'>;
@@ -3206,67 +4352,159 @@ interface ParagraphElement extends ParagraphProps, Omit<HTMLElement, 'id' | 'dir
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$o]: ParagraphElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$f]: ParagraphProps & BaseElementPropsWithChildren<ParagraphElement>;
+            [tagName$o]: ParagraphProps & BaseElementPropsWithChildren<ParagraphElement>;
         }
     }
 }
-declare const tagName$e = "s-payment-icon";
-interface PaymentIconProps extends PaymentIconProps$1 {
+declare const tagName$n = "s-password-field";
+interface PasswordFieldElementProps extends Pick<PasswordFieldProps$1, 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'id' | 'label' | 'labelAccessibilityVisibility' | 'maxLength' | 'minLength' | 'name' | 'readOnly' | 'required' | 'value'> {
 }
-interface PaymentIconElement extends PaymentIconProps, Omit<HTMLElement, 'id'> {
+interface PasswordFieldEvents extends Pick<PasswordFieldProps$1, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
+}
+interface PasswordFieldElement extends PasswordFieldProps, Omit<HTMLElement, 'id' | 'inputMode' | 'onblur' | 'onchange' | 'onfocus' | 'oninput' | 'prefix'> {
+    onblur: PasswordFieldEvents['onBlur'];
+    onchange: PasswordFieldEvents['onChange'];
+    onfocus: PasswordFieldEvents['onFocus'];
+    oninput: PasswordFieldEvents['onInput'];
+}
+interface PasswordFieldProps extends PasswordFieldElementProps, PasswordFieldEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$n]: PasswordFieldElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$e]: PaymentIconProps & BaseElementProps<PaymentIconElement>;
+            [tagName$n]: PasswordFieldProps & BaseElementPropsWithChildren<PasswordFieldElement>;
         }
     }
 }
-declare const tagName$d = "s-phone-field";
-interface PhoneFieldBaseProps extends Pick<PhoneFieldProps$1, 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'id' | 'label' | 'labelAccessibilityVisibility' | 'name' | 'placeholder' | 'readOnly' | 'required' | 'value' | 'type'> {
+declare const tagName$m = "s-payment-icon";
+interface PaymentIconProps extends PaymentIconProps$1 {
 }
-interface PhoneFieldEvents extends Pick<PhoneFieldProps$1, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
+interface PaymentIconElement extends PaymentIconProps, Omit<HTMLElement, 'id'> {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$m]: PaymentIconElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$m]: PaymentIconProps & BaseElementProps<PaymentIconElement>;
+        }
+    }
 }
-interface PhoneFieldSlots extends Pick<PhoneFieldProps$1, 'accessory'> {
+declare const tagName$l = "s-popover";
+interface PopoverElementProps extends Pick<PopoverProps$1, 'id'> {
+    /**
+     * Adjust the block size.
+     *
+     * @see https://developer.mozilla.org/en-US/docs/Web/CSS/block-size
+     *
+     * @default 'auto'
+     */
+    blockSize?: SizeUnitsOrAuto;
+    /**
+     * Adjust the inline size.
+     *
+     * @see https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size
+     *
+     * @default 'auto'
+     */
+    inlineSize?: SizeUnitsOrAuto;
+    /**
+     * Adjust the maximum block size.
+     *
+     * @see https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size
+     *
+     * @default 'none'
+     */
+    maxBlockSize?: SizeUnitsOrNone;
+    /**
+     * Adjust the maximum inline size.
+     *
+     * @see https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size
+     *
+     * @default 'none'
+     */
+    maxInlineSize?: SizeUnitsOrNone;
+    /**
+     * Adjust the minimum block size.
+     *
+     * @see https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size
+     *
+     * @default '0'
+     */
+    minBlockSize?: SizeUnits;
     /**
-     * Additional content to be displayed in the field.
-     * Commonly used to display an icon that activates a tooltip providing more information.
+     * Adjust the minimum inline size.
+     *
+     * @see https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size
+     *
+     * @default '0'
      */
-    accessory?: ReactNode;
+    minInlineSize?: SizeUnits;
 }
-interface PhoneFieldElement extends PhoneFieldBaseProps, PhoneFieldSlots, Omit<PhoneFieldEvents, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'>, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus' | 'oninput' | 'prefix'> {
-    onblur: PhoneFieldEvents['onBlur'];
-    onchange: PhoneFieldEvents['onChange'];
-    onfocus: PhoneFieldEvents['onFocus'];
-    oninput: PhoneFieldEvents['onInput'];
+interface PopoverEvents extends Pick<PopoverProps$1, 'onHide' | 'onShow'> {
 }
-interface PhoneFieldProps extends PhoneFieldBaseProps, PhoneFieldSlots, PhoneFieldEvents {
+interface PopoverElement extends Omit<PopoverProps, 'onHide' | 'onShow'>, Omit<HTMLElement, 'id'> {
+    onhide: PopoverProps['onHide'];
+    onshow: PopoverProps['onShow'];
+}
+interface PopoverProps extends PopoverElementProps, PopoverEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$l]: PopoverElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$l]: PopoverProps & BaseElementPropsWithChildren<PopoverElement>;
+        }
+    }
+}
+declare const tagName$k = "s-press-button";
+interface PressButtonElementProps extends Pick<PressButtonProps$1, 'accessibilityLabel' | 'id' | 'inlineSize' | 'lang' | 'disabled' | 'loading' | 'pressed' | 'defaultPressed'> {
+}
+interface PressButtonEvents extends Pick<PressButtonProps$1, 'onClick' | 'onBlur' | 'onFocus'> {
+}
+interface PressButtonElement extends PressButtonElementProps, Omit<HTMLElement, 'children' | 'lang' | 'id' | 'onblur' | 'onclick' | 'onfocus'> {
+    onblur: PressButtonEvents['onBlur'];
+    onclick: PressButtonEvents['onClick'];
+    onfocus: PressButtonEvents['onFocus'];
+}
+interface PressButtonProps extends PressButtonElementProps, PressButtonEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$d]: PhoneFieldElement;
+        [tagName$k]: PressButtonElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$d]: PhoneFieldProps & BaseElementProps<PhoneFieldElement>;
+            [tagName$k]: PressButtonProps & BaseElementPropsWithChildren<PressButtonElement>;
         }
     }
 }
-declare const tagName$c = "s-product-thumbnail";
+declare const tagName$j = "s-product-thumbnail";
 interface ProductThumbnailProps extends Pick<ProductThumbnailProps$1, 'alt' | 'size' | 'sizes' | 'src' | 'srcSet' | 'totalItems'> {
     size?: Extract<ProductThumbnailProps$1['size'], 'small-100' | 'small' | 'base'>;
 }
@@ -3274,18 +4512,18 @@ interface ProductThumbnailElement extends ProductThumbnailProps, Omit<HTMLElemen
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$c]: ProductThumbnailElement;
+        [tagName$j]: ProductThumbnailElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$c]: ProductThumbnailProps & BaseElementProps<ProductThumbnailElement>;
+            [tagName$j]: ProductThumbnailProps & BaseElementProps<ProductThumbnailElement>;
         }
     }
 }
-declare const tagName$b = "s-progress";
+declare const tagName$i = "s-progress";
 interface ProgressProps extends Pick<ProgressProps$1, 'accessibilityLabel' | 'id' | 'max' | 'tone' | 'value'> {
     tone?: Extract<ProgressProps$1['tone'], 'auto' | 'critical'>;
 }
@@ -3293,83 +4531,183 @@ interface ProgressElement extends ProgressProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$i]: ProgressElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$b]: ProgressProps & BaseElementProps<ProgressElement>;
+            [tagName$i]: ProgressProps & BaseElementProps<ProgressElement>;
         }
     }
 }
-declare const tagName$a = "s-qr-code";
-interface QRCodeBaseProps extends QRCodeProps$1 {
+declare const tagName$h = "s-qr-code";
+interface QRCodeElementProps extends QRCodeProps$1 {
 }
 interface QRCodeEvents extends Pick<QRCodeProps$1, 'onError'> {
 }
-interface QRCodelement extends QRCodeBaseProps, Omit<QRCodeEvents, 'onError'>, Omit<HTMLElement, 'id' | 'onerror'> {
+interface QRCodelement extends QRCodeElementProps, Omit<HTMLElement, 'id' | 'onerror'> {
     onerror: QRCodeEvents['onError'];
 }
-interface QRCodeProps extends QRCodeBaseProps, QRCodeEvents {
+interface QRCodeProps extends QRCodeElementProps, QRCodeEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$h]: QRCodelement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$h]: QRCodeProps & BaseElementProps<QRCodelement>;
+        }
+    }
+}
+declare const tagName$g = "s-query-container";
+interface QueryContainerElementProps extends Pick<QueryContainerProps$1, 'containerName' | 'id'> {
+}
+interface QueryContainerElement extends QueryContainerElementProps, Omit<HTMLElement, 'id'> {
+}
+interface QueryContainerProps extends QueryContainerElementProps {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$g]: QueryContainerElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$g]: QueryContainerProps & BaseElementPropsWithChildren<QueryContainerElement>;
+        }
+    }
+}
+declare const tagName$f = "s-scroll-box";
+interface ScrollBoxProps extends Pick<ScrollBoxProps$1, 'accessibilityLabel' | 'accessibilityRole' | 'accessibilityVisibility' | 'background' | 'blockSize' | 'border' | 'borderColor' | 'borderRadius' | 'borderStyle' | 'borderWidth' | 'display' | 'id' | 'inlineSize' | 'maxBlockSize' | 'maxInlineSize' | 'minBlockSize' | 'minInlineSize' | 'overflow' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart'> {
+    background?: Extract<ScrollBoxProps$1['background'], 'transparent' | 'subdued' | 'base'>;
+    border?: BorderShorthand;
+    borderColor?: ReducedColorKeyword | '';
+    borderRadius?: MaybeAllValuesShorthandProperty<Extract<ScrollBoxProps$1['borderRadius'], 'none' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'max'>>;
+    borderWidth?: MaybeAllValuesShorthandProperty<ReducedBorderSizeKeyword> | '';
+}
+interface ScrollBoxElement extends ScrollBoxProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$a]: QRCodelement;
+        [tagName$f]: ScrollBoxElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$a]: QRCodeProps & BaseElementProps<QRCodelement>;
+            [tagName$f]: ScrollBoxProps & BaseElementPropsWithChildren<ScrollBoxElement>;
         }
     }
 }
-declare const tagName$9 = "s-section";
+declare const tagName$e = "s-section";
 interface SectionProps extends Pick<SectionProps$1, 'accessibilityLabel' | 'heading' | 'id'> {
 }
 interface SectionElement extends SectionProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$9]: SectionElement;
+        [tagName$e]: SectionElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$9]: SectionProps & BaseElementPropsWithChildren<SectionElement>;
+            [tagName$e]: SectionProps & BaseElementPropsWithChildren<SectionElement>;
         }
     }
 }
-declare const tagName$8 = "s-select";
-interface SelectBaseProps extends Pick<SelectProps$1, 'autocomplete' | 'disabled' | 'error' | 'id' | 'label' | 'name' | 'placeholder' | 'required' | 'value'> {
+declare const tagName$d = "s-select";
+interface SelectElementProps extends Pick<SelectProps$1, 'autocomplete' | 'disabled' | 'error' | 'id' | 'label' | 'name' | 'placeholder' | 'required' | 'value'> {
 }
 interface SelectEvents extends Pick<SelectProps$1, 'onBlur' | 'onChange' | 'onFocus'> {
 }
-interface SelectElement extends SelectBaseProps, Omit<SelectEvents, 'onBlur' | 'onChange' | 'onFocus'>, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus'> {
+interface SelectElement extends SelectElementProps, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus'> {
     onblur: SelectEvents['onBlur'];
     onchange: SelectEvents['onChange'];
     onfocus: SelectEvents['onFocus'];
 }
-interface SelectProps extends SelectBaseProps, SelectEvents {
+interface SelectProps extends SelectElementProps, SelectEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$d]: SelectElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$d]: SelectProps & BaseElementPropsWithChildren<SelectElement>;
+        }
+    }
+}
+declare const tagName$c = "s-sheet";
+interface SheetElementProps extends Pick<SheetProps$1, 'defaultOpen' | 'heading' | 'id'> {
+    /**
+     * A label that describes the purpose of the modal. When set,
+     * it will be announced to users using assistive technologies and will
+     * provide them with more context.
+     *
+     * This overrides the `heading` prop for screen readers.
+     */
+    accessibilityLabel?: string;
+}
+interface SheetEvents extends Pick<SheetProps$1, 'onAfterHide' | 'onAfterShow' | 'onHide' | 'onShow'> {
+}
+interface SheetElementMethods extends Pick<SheetProps$1, 'hideOverlay'> {
+}
+interface SheetElement extends SheetElementProps, SheetElementMethods, Omit<HTMLElement, 'id'> {
+    afterhide: SheetEvents['onAfterHide'];
+    aftershow: SheetEvents['onAfterShow'];
+    onhide: SheetEvents['onHide'];
+    onshow: SheetEvents['onShow'];
+    onafterhide: SheetEvents['onAfterHide'];
+    onaftershow: SheetEvents['onAfterShow'];
+}
+interface SheetProps extends SheetElementProps, SheetEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$8]: SelectElement;
+        [tagName$c]: SheetElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$8]: SelectProps & BaseElementPropsWithChildren<SelectElement>;
+            [tagName$c]: SheetProps & BaseElementPropsWithChildren<SheetElement>;
         }
     }
 }
-declare const tagName$7 = "s-spinner";
+declare const tagName$b = "s-skeleton-paragraph";
+interface SkeletonParagraphProps extends SkeletonParagraphProps$1 {
+}
+interface SkeletonParagraphElement extends SkeletonParagraphProps, Omit<HTMLElement, 'id'> {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$b]: SkeletonParagraphElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$b]: SkeletonParagraphProps & BaseElementProps<SkeletonParagraphElement>;
+        }
+    }
+}
+declare const tagName$a = "s-spinner";
 interface SpinnerProps extends SpinnerProps$1 {
     size?: Extract<SpinnerProps$1['size'], 'small-100' | 'small' | 'base' | 'large' | 'large-100'>;
 }
@@ -3377,49 +4715,51 @@ interface SpinnerElement extends SpinnerProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$a]: SpinnerElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$7]: SpinnerProps & BaseElementProps<SpinnerElement>;
+            [tagName$a]: SpinnerProps & BaseElementProps<SpinnerElement>;
         }
     }
 }
-declare const tagName$6 = "s-stack";
+declare const tagName$9 = "s-stack";
 interface StackProps extends Pick<StackProps$1, 'accessibilityLabel' | 'accessibilityRole' | 'alignContent' | 'alignItems' | 'background' | 'blockSize' | 'border' | 'borderRadius' | 'borderStyle' | 'borderWidth' | 'columnGap' | 'direction' | 'display' | 'gap' | 'id' | 'inlineSize' | 'justifyContent' | 'maxBlockSize' | 'maxInlineSize' | 'minBlockSize' | 'minInlineSize' | 'overflow' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart' | 'rowGap'> {
     accessibilityRole?: Extract<StackProps$1['accessibilityRole'], 'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'none'>;
     background?: Extract<StackProps$1['background'], 'transparent' | 'subdued' | 'base'>;
     border?: BorderShorthand;
     borderWidth?: MaybeAllValuesShorthandProperty<ReducedBorderSizeKeyword> | '';
     borderRadius?: MaybeAllValuesShorthandProperty<Extract<StackProps$1['borderRadius'], 'none' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'max'>>;
-    alignContent?: Extract<StackProps$1['alignContent'], 'normal' | 'space-between' | 'space-around' | 'space-evenly' | 'stretch' | 'center' | 'start' | 'end'>;
-    alignItems?: Extract<StackProps$1['alignItems'], 'normal' | 'stretch' | 'center' | 'start' | 'end'>;
-    justifyContent?: Extract<StackProps$1['justifyContent'], 'normal' | 'space-between' | 'space-around' | 'space-evenly' | 'stretch' | 'center' | 'start' | 'end'>;
+    alignContent?: MaybeResponsive<Extract<StackProps$1['alignContent'], 'normal' | 'space-between' | 'space-around' | 'space-evenly' | 'stretch' | 'center' | 'start' | 'end'>>;
+    alignItems?: MaybeResponsive<Extract<StackProps$1['alignItems'], 'normal' | 'stretch' | 'center' | 'start' | 'end'>>;
+    justifyContent?: MaybeResponsive<Extract<StackProps$1['justifyContent'], 'normal' | 'space-between' | 'space-around' | 'space-evenly' | 'stretch' | 'center' | 'start' | 'end'>>;
 }
 interface StackElement extends StackProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$9]: StackElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$6]: StackProps & BaseElementPropsWithChildren<StackElement>;
+            [tagName$9]: StackProps & BaseElementPropsWithChildren<StackElement>;
         }
     }
 }
-declare const tagName$5 = "s-summary";
+declare const tagName$8 = "s-summary";
 interface SummaryProps extends Pick<SummaryProps$1, 'id'> {
 }
 interface SummaryElement extends SummaryProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$5]: SummaryElement;
+        [tagName$8]: SummaryElement;
     }
 }
 declare module 'preact' {
@@ -3429,71 +4769,99 @@ declare module 'preact' {
     }
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$5]: SummaryProps & BaseProps;
+            [tagName$8]: SummaryProps & BaseProps;
+        }
+    }
+}
+declare const tagName$7 = "s-switch";
+interface SwitchElementProps extends Pick<SwitchProps$1, 'accessibilityLabel' | 'checked' | 'command' | 'commandFor' | 'defaultChecked' | 'disabled' | 'id' | 'label' | 'name' | 'value'> {
+    command?: Extract<SwitchProps$1['command'], '--auto' | '--show' | '--hide' | '--toggle'>;
+}
+interface SwitchEvents extends Pick<SwitchProps$1, 'onChange'> {
+}
+interface SwitchElement extends SwitchElementProps, Omit<HTMLElement, 'id' | 'onchange'> {
+    onchange: SwitchEvents['onChange'];
+}
+interface SwitchProps extends SwitchElementProps, SwitchEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$7]: SwitchElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$7]: SwitchProps & BaseElementProps<SwitchElement>;
         }
     }
 }
-declare const tagName$4 = "s-text-area";
-interface TextAreaBaseProps extends Pick<TextAreaProps$1, 'id' | 'label' | 'name' | 'placeholder' | 'required' | 'value' | 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'readOnly' | 'rows' | 'maxLength' | 'minLength' | 'labelAccessibilityVisibility'> {
+declare const tagName$6 = "s-text-area";
+interface TextAreaElementProps extends Pick<TextAreaProps$1, 'id' | 'label' | 'name' | 'required' | 'value' | 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'readOnly' | 'rows' | 'maxLength' | 'minLength' | 'labelAccessibilityVisibility'> {
+    /**
+     * @deprecated Use `label` instead.
+     * @private
+     */
+    placeholder?: string;
 }
 interface TextAreaEvents extends Pick<TextAreaProps$1, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
 }
-interface TextAreaElement extends TextAreaBaseProps, Omit<TextAreaEvents, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'>, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus' | 'oninput'> {
+interface TextAreaElement extends TextAreaElementProps, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus' | 'oninput'> {
     onblur: TextAreaEvents['onBlur'];
     onchange: TextAreaEvents['onChange'];
     onfocus: TextAreaEvents['onFocus'];
     oninput: TextAreaEvents['onInput'];
 }
-interface TextAreaProps extends TextAreaBaseProps, TextAreaEvents {
+interface TextAreaProps extends TextAreaElementProps, TextAreaEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName$4]: TextAreaElement;
+        [tagName$6]: TextAreaElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$4]: TextAreaProps & BaseElementProps<TextAreaElement>;
+            [tagName$6]: TextAreaProps & BaseElementProps<TextAreaElement>;
         }
     }
 }
-declare const tagName$3 = "s-text-field";
-interface TextFieldBaseProps extends Pick<TextFieldProps$1, 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'id' | 'icon' | 'label' | 'labelAccessibilityVisibility' | 'maxLength' | 'minLength' | 'name' | 'placeholder' | 'prefix' | 'readOnly' | 'required' | 'suffix' | 'value'> {
+declare const tagName$5 = "s-text-field";
+interface TextFieldElementProps extends Pick<TextFieldProps$1, 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'id' | 'icon' | 'label' | 'labelAccessibilityVisibility' | 'maxLength' | 'minLength' | 'name' | 'prefix' | 'readOnly' | 'required' | 'suffix' | 'value'> {
     icon?: IconProps['type'];
-}
-interface TextFieldEvents extends Pick<TextFieldProps$1, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
-}
-interface TextFieldSlots {
     /**
-     * Additional content to be displayed in the field.
-     * Commonly used to display an icon that activates a tooltip providing more information.
+     * @deprecated Use `label` instead.
+     * @private
      */
-    accessory?: ReactNode;
+    placeholder?: string;
+}
+interface TextFieldEvents extends Pick<TextFieldProps$1, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
 }
-interface TextFieldElement extends TextFieldBaseProps, TextFieldSlots, Omit<TextFieldEvents, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'>, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus' | 'oninput' | 'prefix'> {
+interface TextFieldElement extends TextFieldElementProps, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus' | 'oninput' | 'prefix'> {
     onblur: TextFieldEvents['onBlur'];
     onchange: TextFieldEvents['onChange'];
     onfocus: TextFieldEvents['onFocus'];
     oninput: TextFieldEvents['onInput'];
 }
-interface TextFieldProps extends TextFieldBaseProps, TextFieldSlots, TextFieldEvents {
+interface TextFieldProps extends TextFieldElementProps, TextFieldEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$5]: TextFieldElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$3]: TextFieldProps & BaseElementProps<TextFieldElement>;
+            [tagName$5]: TextFieldProps & BaseElementPropsWithChildren<TextFieldElement>;
         }
     }
 }
-declare const tagName$2 = "s-text";
+declare const tagName$4 = "s-text";
 interface TextProps extends Pick<TextProps$1, 'accessibilityVisibility' | 'color' | 'dir' | 'display' | 'id' | 'lang' | 'tone' | 'type'> {
     color?: Extract<TextProps$1['color'], 'subdued' | 'base'>;
     tone?: Extract<TextProps$1['tone'], 'auto' | 'neutral' | 'info' | 'success' | 'warning' | 'critical' | 'custom'>;
@@ -3503,48 +4871,97 @@ interface TextElement extends TextProps, Omit<HTMLElement, 'id' | 'dir' | 'lang'
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$4]: TextElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$2]: TextProps & BaseElementPropsWithChildren<TextElement>;
+            [tagName$4]: TextProps & BaseElementPropsWithChildren<TextElement>;
         }
     }
 }
-declare const tagName$1 = "s-time";
-interface TimeProps extends Pick<TimeProps$1, 'dateTime'> {
+declare const tagName$3 = "s-time";
+interface TimeProps extends Pick<TimeProps$1, 'dateTime' | 'id'> {
 }
 interface TimeElement extends TimeProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$3]: TimeElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$3]: TimeProps & BaseElementPropsWithChildren<TimeElement>;
+        }
+    }
+}
+declare const tagName$2 = "s-tooltip";
+interface TooltipElementProps extends Pick<TooltipProps$1, 'id'> {
+}
+interface TooltipElement extends TooltipElementProps {
+}
+interface TooltipProps extends TooltipElementProps {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName$2]: TooltipElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName$1]: TimeProps & BaseElementPropsWithChildren<TimeElement>;
+            [tagName$2]: TooltipProps & BaseElementPropsWithChildren<TooltipElement>;
         }
     }
 }
-declare const tagName = "s-unordered-list";
+declare const tagName$1 = "s-unordered-list";
 interface UnorderedListProps extends UnorderedListProps$1 {
 }
 interface UnorderedListElement extends UnorderedListProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
+        [tagName$1]: UnorderedListElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName$1]: UnorderedListProps & BaseElementPropsWithChildren<UnorderedListElement>;
+        }
+    }
+}
+declare const tagName = "s-url-field";
+interface UrlFieldElementProps extends Pick<URLFieldProps, 'autocomplete' | 'defaultValue' | 'disabled' | 'error' | 'id' | 'label' | 'labelAccessibilityVisibility' | 'maxLength' | 'minLength' | 'name' | 'readOnly' | 'required' | 'value'> {
+}
+interface UrlFieldEvents extends Pick<URLFieldProps, 'onBlur' | 'onChange' | 'onFocus' | 'onInput'> {
+}
+interface UrlFieldElement extends UrlFieldElementProps, Omit<HTMLElement, 'id' | 'onblur' | 'onchange' | 'onfocus' | 'oninput' | 'prefix'> {
+    onblur: UrlFieldEvents['onBlur'];
+    onchange: UrlFieldEvents['onChange'];
+    onfocus: UrlFieldEvents['onFocus'];
+    oninput: UrlFieldEvents['onInput'];
+}
+interface UrlFieldProps extends UrlFieldElementProps, UrlFieldEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName]: UrlFieldElement;
     }
 }
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName]: UnorderedListProps & BaseElementPropsWithChildren<UnorderedListElement>;
+            [tagName]: UrlFieldProps & BaseElementPropsWithChildren<UrlFieldElement>;
         }
     }
 }
-export type { AbbreviationProps, BannerProps, BoxProps, ButtonProps, CheckboxProps, ClickableProps, ClipboardItemProps, DetailsProps, DropZoneProps, EmailFieldProps, FormProps, HeadingProps, IconProps, ImageProps, LinkProps, ListItemProps, MapMarkerProps, MapProps, ModalProps, NumberFieldProps, OptionProps, OrderedListProps, ParagraphProps, PaymentIconProps, PhoneFieldProps, ProductThumbnailProps, ProgressProps, QRCodeProps, SectionProps, SelectProps, SpinnerProps, StackProps, SummaryProps, TextAreaProps, TextFieldProps, TextProps, TimeProps, UnorderedListProps };
+export type { AbbreviationProps, AnnouncementProps, BadgeProps, BannerProps, BoxProps, ButtonProps, CheckboxProps, ChipProps, ChoiceListProps, ChoiceProps, ClickableChipProps, ClickableProps, ClipboardItemProps, ConsentCheckboxProps, ConsentPhoneFieldProps, DateFieldProps, DatePickerProps, DetailsProps, DividerProps, DropZoneProps, EmailFieldProps, FormProps, GridItemProps, GridProps, HeadingProps, IconProps, ImageProps, LinkProps, ListItemProps, MapMarkerProps, MapProps, ModalProps, MoneyFieldProps, NumberFieldProps, OptionProps, OrderedListProps, ParagraphProps, PasswordFieldProps, PaymentIconProps, PhoneFieldProps, PopoverProps, PressButtonProps, ProductThumbnailProps, ProgressProps, QRCodeProps, QueryContainerProps, ScrollBoxProps, SectionProps, SelectProps, SheetProps, SkeletonParagraphProps, SpinnerProps, StackProps, SummaryProps, SwitchProps, TextAreaProps, TextFieldProps, TextProps, TimeProps, TooltipProps, UnorderedListProps, UrlFieldProps };