@shopify/ui-extensions 2025.10.0-rc.6 → 2025.10.0-rc.8

package/src/surfaces/checkout/components/Heading.d.ts

@@ -1,32 +1,44 @@
 /** VERSION: 0.0.0 **/
-/* eslint-disable import/extensions */
+/* eslint-disable import-x/extensions */
 /* eslint-disable @typescript-eslint/no-namespace */
 /* eslint-disable @typescript-eslint/member-ordering */
 /* eslint-disable line-comment-position */
 /* eslint-disable @typescript-eslint/unified-signatures */
 /* eslint-disable no-var */
-/* eslint-disable import/namespace */
+/* eslint-disable import-x/namespace */
 // eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
 /// <reference lib="DOM" />
 import type {HeadingProps$1} from './components-shared.d.ts';
 
+/**
+ * Used when an element does not have children.
+ */
+export interface BaseElementProps<TClass = HTMLElement> {
+    key?: preact.Key;
+    ref?: preact.Ref<TClass>;
+    slot?: Lowercase<string>;
+}
+/**
+ * Used when an element has children.
+ */
+export interface BaseElementPropsWithChildren<TClass = HTMLElement> extends BaseElementProps<TClass> {
+    children?: preact.ComponentChildren;
+}
+
+declare const tagName = "s-heading";
 export interface HeadingProps extends Pick<HeadingProps$1, 'accessibilityRole' | 'id'> {
 }
 export interface HeadingElement extends HeadingProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        's-heading': HeadingElement;
+        [tagName]: HeadingElement;
     }
 }
 declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
     namespace createElement.JSX {
         interface IntrinsicElements {
-            's-heading': HeadingProps & BaseProps;
+            [tagName]: HeadingProps & BaseElementPropsWithChildren<HeadingElement>;
         }
     }
 }

package/src/surfaces/checkout/components/Icon.d.ts

@@ -1,34 +1,47 @@
 /** VERSION: 0.0.0 **/
-/* eslint-disable import/extensions */
+/* eslint-disable import-x/extensions */
 /* eslint-disable @typescript-eslint/no-namespace */
 /* eslint-disable @typescript-eslint/member-ordering */
 /* eslint-disable line-comment-position */
 /* eslint-disable @typescript-eslint/unified-signatures */
 /* eslint-disable no-var */
-/* eslint-disable import/namespace */
+/* eslint-disable import-x/namespace */
 // eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
 /// <reference lib="DOM" />
-import type {IconProps$1} from './components-shared.d.ts';
+import type {IconProps$1,IconType} from './components-shared.d.ts';
 
+/**
+ * Used when an element does not have children.
+ */
+export interface BaseElementProps<TClass = HTMLElement> {
+    key?: preact.Key;
+    ref?: preact.Ref<TClass>;
+    slot?: Lowercase<string>;
+}
+/**
+ * The list of available icon types.
+ *
+ * @see https://github.com/Shopify/ui-api-design/blob/main/packages/ui-api-design/src/components/Icon/Icon.ts#L10
+ */
+export 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 tagName = "s-icon";
 export 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'>;
-    type?: '' | Extract<IconProps$1['type'], '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;
 }
 export interface IconElement extends IconProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        's-icon': IconElement;
+        [tagName]: IconElement;
     }
 }
 declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
     namespace createElement.JSX {
         interface IntrinsicElements {
-            's-icon': IconProps & BaseProps;
+            [tagName]: IconProps & BaseElementProps<IconElement>;
         }
     }
 }

package/src/surfaces/checkout/components/Image.d.ts

@@ -1,11 +1,11 @@
 /** VERSION: 0.0.0 **/
-/* eslint-disable import/extensions */
+/* eslint-disable import-x/extensions */
 /* eslint-disable @typescript-eslint/no-namespace */
 /* eslint-disable @typescript-eslint/member-ordering */
 /* eslint-disable line-comment-position */
 /* eslint-disable @typescript-eslint/unified-signatures */
 /* eslint-disable no-var */
-/* eslint-disable import/namespace */
+/* eslint-disable import-x/namespace */
 // eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
 /// <reference lib="DOM" />
 import type {ImageProps$1,BorderSizeKeyword, BorderStyleKeyword,ColorKeyword,MaybeAllValuesShorthandProperty} from './components-shared.d.ts';
