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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shopify/ui-extensions",
-  "version": "2025.10.0-rc.6",
+  "version": "2025.10.0-rc.8",
   "scripts": {
     "docs:admin": "node ./docs/surfaces/admin/build-docs.mjs",
     "docs:checkout": "bash ./docs/surfaces/checkout/build-docs.sh",

package/src/docs/shared/components/Map.ts

@@ -0,0 +1,12 @@
+import type {SharedReferenceEntityTemplateSchema} from '../docs-type';
+
+const data: SharedReferenceEntityTemplateSchema = {
+  name: 'Map',
+  description:
+    'Use Map to display a map on a page. This component is useful for displaying a map of a location, such as a store or a customer’s address.',
+  category: 'Polaris web components',
+  subCategory: 'Interactive',
+  related: [],
+};
+
+export default data;

package/src/docs/shared/components/MapMarker.ts

@@ -0,0 +1,12 @@
+import type {SharedReferenceEntityTemplateSchema} from '../docs-type';
+
+const data: SharedReferenceEntityTemplateSchema = {
+  name: 'MapMarker',
+  description:
+    'Use MapMarker to display a marker on a map. Use only as a child of `s-map` component.',
+  category: 'Polaris web components',
+  subCategory: 'Interactive',
+  related: [],
+};
+
+export default data;

package/src/docs/shared/components/Modal.ts

@@ -0,0 +1,12 @@
+import type {SharedReferenceEntityTemplateSchema} from '../docs-type';
+
+const data: SharedReferenceEntityTemplateSchema = {
+  name: 'Modal',
+  description:
+    'Use modal to display content in a overlay. This component is useful for creating a distraction-free experience, such as a confirmation dialog or a settings panel.',
+  category: 'Polaris web components',
+  subCategory: 'Overlay',
+  related: [],
+};
+
+export default data;

package/src/docs/shared/components/Option.ts

@@ -0,0 +1,12 @@
+import type {SharedReferenceEntityTemplateSchema} from '../docs-type';
+
+const data: SharedReferenceEntityTemplateSchema = {
+  name: 'Option',
+  description:
+    'Represents a single option within a select component. Use only as a child of `s-select` components.',
+  category: 'Polaris web components',
+  subCategory: 'Forms',
+  related: [],
+};
+
+export default data;

package/src/docs/shared/components/PhoneField.ts

@@ -0,0 +1,11 @@
+import type {SharedReferenceEntityTemplateSchema} from '../docs-type';
+
+const data: SharedReferenceEntityTemplateSchema = {
+  name: 'PhoneField',
+  description: 'Use PhoneField to allow users to enter phone numbers.',
+  category: 'Polaris web components',
+  subCategory: 'Forms',
+  related: [],
+};
+
+export default data;

package/src/docs/shared/components/ProductThumbnail.ts

@@ -0,0 +1,11 @@
+import type {SharedReferenceEntityTemplateSchema} from '../docs-type';
+
+const data: SharedReferenceEntityTemplateSchema = {
+  name: 'ProductThumbnail',
+  description: 'Use ProductThumbnail to display a product thumbnail',
+  category: 'Polaris web components',
+  subCategory: 'Media',
+  related: [],
+};
+
+export default data;

package/src/surfaces/admin/components/AdminAction.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/AdminBlock.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/AdminPrintAction/examples/default.tsx

@@ -1,7 +1,7 @@
 import '@shopify/ui-extensions/preact';
 import {render} from 'preact';
 
-export default function extension() {
+export default async () => {
   render(
     <s-admin-print-action src="https://example.com"></s-admin-print-action>,
     document.body,

package/src/surfaces/admin/components/AdminPrintAction.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Badge.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Banner.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Box.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Button.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Checkbox.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Choice.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/ChoiceList.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Clickable.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/DatePicker.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Divider.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/EmailField.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Form.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Grid.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/GridItem.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

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

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

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

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

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

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

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

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

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

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/MoneyField.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/NumberField.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Option.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/OptionGroup.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

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

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Page.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Paragraph.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/PasswordField.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/QueryContainer.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/SearchField.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Section.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Select.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Spinner.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Stack.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/StandardComponents.ts

@@ -38,6 +38,7 @@ export type StandardComponents =
   | 'Text'
   | 'TextArea'
   | 'TextField'
+  | 'Thumbnail'
   | 'UnorderedList'
   | 'URLField';
 

package/src/surfaces/admin/components/Switch.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Table.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/TableBody.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/TableCell.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/TableHeader.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/TableHeaderRow.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/TableRow.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Text.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/TextArea.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/TextField.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/Thumbnail.d.ts

@@ -0,0 +1,133 @@
+/** VERSION: 1.1.1 **/
+/* eslint-disable import/extensions */
+
+/* eslint-disable @typescript-eslint/no-namespace */
+/* eslint-disable @typescript-eslint/member-ordering */
+
+// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
+/// <reference lib="DOM" />
+import type {ThumbnailProps$1, ComponentChild} from './shared.d.ts';
+
+export interface ThumbnailProps
+  extends Required<Pick<ThumbnailProps$1, 'src' | 'alt'>> {
+  size: Extract<
+    ThumbnailProps$1['size'],
+    'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100'
+  >;
+}
+
+export type CallbackEvent<
+  TTagName extends keyof HTMLElementTagNameMap,
+  TEvent extends Event = Event,
+> = TEvent & {
+  currentTarget: HTMLElementTagNameMap[TTagName];
+};
+export type CallbackEventListener<
+  TTagName extends keyof HTMLElementTagNameMap,
+  TEvent extends Event = Event,
+> =
+  | (EventListener & {
+      (event: CallbackEvent<TTagName, TEvent>): void;
+    })
+  | null;
+/** Used when an element does not have children. */
+export interface PreactBaseElementProps<TClass extends HTMLElement> {
+  /** Assigns a unique key to this element. */
+  key?: preact.Key;
+  /** Assigns a ref (generally from `useRef()`) to this element. */
+  ref?: preact.Ref<TClass>;
+  /** Assigns this element to a parent's slot. */
+  slot?: Lowercase<string>;
+}
+
+export type Styles = string;
+export type RenderImpl = Omit<ShadowRootInit, 'mode'> & {
+  ShadowRoot: (element: any) => ComponentChild;
+  styles?: Styles;
+};
+export interface ActivationEventEsque {
+  shiftKey: boolean;
+  metaKey: boolean;
+  ctrlKey: boolean;
+  button: number;
+}
+export interface ClickOptions {
+  /**
+   * The event you want to influence the synthetic click.
+   */
+  sourceEvent?: ActivationEventEsque;
+}
+/**
+ * Base class for creating custom elements with Preact.
+ * While this class could be used in both Node and the browser, the constructor will only be used in the browser.
+ * So we give it a type of HTMLElement to avoid typing issues later where it's used, which will only happen in the browser.
+ */
+declare const BaseClass: typeof globalThis.HTMLElement;
+declare abstract class PreactCustomElement extends BaseClass {
+  /** @private */
+  static get observedAttributes(): string[];
+  constructor({
+    styles,
+    ShadowRoot: renderFunction,
+    delegatesFocus,
+    ...options
+  }: RenderImpl);
+
+  /** @private */
+  setAttribute(name: string, value: string): void;
+  /** @private */
+  attributeChangedCallback(name: string): void;
+  /** @private */
+  connectedCallback(): void;
+  /** @private */
+  disconnectedCallback(): void;
+  /** @private */
+  adoptedCallback(): void;
+  /**
+   * Queue a run of the render function.
+   * You shouldn't need to call this manually - it should be handled by changes to @property values.
+   * @private
+   */
+  queueRender(): void;
+  /**
+   * Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.
+   *
+   * For example, if the `sourceEvent` was a middle click, or has particular keys held down,
+   * components will attempt to produce the desired behavior on links, such as opening the page in the background tab.
+   * @private
+   * @param options
+   */
+  click({sourceEvent}?: ClickOptions): void;
+}
+
+declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {
+  accessor src: ThumbnailProps['src'];
+  accessor alt: ThumbnailProps['alt'];
+  accessor size: ThumbnailProps['size'];
+  accessor onload: CallbackEventListener<typeof tagName> | null;
+  accessor onerror: OnErrorEventHandler;
+  constructor();
+}
+declare global {
+  interface HTMLElementTagNameMap {
+    [tagName]: Thumbnail;
+  }
+}
+declare module 'preact' {
+  namespace createElement.JSX {
+    interface IntrinsicElements {
+      [tagName]: ThumbnailJSXProps & PreactBaseElementProps<Thumbnail>;
+    }
+  }
+}
+
+declare const tagName = 's-thumbnail';
+export interface ThumbnailJSXProps
+  extends Partial<ThumbnailProps>,
+    Pick<ThumbnailProps$1, 'id'> {
+  onLoad?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+  onError?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+}
+
+export {Thumbnail};
+export type {ThumbnailJSXProps};

package/src/surfaces/admin/components/URLField.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */

package/src/surfaces/admin/components/UnorderedList.d.ts

@@ -1,4 +1,4 @@
-/** VERSION: 1.1.0 **/
+/** VERSION: 1.1.1 **/
 /* eslint-disable import/extensions */
 
 /* eslint-disable @typescript-eslint/no-namespace */