@shopify/ui-extensions 2025.10.0-rc.7 → 2025.10.0-rc.9

package/build/ts/surfaces/admin/targets/admin.customer-details.action.render.d.ts

@@ -150,6 +150,58 @@ export interface UnorderedListProps extends UnorderedListProps$1 {
 declare const UnorderedListtagName = 's-unordered-list';
 declare const UnorderedListBaseClass: typeof globalThis.HTMLElement;
 
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [ThumbnailtagName]: ThumbnailJSXProps & ThumbnailPreactBaseElementProps<Thumbnail>;
+        }
+    }
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        [ThumbnailtagName]: Thumbnail;
+    }
+}
+
+export interface ThumbnailJSXProps extends Partial<ThumbnailProps>, Pick<ThumbnailProps$1, 'id'> {
+    onLoad?: ((event: CallbackEvent<typeof ThumbnailtagName>) => void) | null;
+    onError?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+}
+
+export interface ThumbnailClickOptions {
+    /**
+     * The event you want to influence the synthetic click.
+     */
+    sourceEvent?: ThumbnailActivationEventEsque;
+}
+
+export interface ThumbnailActivationEventEsque {
+    shiftKey: boolean;
+    metaKey: boolean;
+    ctrlKey: boolean;
+    button: number;
+}
+
+export interface ThumbnailPreactBaseElementProps<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 interface ThumbnailProps extends Required<Pick<ThumbnailProps$1, 'src' | 'alt'>> {
+    size: Extract<
+        ThumbnailProps$1['size'],
+        'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100'
+        >;
+}
+
+declare const ThumbnailtagName = 's-thumbnail';
+declare const ThumbnailBaseClass: typeof globalThis.HTMLElement;
+
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
@@ -3378,25 +3430,25 @@ declare const BannerBaseClass: typeof globalThis.HTMLElement;
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName]: BadgeJSXProps & PreactBaseElementPropsWithChildren<Badge>;
+            [BadgetagName]: BadgeJSXProps & BadgePreactBaseElementPropsWithChildren<Badge>;
         }
     }
 }
 
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName]: Badge;
+        [BadgetagName]: Badge;
     }
 }
 
 export interface BadgeJSXProps extends Partial<BadgeProps>, Pick<BadgeProps$1, 'id'> {
 }
 