@@ -13,7 +13,16 @@ import type {ImageProps$1,BorderSizeKeyword, BorderStyleKeyword,ColorKeyword,May
 export type ReducedBorderSizeKeyword = Extract<BorderSizeKeyword, 'none' | 'base' | 'large' | 'large-100' | 'large-200'>;
 export type ReducedColorKeyword = Extract<ColorKeyword, 'base'>;
 export type BorderShorthand = ReducedBorderSizeKeyword | `${ReducedBorderSizeKeyword} ${ReducedColorKeyword}` | `${ReducedBorderSizeKeyword} ${ReducedColorKeyword} ${BorderStyleKeyword}`;
+/**
+ * Used when an element does not have children.
+ */
+export interface BaseElementProps<TClass = HTMLElement> {
+    key?: preact.Key;
+    ref?: preact.Ref<TClass>;
+    slot?: Lowercase<string>;
+}
 
+declare const tagName = "s-image";
 export 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> | '';
@@ -23,16 +32,13 @@ export interface ImageElement extends ImageProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        's-image': ImageElement;
+        [tagName]: ImageElement;
     }
 }
 declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
     namespace createElement.JSX {
         interface IntrinsicElements {
-            's-image': ImageProps & BaseProps;
+            [tagName]: ImageProps & BaseElementProps<ImageElement>;
         }
     }
 }

package/src/surfaces/checkout/components/Link.d.ts

@@ -1,37 +1,63 @@
 /** VERSION: 0.0.0 **/
-/* eslint-disable import/extensions */
+/* eslint-disable import-x/extensions */
 /* eslint-disable @typescript-eslint/no-namespace */
 /* eslint-disable @typescript-eslint/member-ordering */
 /* eslint-disable line-comment-position */
 /* eslint-disable @typescript-eslint/unified-signatures */
 /* eslint-disable no-var */
-/* eslint-disable import/namespace */
+/* eslint-disable import-x/namespace */
 // eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
 /// <reference lib="DOM" />
 import type {LinkProps$1} from './components-shared.d.ts';
 
-export interface LinkProps extends Pick<LinkProps$1, 'accessibilityLabel' | 'command' | 'commandFor' | 'href' | 'id' | 'lang' | 'onClick' | 'target' | 'tone'> {
-    target?: Extract<LinkProps$1['target'], 'auto' | '_self' | '_blank'>;
+/**
+ * Used when an element does not have children.
+ */
+export interface BaseElementProps<TClass = HTMLElement> {
+    key?: preact.Key;
+    ref?: preact.Ref<TClass>;
+    slot?: Lowercase<string>;
+}
+/**
+ * Used when an element has children.
+ */
+export interface BaseElementPropsWithChildren<TClass = HTMLElement> extends BaseElementProps<TClass> {
+    children?: preact.ComponentChildren;
+}
+export type CallbackEvent<TTagName extends keyof HTMLElementTagNameMap, TEvent extends Event = Event> = TEvent & {
+    currentTarget: HTMLElementTagNameMap[TTagName];
+};
+
+declare const tagName = "s-link";
+export interface LinkBaseProps extends Pick<LinkProps$1, 'accessibilityLabel' | 'command' | 'commandFor' | 'href' | 'id' | 'lang' | 'target' | 'tone'> {
+    target?: Extract<LinkProps$1['target'], 'auto' | '_blank'>;
     tone?: Extract<LinkProps$1['tone'], 'auto' | 'neutral'>;
 }
-export interface LinkElement extends Omit<LinkProps, 'onClick'>, Omit<HTMLElement, 'id' | 'lang' | 'onclick'> {
-    onclick: LinkProps['onClick'];
+export interface LinkEvents extends Pick<LinkProps$1, 'onClick'> {
+}
+export interface LinkElementEvents {
+    /**
+     * Callback when the link is activated.
+     * This will be called before navigating to the location specified by `href`.
+     */
+    click?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+}
+export interface LinkElement extends LinkBaseProps, Omit<LinkEvents, 'onClick'>, Omit<HTMLElement, 'id' | 'lang' | 'onclick'> {
+    onclick: LinkEvents['onClick'];
+}
+export interface LinkProps extends LinkBaseProps, LinkEvents {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        's-link': LinkElement;
+        [tagName]: LinkElement;
     }
 }
 declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
     namespace createElement.JSX {
         interface IntrinsicElements {
-            's-link': LinkProps & BaseProps;
+            [tagName]: LinkProps & BaseElementPropsWithChildren<LinkElement>;
         }
     }
 }
 
-export type { LinkElement, LinkProps };
+export type { LinkBaseProps, LinkElement, LinkElementEvents, LinkEvents, LinkProps };

package/src/surfaces/checkout/components/ListItem.d.ts

@@ -1,34 +1,46 @@
 /** VERSION: 0.0.0 **/
-/* eslint-disable import/extensions */
+/* eslint-disable import-x/extensions */
 /* eslint-disable @typescript-eslint/no-namespace */
 /* eslint-disable @typescript-eslint/member-ordering */
 /* eslint-disable line-comment-position */
 /* eslint-disable @typescript-eslint/unified-signatures */
 /* eslint-disable no-var */
-/* eslint-disable import/namespace */
+/* eslint-disable import-x/namespace */
 // eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
 /// <reference lib="DOM" />
 import type {ListItemProps$1} from './components-shared.d.ts';
 
+/**
+ * Used when an element does not have children.
+ */
+export interface BaseElementProps<TClass = HTMLElement> {
+    key?: preact.Key;
+    ref?: preact.Ref<TClass>;
+    slot?: Lowercase<string>;
+}
+/**
+ * Used when an element has children.
+ */
+export interface BaseElementPropsWithChildren<TClass = HTMLElement> extends BaseElementProps<TClass> {
+    children?: preact.ComponentChildren;
+}
+
+declare const tagName = "s-list-item";
 export interface ListItemProps extends Pick<ListItemProps$1, 'id'> {
 }
-export interface ListItem extends ListItemProps, Omit<HTMLElement, 'id'> {
+export interface ListItemElement extends ListItemProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        's-list-item': ListItem;
+        [tagName]: ListItemElement;
     }
 }
 declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
     namespace createElement.JSX {
         interface IntrinsicElements {
-            's-list-item': ListItemProps & BaseProps;
+            [tagName]: ListItemProps & BaseElementPropsWithChildren<ListItemElement>;
         }
     }
 }
 
-export type { ListItem, ListItemProps };
+export type { ListItemElement, ListItemProps };

package/src/surfaces/checkout/components/Map/examples/basic-map.example.html

@@ -0,0 +1,3 @@
+<s-map apikey="YOUR_API_KEY" latitude="51.5074" longitude="-0.1278">
+  <s-map-marker latitude="51.5074" longitude="-0.1278"></s-map-marker>
+</s-map>

package/src/surfaces/checkout/components/Map.d.ts

@@ -0,0 +1,75 @@
+/** VERSION: 0.0.0 **/
+/* eslint-disable import-x/extensions */
+/* eslint-disable @typescript-eslint/no-namespace */
+/* eslint-disable @typescript-eslint/member-ordering */
+/* eslint-disable line-comment-position */
+/* eslint-disable @typescript-eslint/unified-signatures */
+/* eslint-disable no-var */
+/* eslint-disable import-x/namespace */
+// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
+/// <reference lib="DOM" />
+import type {MapProps$1} from './components-shared.d.ts';
+
+/**
+ * Used when an element does not have children.
+ */
+export interface BaseElementProps<TClass = HTMLElement> {
+    key?: preact.Key;
+    ref?: preact.Ref<TClass>;
+    slot?: Lowercase<string>;
+}
+/**
+ * Used when an element has children.
+ */
+export interface BaseElementPropsWithChildren<TClass = HTMLElement> extends BaseElementProps<TClass> {
+    children?: preact.ComponentChildren;
+}
+export type CallbackEvent<TTagName extends keyof HTMLElementTagNameMap, TEvent extends Event = Event> = TEvent & {
+    currentTarget: HTMLElementTagNameMap[TTagName];
+};
+
+declare const tagName = "s-map";
+export interface MapBaseProps extends Pick<MapProps$1, 'accessibilityLabel' | 'apiKey' | 'blockSize' | 'id' | 'inlineSize' | 'latitude' | 'longitude' | 'maxBlockSize' | 'maxInlineSize' | 'maxZoom' | 'minBlockSize' | 'minInlineSize' | 'minZoom' | 'zoom'> {
+}
+export interface MapEvents extends Pick<MapProps$1, 'onBoundsChange' | 'onClick' | 'onDblClick' | 'onViewChange'> {
+}
+export interface MapElementEvents {
+    /**
+     * Callback when the viewport bounds have changed or the map is resized.
+     */
+    boundschange?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+    /**
+     * Callback when the user clicks on the map.
+     */
+    click?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+    /**
+     * Callback when the user double-clicks on the map.
+     */
+    dblclick?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+    /**
+     * Callback when the map view changes.
+     */
+    viewchange?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+}
+export interface MapElement extends MapBaseProps, Omit<MapEvents, 'onBoundsChange' | 'onClick' | 'onDblClick' | 'onViewChange'>, Omit<HTMLElement, 'id' | 'onclick' | 'ondblclick'> {
+    onboundschange: MapEvents['onBoundsChange'];
+    onclick: MapEvents['onClick'];
+    ondblclick: MapEvents['onDblClick'];
+    onviewchange: MapEvents['onViewChange'];
+}
+export interface MapProps extends MapBaseProps, MapEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName]: MapElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName]: MapProps & BaseElementPropsWithChildren<MapElement>;
+        }
+    }
+}
+
+export type { MapBaseProps, MapElement, MapElementEvents, MapEvents, MapProps };