-export interface PreactBaseElementPropsWithChildren<TClass extends HTMLElement> extends PreactBaseElementProps<TClass> {
+export interface BadgePreactBaseElementPropsWithChildren<TClass extends HTMLElement> extends BadgePreactBaseElementProps<TClass> {
     children?: preact.ComponentChildren;
 }
 
-export interface PreactBaseElementProps<TClass extends HTMLElement> {
+export interface BadgePreactBaseElementProps<TClass extends HTMLElement> {
     /** Assigns a unique key to this element. */
     key?: preact.Key;
     /** Assigns a ref (generally from `useRef()`) to this element. */
@@ -3405,14 +3457,14 @@ export interface PreactBaseElementProps<TClass extends HTMLElement> {
     slot?: Lowercase<string>;
 }
 
-export interface ClickOptions {
+export interface BadgeClickOptions {
     /**
      * The event you want to influence the synthetic click.
      */
-    sourceEvent?: ActivationEventEsque;
+    sourceEvent?: BadgeActivationEventEsque;
 }
 
-export interface ActivationEventEsque {
+export interface BadgeActivationEventEsque {
     shiftKey: boolean;
     metaKey: boolean;
     ctrlKey: boolean;
@@ -3442,7 +3494,63 @@ export interface IconProps extends Pick<IconProps$1, 'type' | 'tone' | 'color' |
     size: Extract<IconProps$1['size'], 'small' | 'base'>;
 }
 
-declare const tagName = 's-badge';
+declare const BadgetagName = 's-badge';
+declare const BadgeBaseClass: typeof globalThis.HTMLElement;
+
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName]: AvatarJSXProps & PreactBaseElementPropsWithChildren<Avatar>;
+        }
+    }
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName]: Avatar;
+    }
+}
+
+export interface AvatarJSXProps extends Partial<AvatarProps>, Pick<AvatarProps$1, 'id'> {
+    onLoad?: () => void;
+    onError?: () => void;
+}
+
+export interface PreactBaseElementPropsWithChildren<TClass extends HTMLElement> extends PreactBaseElementProps<TClass> {
+    children?: preact.ComponentChildren;
+}
+
+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 interface ClickOptions {
+    /**
+     * The event you want to influence the synthetic click.
+     */
+    sourceEvent?: ActivationEventEsque;
+}
+
+export interface ActivationEventEsque {
+    shiftKey: boolean;
+    metaKey: boolean;
+    ctrlKey: boolean;
+    button: number;
+}
+
+export interface AvatarProps extends Required<Pick<AvatarProps$1, 'initials' | 'src' | 'alt'>> {
+    size: Extract<
+        AvatarProps$1['size'],
+        'small-200' | 'small' | 'base' | 'large' | 'large-200'
+        >;
+}
+
+declare const tagName = 's-avatar';
 /**
  * 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.
@@ -3451,8 +3559,9 @@ declare const tagName = 's-badge';
 declare const BaseClass: typeof globalThis.HTMLElement;
 
 import { AdminAction } from "../../../../../src/surfaces/admin/components/AdminAction";
-import { Badge, RenderImpl } from "../../../../../src/surfaces/admin/components/Badge";
-import { Banner, CallbackEvent, RequiredBannerProps } from "../../../../../src/surfaces/admin/components/Banner";
+import { Avatar, CallbackEvent, RenderImpl } from "../../../../../src/surfaces/admin/components/Avatar";
+import { Badge } from "../../../../../src/surfaces/admin/components/Badge";
+import { Banner, RequiredBannerProps } from "../../../../../src/surfaces/admin/components/Banner";
 import { Box, BoxBorderRadii, BoxBorderStyles, RequiredBoxProps, ResponsiveBoxProps } from "../../../../../src/surfaces/admin/components/Box";
 import { Button, ButtonBaseProps } from "../../../../../src/surfaces/admin/components/Button";
 import { Checkbox, PreactInputProps } from "../../../../../src/surfaces/admin/components/Checkbox";
@@ -3477,7 +3586,7 @@ import { PasswordField, PasswordFieldProps } from "../../../../../src/surfaces/a
 import { QueryContainer } from "../../../../../src/surfaces/admin/components/QueryContainer";
 import { RequiredSectionProps, Section } from "../../../../../src/surfaces/admin/components/Section";
 import { Select } from "../../../../../src/surfaces/admin/components/Select";
-import { AdminActionProps$1, BadgeProps$1, BannerProps$1, BoxProps$1, ButtonProps$1, CheckboxProps$1, ChoiceListProps$1, ChoiceProps$1, ClickableProps$1, ComponentChild, DatePickerProps$1, DividerProps$1, EmailFieldProps$1, GridItemProps$1, GridProps$1, HeadingProps$1, IconProps$1, IconType, ImageProps$1, InteractionProps, LinkProps$1, ListItemProps$1, MaybeAllValuesShorthandProperty, MoneyFieldProps$1, NumberFieldProps$1, OptionGroupProps$1, OptionProps$1, OrderedListProps$1, ParagraphProps$1, PasswordFieldProps$1, QueryContainerProps$1, SectionProps$1, SelectProps$1, SpinnerProps$1, StackProps$1, TableBodyProps$1, TableCellProps$1, TableHeaderProps$1, TableHeaderRowProps$1, TableProps$1, TableRowProps$1, TextAreaProps$1, TextFieldProps$1, TextProps$1, URLFieldProps$1, UnorderedListProps$1 } from "../../../../../src/surfaces/admin/components/shared";
+import { AdminActionProps$1, AvatarProps$1, BadgeProps$1, BannerProps$1, BoxProps$1, ButtonProps$1, CheckboxProps$1, ChoiceListProps$1, ChoiceProps$1, ClickableProps$1, ComponentChild, DatePickerProps$1, DividerProps$1, EmailFieldProps$1, GridItemProps$1, GridProps$1, HeadingProps$1, IconProps$1, IconType, ImageProps$1, InteractionProps, LinkProps$1, ListItemProps$1, MaybeAllValuesShorthandProperty, MoneyFieldProps$1, NumberFieldProps$1, OptionGroupProps$1, OptionProps$1, OrderedListProps$1, ParagraphProps$1, PasswordFieldProps$1, QueryContainerProps$1, SectionProps$1, SelectProps$1, SpinnerProps$1, StackProps$1, TableBodyProps$1, TableCellProps$1, TableHeaderProps$1, TableHeaderRowProps$1, TableProps$1, TableRowProps$1, TextAreaProps$1, TextFieldProps$1, TextProps$1, ThumbnailProps$1, URLFieldProps$1, UnorderedListProps$1 } from "../../../../../src/surfaces/admin/components/shared";
 import { Spinner } from "../../../../../src/surfaces/admin/components/Spinner";
 import { AlignedStackProps, ResponsiveStackProps, Stack } from "../../../../../src/surfaces/admin/components/Stack";
 import { Table } from "../../../../../src/surfaces/admin/components/Table";
@@ -3488,6 +3597,7 @@ import { TableHeaderRow } from "../../../../../src/surfaces/admin/components/Tab
 import { TableRow } from "../../../../../src/surfaces/admin/components/TableRow";
 import { TextArea, TextAreaProps } from "../../../../../src/surfaces/admin/components/TextArea";
 import { TextField, TextFieldProps } from "../../../../../src/surfaces/admin/components/TextField";
+import { Thumbnail } from "../../../../../src/surfaces/admin/components/Thumbnail";
 import { UnorderedList } from "../../../../../src/surfaces/admin/components/UnorderedList";
 import { URLField, URLFieldProps } from "../../../../../src/surfaces/admin/components/URLField";
 import type { ExtensionTargets } from '../extension-targets';

package/build/ts/surfaces/admin/targets/admin.customer-details.block.render.d.ts

@@ -191,6 +191,58 @@ export interface UnorderedListProps extends UnorderedListProps$1 {
 declare const UnorderedListtagName = 's-unordered-list';
 declare const UnorderedListBaseClass: typeof globalThis.HTMLElement;
 
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [ThumbnailtagName]: ThumbnailJSXProps & ThumbnailPreactBaseElementProps<Thumbnail>;
+        }
+    }
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        [ThumbnailtagName]: Thumbnail;
+    }
+}
+
+export interface ThumbnailJSXProps extends Partial<ThumbnailProps>, Pick<ThumbnailProps$1, 'id'> {
+    onLoad?: ((event: CallbackEvent<typeof ThumbnailtagName>) => void) | null;
+    onError?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+}
+
+export interface ThumbnailClickOptions {
+    /**
+     * The event you want to influence the synthetic click.
+     */
+    sourceEvent?: ThumbnailActivationEventEsque;
+}
+
+export interface ThumbnailActivationEventEsque {
+    shiftKey: boolean;
+    metaKey: boolean;
+    ctrlKey: boolean;
+    button: number;
+}
+
+export interface ThumbnailPreactBaseElementProps<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 interface ThumbnailProps extends Required<Pick<ThumbnailProps$1, 'src' | 'alt'>> {
+    size: Extract<
+        ThumbnailProps$1['size'],
+        'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100'
+        >;
+}
+
+declare const ThumbnailtagName = 's-thumbnail';
+declare const ThumbnailBaseClass: typeof globalThis.HTMLElement;
+
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
@@ -3419,25 +3471,25 @@ declare const BannerBaseClass: typeof globalThis.HTMLElement;
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName]: BadgeJSXProps & PreactBaseElementPropsWithChildren<Badge>;
+            [BadgetagName]: BadgeJSXProps & BadgePreactBaseElementPropsWithChildren<Badge>;
         }
     }
 }
 
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName]: Badge;
+        [BadgetagName]: Badge;
     }
 }
 
 export interface BadgeJSXProps extends Partial<BadgeProps>, Pick<BadgeProps$1, 'id'> {
 }
 