package/src/surfaces/checkout/components/MapMarker.d.ts

@@ -0,0 +1,73 @@
+/** VERSION: 0.0.0 **/
+/* eslint-disable import-x/extensions */
+/* eslint-disable @typescript-eslint/no-namespace */
+/* eslint-disable @typescript-eslint/member-ordering */
+/* eslint-disable line-comment-position */
+/* eslint-disable @typescript-eslint/unified-signatures */
+/* eslint-disable no-var */
+/* eslint-disable import-x/namespace */
+// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
+/// <reference lib="DOM" />
+import type {MapMarkerProps$1} from './components-shared.d.ts';
+import { ReactNode } from 'react';
+
+/**
+ * Used when an element does not have children.
+ */
+export interface BaseElementProps<TClass = HTMLElement> {
+    key?: preact.Key;
+    ref?: preact.Ref<TClass>;
+    slot?: Lowercase<string>;
+}
+export type CallbackEvent<TTagName extends keyof HTMLElementTagNameMap, TEvent extends Event = Event> = TEvent & {
+    currentTarget: HTMLElementTagNameMap[TTagName];
+};
+
+declare const tagName = "s-map-marker";
+export interface MapMarkerBaseProps extends Pick<MapMarkerProps$1, 'accessibilityLabel' | 'blockSize' | 'clusterable' | 'inlineSize' | 'latitude' | 'longitude'> {
+}
+export interface MapMarkerEvents extends Pick<MapMarkerProps$1, 'onClick'> {
+}
+export interface MapMarkerElementEvents {
+    /**
+     * Callback when a marker is clicked.
+     *
+     * It does not trigger a click event on the map itself.
+     */
+    click?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+}
+export interface MapMarkerSlots {
+    /**
+     * The graphic to use as the marker.
+     *
+     * If unset, it will default to the provider’s default marker.
+     */
+    graphic?: ReactNode;
+}
+export interface MapMarkerElementSlots {
+    /**
+     * The graphic to use as the marker.
+     *
+     * If unset, it will default to the provider’s default marker.
+     */
+    graphic?: HTMLElement;
+}
+export interface MapMarkerElement extends MapMarkerBaseProps, MapMarkerSlots, Omit<HTMLElement, 'id' | 'onclick'> {
+    onclick: MapMarkerEvents['onClick'];
+}
+export interface MapMarkerProps extends MapMarkerBaseProps, MapMarkerEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName]: MapMarkerElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName]: MapMarkerProps & BaseElementProps<MapMarkerElement>;
+        }
+    }
+}
+
+export type { MapMarkerBaseProps, MapMarkerElement, MapMarkerElementEvents, MapMarkerElementSlots, MapMarkerEvents, MapMarkerProps, MapMarkerSlots };

package/src/surfaces/checkout/components/Modal/examples/basic-modal.example.html

@@ -0,0 +1,20 @@
+<s-button command="--show" commandfor="modal-1">Add Product</s-button>
+<s-modal id="modal-1" heading="Return Policy">
+  <s-paragraph>
+    We have a 30-day return policy, which means you have 30 days after receiving
+    your item to request a return.
+  </s-paragraph>
+  <s-paragraph>
+    To be eligible for a return, your item must be in the same condition that
+    you received it, unworn or unused, with tags, and in its original packaging.
+    You’ll also need the receipt or proof of purchase.
+  </s-paragraph>
+  <s-button
+    kind="primary"
+    command="--hide"
+    commandfor="modal-1"
+    slot="primary-action"
+  >
+    Close
+  </s-button>
+</s-modal>

package/src/surfaces/checkout/components/Modal.d.ts

@@ -0,0 +1,87 @@
+/** VERSION: 0.0.0 **/
+/* eslint-disable import-x/extensions */
+/* eslint-disable @typescript-eslint/no-namespace */
+/* eslint-disable @typescript-eslint/member-ordering */
+/* eslint-disable line-comment-position */
+/* eslint-disable @typescript-eslint/unified-signatures */
+/* eslint-disable no-var */
+/* eslint-disable import-x/namespace */
+// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
+/// <reference lib="DOM" />
+import type {ModalProps$1} from './components-shared.d.ts';
+import { ReactNode } from 'react';
+
+/**
+ * Used when an element does not have children.
+ */
+export interface BaseElementProps<TClass = HTMLElement> {
+    key?: preact.Key;
+    ref?: preact.Ref<TClass>;
+    slot?: Lowercase<string>;
+}
+/**
+ * Used when an element has children.
+ */
+export interface BaseElementPropsWithChildren<TClass = HTMLElement> extends BaseElementProps<TClass> {
+    children?: preact.ComponentChildren;
+}
+export type CallbackEvent<TTagName extends keyof HTMLElementTagNameMap, TEvent extends Event = Event> = TEvent & {
+    currentTarget: HTMLElementTagNameMap[TTagName];
+};
+
+declare const tagName = "s-modal";
+export interface ModalBaseProps extends Pick<ModalProps$1, 'accessibilityLabel' | 'heading' | 'id' | 'padding' | 'size'> {
+    size?: Extract<ModalProps$1['size'], 'small-100' | 'small' | 'base' | 'large-100' | 'large' | 'max'>;
+}
+export 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;
+}
+export interface ModalElementSlots {
+    /**
+     * The primary action to perform, provided as a button type element.
+     */
+    'primary-action'?: HTMLElement;
+    /**
+     * The secondary actions to perform, provided as button type elements.
+     */
+    'secondary-actions'?: HTMLElement;
+}
+export interface ModalEvents extends Pick<ModalProps$1, 'onHide' | 'onShow' | 'onAfterHide' | 'onAfterShow'> {
+}
+export interface ModalElementEvents {
+    /**
+     * Callback fired after the overlay is hidden.
+     */
+    hide?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+    /**
+     * Callback fired after the overlay is shown.
+     */
+    show?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+}
+export interface ModalElement extends ModalBaseProps, ModalSlots, Omit<ModalEvents, 'onHide' | 'onShow'>, Omit<HTMLElement, 'id'> {
+    onhide: ModalEvents['onHide'];
+    onshow: ModalEvents['onShow'];
+}
+export interface ModalProps extends ModalBaseProps, ModalSlots, ModalEvents {
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName]: ModalElement;
+    }
+}
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName]: ModalProps & BaseElementPropsWithChildren<ModalElement>;
+        }
+    }
+}
+
+export type { ModalBaseProps, ModalElement, ModalElementEvents, ModalElementSlots, ModalProps, ModalSlots };

package/src/surfaces/checkout/components/OrderedList.d.ts

@@ -1,32 +1,44 @@
 /** VERSION: 0.0.0 **/
-/* eslint-disable import/extensions */
+/* eslint-disable import-x/extensions */
 /* eslint-disable @typescript-eslint/no-namespace */
 /* eslint-disable @typescript-eslint/member-ordering */
 /* eslint-disable line-comment-position */
 /* eslint-disable @typescript-eslint/unified-signatures */
 /* eslint-disable no-var */
-/* eslint-disable import/namespace */
+/* eslint-disable import-x/namespace */
 // eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
 /// <reference lib="DOM" />
 import type {OrderedListProps$1} from './components-shared.d.ts';
 
+/**
+ * Used when an element does not have children.
+ */
+export interface BaseElementProps<TClass = HTMLElement> {
+    key?: preact.Key;
+    ref?: preact.Ref<TClass>;
+    slot?: Lowercase<string>;
+}
+/**
+ * Used when an element has children.
+ */
+export interface BaseElementPropsWithChildren<TClass = HTMLElement> extends BaseElementProps<TClass> {
+    children?: preact.ComponentChildren;
+}
+
+declare const tagName = "s-ordered-list";
 export interface OrderedListProps extends OrderedListProps$1 {
 }
 export interface OrderedListElement extends OrderedListProps, Omit<HTMLElement, 'id'> {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        's-ordered-list': OrderedListElement;
+        [tagName]: OrderedListElement;
     }
 }
 declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
     namespace createElement.JSX {
         interface IntrinsicElements {
-            's-ordered-list': OrderedListProps & BaseProps;
+            [tagName]: OrderedListProps & BaseElementPropsWithChildren<OrderedListElement>;
         }
     }
 }