-export interface PreactBaseElementPropsWithChildren<TClass extends HTMLElement> extends PreactBaseElementProps<TClass> {
+export interface BadgePreactBaseElementPropsWithChildren<TClass extends HTMLElement> extends BadgePreactBaseElementProps<TClass> {
     children?: preact.ComponentChildren;
 }
 
-export interface PreactBaseElementProps<TClass extends HTMLElement> {
+export interface BadgePreactBaseElementProps<TClass extends HTMLElement> {
     /** Assigns a unique key to this element. */
     key?: preact.Key;
     /** Assigns a ref (generally from `useRef()`) to this element. */
@@ -3446,14 +3498,14 @@ export interface PreactBaseElementProps<TClass extends HTMLElement> {
     slot?: Lowercase<string>;
 }
 
-export interface ClickOptions {
+export interface BadgeClickOptions {
     /**
      * The event you want to influence the synthetic click.
      */
-    sourceEvent?: ActivationEventEsque;
+    sourceEvent?: BadgeActivationEventEsque;
 }
 
-export interface ActivationEventEsque {
+export interface BadgeActivationEventEsque {
     shiftKey: boolean;
     metaKey: boolean;
     ctrlKey: boolean;
@@ -3483,7 +3535,63 @@ export interface IconProps extends Pick<IconProps$1, 'type' | 'tone' | 'color' |
     size: Extract<IconProps$1['size'], 'small' | 'base'>;
 }
 
-declare const tagName = 's-badge';
+declare const BadgetagName = 's-badge';
+declare const BadgeBaseClass: typeof globalThis.HTMLElement;
+
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName]: AvatarJSXProps & PreactBaseElementPropsWithChildren<Avatar>;
+        }
+    }
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName]: Avatar;
+    }
+}
+
+export interface AvatarJSXProps extends Partial<AvatarProps>, Pick<AvatarProps$1, 'id'> {
+    onLoad?: () => void;
+    onError?: () => void;
+}
+
+export interface PreactBaseElementPropsWithChildren<TClass extends HTMLElement> extends PreactBaseElementProps<TClass> {
+    children?: preact.ComponentChildren;
+}
+
+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 interface ClickOptions {
+    /**
+     * The event you want to influence the synthetic click.
+     */
+    sourceEvent?: ActivationEventEsque;
+}
+
+export interface ActivationEventEsque {
+    shiftKey: boolean;
+    metaKey: boolean;
+    ctrlKey: boolean;
+    button: number;
+}
+
+export interface AvatarProps extends Required<Pick<AvatarProps$1, 'initials' | 'src' | 'alt'>> {
+    size: Extract<
+        AvatarProps$1['size'],
+        'small-200' | 'small' | 'base' | 'large' | 'large-200'
+        >;
+}
+
+declare const tagName = 's-avatar';
 /**
  * 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.
@@ -3492,8 +3600,9 @@ declare const tagName = 's-badge';
 declare const BaseClass: typeof globalThis.HTMLElement;
 
 import { AdminBlock } from "../../../../../src/surfaces/admin/components/AdminBlock";
-import { Badge, RenderImpl } from "../../../../../src/surfaces/admin/components/Badge";
-import { Banner, CallbackEvent, RequiredBannerProps } from "../../../../../src/surfaces/admin/components/Banner";
+import { Avatar, CallbackEvent, RenderImpl } from "../../../../../src/surfaces/admin/components/Avatar";
+import { Badge } from "../../../../../src/surfaces/admin/components/Badge";
+import { Banner, RequiredBannerProps } from "../../../../../src/surfaces/admin/components/Banner";
 import { Box, BoxBorderRadii, BoxBorderStyles, RequiredBoxProps, ResponsiveBoxProps } from "../../../../../src/surfaces/admin/components/Box";
 import { Button, ButtonBaseProps } from "../../../../../src/surfaces/admin/components/Button";
 import { Checkbox, PreactInputProps } from "../../../../../src/surfaces/admin/components/Checkbox";
@@ -3519,7 +3628,7 @@ import { PasswordField, PasswordFieldProps } from "../../../../../src/surfaces/a
 import { QueryContainer } from "../../../../../src/surfaces/admin/components/QueryContainer";
 import { RequiredSectionProps, Section } from "../../../../../src/surfaces/admin/components/Section";
 import { Select } from "../../../../../src/surfaces/admin/components/Select";
-import { AdminBlockProps$1, BadgeProps$1, BannerProps$1, BoxProps$1, ButtonProps$1, CheckboxProps$1, ChoiceListProps$1, ChoiceProps$1, ClickableProps$1, ComponentChild, DatePickerProps$1, DividerProps$1, EmailFieldProps$1, GridItemProps$1, GridProps$1, HeadingProps$1, IconProps$1, IconType, ImageProps$1, InteractionProps, LinkProps$1, ListItemProps$1, MaybeAllValuesShorthandProperty, MoneyFieldProps$1, NumberFieldProps$1, OptionGroupProps$1, OptionProps$1, OrderedListProps$1, ParagraphProps$1, PasswordFieldProps$1, QueryContainerProps$1, SectionProps$1, SelectProps$1, SpinnerProps$1, StackProps$1, TableBodyProps$1, TableCellProps$1, TableHeaderProps$1, TableHeaderRowProps$1, TableProps$1, TableRowProps$1, TextAreaProps$1, TextFieldProps$1, TextProps$1, URLFieldProps$1, UnorderedListProps$1 } from "../../../../../src/surfaces/admin/components/shared";
+import { AdminBlockProps$1, AvatarProps$1, BadgeProps$1, BannerProps$1, BoxProps$1, ButtonProps$1, CheckboxProps$1, ChoiceListProps$1, ChoiceProps$1, ClickableProps$1, ComponentChild, DatePickerProps$1, DividerProps$1, EmailFieldProps$1, GridItemProps$1, GridProps$1, HeadingProps$1, IconProps$1, IconType, ImageProps$1, InteractionProps, LinkProps$1, ListItemProps$1, MaybeAllValuesShorthandProperty, MoneyFieldProps$1, NumberFieldProps$1, OptionGroupProps$1, OptionProps$1, OrderedListProps$1, ParagraphProps$1, PasswordFieldProps$1, QueryContainerProps$1, SectionProps$1, SelectProps$1, SpinnerProps$1, StackProps$1, TableBodyProps$1, TableCellProps$1, TableHeaderProps$1, TableHeaderRowProps$1, TableProps$1, TableRowProps$1, TextAreaProps$1, TextFieldProps$1, TextProps$1, ThumbnailProps$1, URLFieldProps$1, UnorderedListProps$1 } from "../../../../../src/surfaces/admin/components/shared";
 import { Spinner } from "../../../../../src/surfaces/admin/components/Spinner";
 import { AlignedStackProps, ResponsiveStackProps, Stack } from "../../../../../src/surfaces/admin/components/Stack";
 import { Table } from "../../../../../src/surfaces/admin/components/Table";
@@ -3530,6 +3639,7 @@ import { TableHeaderRow } from "../../../../../src/surfaces/admin/components/Tab
 import { TableRow } from "../../../../../src/surfaces/admin/components/TableRow";
 import { TextArea, TextAreaProps } from "../../../../../src/surfaces/admin/components/TextArea";
 import { TextField, TextFieldProps } from "../../../../../src/surfaces/admin/components/TextField";
+import { Thumbnail } from "../../../../../src/surfaces/admin/components/Thumbnail";
 import { UnorderedList } from "../../../../../src/surfaces/admin/components/UnorderedList";
 import { URLField, URLFieldProps } from "../../../../../src/surfaces/admin/components/URLField";
 import type { ExtensionTargets } from '../extension-targets';

package/build/ts/surfaces/admin/targets/admin.customer-index.action.render.d.ts

@@ -150,6 +150,58 @@ export interface UnorderedListProps extends UnorderedListProps$1 {
 declare const UnorderedListtagName = 's-unordered-list';
 declare const UnorderedListBaseClass: typeof globalThis.HTMLElement;
 
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [ThumbnailtagName]: ThumbnailJSXProps & ThumbnailPreactBaseElementProps<Thumbnail>;
+        }
+    }
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        [ThumbnailtagName]: Thumbnail;
+    }
+}
+
+export interface ThumbnailJSXProps extends Partial<ThumbnailProps>, Pick<ThumbnailProps$1, 'id'> {
+    onLoad?: ((event: CallbackEvent<typeof ThumbnailtagName>) => void) | null;
+    onError?: ((event: CallbackEvent<typeof tagName>) => void) | null;
+}
+
+export interface ThumbnailClickOptions {
+    /**
+     * The event you want to influence the synthetic click.
+     */
+    sourceEvent?: ThumbnailActivationEventEsque;
+}
+
+export interface ThumbnailActivationEventEsque {
+    shiftKey: boolean;
+    metaKey: boolean;
+    ctrlKey: boolean;
+    button: number;
+}
+
+export interface ThumbnailPreactBaseElementProps<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 interface ThumbnailProps extends Required<Pick<ThumbnailProps$1, 'src' | 'alt'>> {
+    size: Extract<
+        ThumbnailProps$1['size'],
+        'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100'
+        >;
+}
+
+declare const ThumbnailtagName = 's-thumbnail';
+declare const ThumbnailBaseClass: typeof globalThis.HTMLElement;
+
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
@@ -3378,25 +3430,25 @@ declare const BannerBaseClass: typeof globalThis.HTMLElement;
 declare module 'preact' {
     namespace createElement.JSX {
         interface IntrinsicElements {
-            [tagName]: BadgeJSXProps & PreactBaseElementPropsWithChildren<Badge>;
+            [BadgetagName]: BadgeJSXProps & BadgePreactBaseElementPropsWithChildren<Badge>;
         }
     }
 }
 
 declare global {
     interface HTMLElementTagNameMap {
-        [tagName]: Badge;
+        [BadgetagName]: Badge;
     }
 }
 
 export interface BadgeJSXProps extends Partial<BadgeProps>, Pick<BadgeProps$1, 'id'> {
 }
 
-export interface PreactBaseElementPropsWithChildren<TClass extends HTMLElement> extends PreactBaseElementProps<TClass> {
+export interface BadgePreactBaseElementPropsWithChildren<TClass extends HTMLElement> extends BadgePreactBaseElementProps<TClass> {
     children?: preact.ComponentChildren;
 }
 
-export interface PreactBaseElementProps<TClass extends HTMLElement> {
+export interface BadgePreactBaseElementProps<TClass extends HTMLElement> {
     /** Assigns a unique key to this element. */
     key?: preact.Key;
     /** Assigns a ref (generally from `useRef()`) to this element. */
@@ -3405,14 +3457,14 @@ export interface PreactBaseElementProps<TClass extends HTMLElement> {
     slot?: Lowercase<string>;
 }
 
-export interface ClickOptions {
+export interface BadgeClickOptions {
     /**
      * The event you want to influence the synthetic click.
      */
-    sourceEvent?: ActivationEventEsque;
+    sourceEvent?: BadgeActivationEventEsque;
 }
 
-export interface ActivationEventEsque {
+export interface BadgeActivationEventEsque {
     shiftKey: boolean;
     metaKey: boolean;
     ctrlKey: boolean;
@@ -3442,7 +3494,63 @@ export interface IconProps extends Pick<IconProps$1, 'type' | 'tone' | 'color' |
     size: Extract<IconProps$1['size'], 'small' | 'base'>;
 }
 
-declare const tagName = 's-badge';
+declare const BadgetagName = 's-badge';
+declare const BadgeBaseClass: typeof globalThis.HTMLElement;
+
+declare module 'preact' {
+    namespace createElement.JSX {
+        interface IntrinsicElements {
+            [tagName]: AvatarJSXProps & PreactBaseElementPropsWithChildren<Avatar>;
+        }
+    }
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        [tagName]: Avatar;
+    }
+}
+
+export interface AvatarJSXProps extends Partial<AvatarProps>, Pick<AvatarProps$1, 'id'> {
+    onLoad?: () => void;
+    onError?: () => void;
+}
+
+export interface PreactBaseElementPropsWithChildren<TClass extends HTMLElement> extends PreactBaseElementProps<TClass> {
+    children?: preact.ComponentChildren;
+}
+
+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 interface ClickOptions {
+    /**
+     * The event you want to influence the synthetic click.
+     */
+    sourceEvent?: ActivationEventEsque;
+}
+
+export interface ActivationEventEsque {
+    shiftKey: boolean;
+    metaKey: boolean;
+    ctrlKey: boolean;
+    button: number;
+}
+
+export interface AvatarProps extends Required<Pick<AvatarProps$1, 'initials' | 'src' | 'alt'>> {
+    size: Extract<
+        AvatarProps$1['size'],
+        'small-200' | 'small' | 'base' | 'large' | 'large-200'
+        >;
+}
+
+declare const tagName = 's-avatar';
 /**
  * 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.
@@ -3451,8 +3559,9 @@ declare const tagName = 's-badge';
 declare const BaseClass: typeof globalThis.HTMLElement;
 
 import { AdminAction } from "../../../../../src/surfaces/admin/components/AdminAction";
-import { Badge, RenderImpl } from "../../../../../src/surfaces/admin/components/Badge";
-import { Banner, CallbackEvent, RequiredBannerProps } from "../../../../../src/surfaces/admin/components/Banner";
+import { Avatar, CallbackEvent, RenderImpl } from "../../../../../src/surfaces/admin/components/Avatar";
+import { Badge } from "../../../../../src/surfaces/admin/components/Badge";
+import { Banner, RequiredBannerProps } from "../../../../../src/surfaces/admin/components/Banner";
 import { Box, BoxBorderRadii, BoxBorderStyles, RequiredBoxProps, ResponsiveBoxProps } from "../../../../../src/surfaces/admin/components/Box";
 import { Button, ButtonBaseProps } from "../../../../../src/surfaces/admin/components/Button";
 import { Checkbox, PreactInputProps } from "../../../../../src/surfaces/admin/components/Checkbox";
@@ -3477,7 +3586,7 @@ import { PasswordField, PasswordFieldProps } from "../../../../../src/surfaces/a
 import { QueryContainer } from "../../../../../src/surfaces/admin/components/QueryContainer";
 import { RequiredSectionProps, Section } from "../../../../../src/surfaces/admin/components/Section";
 import { Select } from "../../../../../src/surfaces/admin/components/Select";
-import { AdminActionProps$1, BadgeProps$1, BannerProps$1, BoxProps$1, ButtonProps$1, CheckboxProps$1, ChoiceListProps$1, ChoiceProps$1, ClickableProps$1, ComponentChild, DatePickerProps$1, DividerProps$1, EmailFieldProps$1, GridItemProps$1, GridProps$1, HeadingProps$1, IconProps$1, IconType, ImageProps$1, InteractionProps, LinkProps$1, ListItemProps$1, MaybeAllValuesShorthandProperty, MoneyFieldProps$1, NumberFieldProps$1, OptionGroupProps$1, OptionProps$1, OrderedListProps$1, ParagraphProps$1, PasswordFieldProps$1, QueryContainerProps$1, SectionProps$1, SelectProps$1, SpinnerProps$1, StackProps$1, TableBodyProps$1, TableCellProps$1, TableHeaderProps$1, TableHeaderRowProps$1, TableProps$1, TableRowProps$1, TextAreaProps$1, TextFieldProps$1, TextProps$1, URLFieldProps$1, UnorderedListProps$1 } from "../../../../../src/surfaces/admin/components/shared";
+import { AdminActionProps$1, AvatarProps$1, BadgeProps$1, BannerProps$1, BoxProps$1, ButtonProps$1, CheckboxProps$1, ChoiceListProps$1, ChoiceProps$1, ClickableProps$1, ComponentChild, DatePickerProps$1, DividerProps$1, EmailFieldProps$1, GridItemProps$1, GridProps$1, HeadingProps$1, IconProps$1, IconType, ImageProps$1, InteractionProps, LinkProps$1, ListItemProps$1, MaybeAllValuesShorthandProperty, MoneyFieldProps$1, NumberFieldProps$1, OptionGroupProps$1, OptionProps$1, OrderedListProps$1, ParagraphProps$1, PasswordFieldProps$1, QueryContainerProps$1, SectionProps$1, SelectProps$1, SpinnerProps$1, StackProps$1, TableBodyProps$1, TableCellProps$1, TableHeaderProps$1, TableHeaderRowProps$1, TableProps$1, TableRowProps$1, TextAreaProps$1, TextFieldProps$1, TextProps$1, ThumbnailProps$1, URLFieldProps$1, UnorderedListProps$1 } from "../../../../../src/surfaces/admin/components/shared";
 import { Spinner } from "../../../../../src/surfaces/admin/components/Spinner";
 import { AlignedStackProps, ResponsiveStackProps, Stack } from "../../../../../src/surfaces/admin/components/Stack";
 import { Table } from "../../../../../src/surfaces/admin/components/Table";
@@ -3488,6 +3597,7 @@ import { TableHeaderRow } from "../../../../../src/surfaces/admin/components/Tab
 import { TableRow } from "../../../../../src/surfaces/admin/components/TableRow";
 import { TextArea, TextAreaProps } from "../../../../../src/surfaces/admin/components/TextArea";
 import { TextField, TextFieldProps } from "../../../../../src/surfaces/admin/components/TextField";
+import { Thumbnail } from "../../../../../src/surfaces/admin/components/Thumbnail";
 import { UnorderedList } from "../../../../../src/surfaces/admin/components/UnorderedList";
 import { URLField, URLFieldProps } from "../../../../../src/surfaces/admin/components/URLField";
 import type { ExtensionTargets } from '../extension-targets';