@shopify/ui-extensions 2025.10.0-rc.3 → 2025.10.0-rc.31

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

@@ -1,3077 +1,55 @@
-declare module 'preact' {
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [AdminPrintActiontagName]: AdminPrintActionJSXProps & {
-                children?: preact.ComponentChildren;
-                };
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [AdminPrintActiontagName]: AdminPrintAction;
-    }
-}
-
-export interface AdminPrintActionClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: AdminPrintActionActivationEventEsque;
-}
-
-export interface AdminPrintActionActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface AdminPrintActionJSXProps extends Partial<AdminPrintActionProps>, Pick<AdminPrintActionProps$1, 'id'> {
-}
-
-export interface AdminPrintActionProps extends Pick<AdminPrintActionProps$1, 'src'> {
-}
-
-declare const AdminPrintActionBaseClass: typeof globalThis.HTMLElement;
-declare const AdminPrintActiontagName = 's-admin-print-action';
-
-declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [URLFieldtagName]: URLFieldJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [URLFieldtagName]: URLField;
-    }
-}
-
-export interface URLFieldJSXProps extends Partial<Omit<URLFieldProps, 'accessory'>>, Pick<URLFieldProps$1, 'id'>, URLFieldFieldReactProps<typeof URLFieldtagName> {
-}
-
-export interface URLFieldFieldReactProps<T extends keyof HTMLElementTagNameMap> {
-    onInput?: ((event: CallbackEvent<T>) => void) | null;
-    onChange?: ((event: CallbackEvent<T>) => void) | null;
-    onFocus?: ((event: CallbackEvent<T>) => void) | null;
-    onBlur?: ((event: CallbackEvent<T>) => void) | null;
-}
-
-export interface URLFieldClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: URLFieldActivationEventEsque;
-}
-
-export interface URLFieldActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-declare const URLFieldtagName = 's-url-field';
-declare const URLFieldinternals: unique symbol;
-declare const URLFieldBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [UnorderedListtagName]: UnorderedListJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [UnorderedListtagName]: UnorderedList;
-    }
-}
-
-export interface UnorderedListJSXProps extends Partial<UnorderedListProps>, Pick<UnorderedListProps$1, 'id'> {
-}
-
-export interface UnorderedListClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: UnorderedListActivationEventEsque;
-}
-
-export interface UnorderedListActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface UnorderedListProps extends UnorderedListProps$1 {
-}
-
-declare const UnorderedListtagName = 's-unordered-list';
-declare const UnorderedListBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [TextFieldtagName]: Omit<TextFieldJSXProps, 'accessory'> & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [TextFieldtagName]: TextField;
-    }
-}
-
-export interface TextFieldJSXProps extends Partial<Omit<TextFieldProps, 'accessory'>>, Pick<TextFieldProps$1, 'id'>, TextFieldFieldReactProps<typeof TextFieldtagName> {
-    /**
-     * The accessory to display in the text field.
-     */
-    accessory?: ComponentChild;
-}
-
-export interface TextFieldFieldReactProps<T extends keyof HTMLElementTagNameMap> {
-    onInput?: ((event: CallbackEvent<T>) => void) | null;
-    onChange?: ((event: CallbackEvent<T>) => void) | null;
-    onFocus?: ((event: CallbackEvent<T>) => void) | null;
-    onBlur?: ((event: CallbackEvent<T>) => void) | null;
-}
-
-export interface TextFieldClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: TextFieldActivationEventEsque;
-}
-
-export interface TextFieldActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-declare const TextFieldtagName = 's-text-field';
-declare const TextFieldinternals: unique symbol;
-declare const TextFieldBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [TextAreatagName]: TextAreaJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [TextAreatagName]: TextArea;
-    }
-}
-
-export interface TextAreaJSXProps extends Partial<TextAreaProps>, Pick<TextAreaProps$1, 'id'>, TextAreaFieldReactProps<typeof TextAreatagName> {
-}
-
-export interface TextAreaFieldReactProps<T extends keyof HTMLElementTagNameMap> {
-    onInput?: ((event: CallbackEvent<T>) => void) | null;
-    onChange?: ((event: CallbackEvent<T>) => void) | null;
-    onFocus?: ((event: CallbackEvent<T>) => void) | null;
-    onBlur?: ((event: CallbackEvent<T>) => void) | null;
-}
-
-export interface TextAreaClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: TextAreaActivationEventEsque;
-}
-
-export interface TextAreaActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-declare const TextAreatagName = 's-text-area';
-declare const TextAreainternals: unique symbol;
-declare const TextAreaBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [TexttagName]: TextJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [TexttagName]: Text;
-    }
-}
-
-export interface TextJSXProps extends Partial<TextProps>, Pick<TextProps$1, 'id'> {
-}
-
-export interface TextClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: TextActivationEventEsque;
-}
-
-export interface TextActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface TextProps extends Required<
-        Pick<
-          TextProps$1,
-          | 'accessibilityVisibility'
-          | 'dir'
-          | 'color'
-          | 'type'
-          | 'tone'
-          | 'fontVariantNumeric'
-        >
-      > {
-    color: Extract<TextProps$1['color'], 'base' | 'subdued'>;
-    type: Extract<
-        TextProps$1['type'],
-        'address' | 'redundant' | 'strong' | 'generic'
-        >;
-    tone: Extract<
-        TextProps$1['tone'],
-        'auto' | 'info' | 'success' | 'warning' | 'critical' | 'neutral' | 'caution'
-        >;
-    fontVariantNumeric: Extract<
-        TextProps$1['fontVariantNumeric'],
-        'auto' | 'normal' | 'tabular-nums'
-        >;
-}
-
-declare const TexttagName = 's-text';
-declare const TextBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [TableRowtagName]: TableRowJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [TableRowtagName]: TableRow;
-    }
-}
-
-export interface TableRowJSXProps extends Partial<TableRowProps>, Pick<TableRowProps$1, 'id'> {
-}
-
-export interface TableRowClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: TableRowActivationEventEsque;
-}
-
-export interface TableRowActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface TableRowProps extends TableRowProps$1 {
-}
-
-declare const TableRowtagName = 's-table-row';
-declare const TableRowBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [TableHeaderRowtagName]: TableHeaderRowJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [TableHeaderRowtagName]: TableHeaderRow;
-    }
-}
-
-export interface TableHeaderRowJSXProps extends Partial<TableHeaderRowProps>, Pick<TableHeaderRowProps$1, 'id'> {
-}
-
-export interface TableHeaderRowClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: TableHeaderRowActivationEventEsque;
-}
-
-export interface TableHeaderRowActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface TableHeaderRowProps extends TableHeaderRowProps$1 {
-}
-
-declare const TableHeaderRowtagName = 's-table-header-row';
-declare const TableHeaderRowBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [TableHeadertagName]: TableHeaderJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [TableHeadertagName]: TableHeader;
-    }
-}
-
-export interface TableHeaderJSXProps extends Partial<TableHeaderTableHeaderProps>, Pick<TableHeaderProps$1, 'id'> {
-}
-
-export interface TableHeaderClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: TableHeaderActivationEventEsque;
-}
-
-export interface TableHeaderActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface TableHeaderTableHeaderProps extends Pick<TableHeaderProps$1, 'listSlot'> {
-    listSlot: Extract<
-        TableHeaderProps$1['listSlot'],
-        'primary' | 'secondary' | 'labeled' | 'kicker' | 'inline'
-        >;
-}
-
-declare const TableHeadertagName = 's-table-header';
-declare const TableHeaderBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [TableCelltagName]: TableCellJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [TableCelltagName]: TableCell;
-    }
-}
-
-export interface TableCellJSXProps extends Partial<TableCellProps>, Pick<TableCellProps$1, 'id'> {
-}
-
-export interface TableCellClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: TableCellActivationEventEsque;
-}
-
-export interface TableCellActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface TableCellProps extends TableCellProps$1 {
-}
-
-declare const TableCelltagName = 's-table-cell';
-declare const TableCellBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [TableBodytagName]: TableBodyJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [TableBodytagName]: TableBody;
-    }
-}
-
-export interface TableBodyJSXProps extends Partial<TableBodyProps>, Pick<TableBodyProps$1, 'id'> {
-}
-
-export interface TableBodyClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: TableBodyActivationEventEsque;
-}
-
-export interface TableBodyActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface TableBodyProps extends TableBodyProps$1 {
-}
-
-declare const TableBodytagName = 's-table-body';
-declare const TableBodyBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [TabletagName]: Omit<TableJSXProps, 'filters'> & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [TabletagName]: Table;
-    }
-}
-
-export interface TableJSXProps extends Partial<TableProps>, Pick<TableProps$1, 'id' | 'onNextPage' | 'onPreviousPage'> {
-    /**
-     * Additional filters to display in the table. For example, the `s-search-field` component can be used to filter the table data.
-     */
-    filters?: ComponentChild;
-}
-
-export interface TableClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: TableActivationEventEsque;
-}
-
-export interface TableActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface TableHeaderProps extends Pick<TableHeaderProps$1, 'listSlot'> {
-    listSlot: Extract<
-        TableHeaderProps$1['listSlot'],
-        'primary' | 'secondary' | 'labeled' | 'kicker' | 'inline'
-        >;
-}
-
-export interface TableProps extends Required<
-        Pick<
-          TableProps$1,
-          'loading' | 'paginate' | 'hasPreviousPage' | 'hasNextPage' | 'variant'
-        >
-      > {
-    variant: Extract<TableProps$1['variant'], 'list' | 'auto'>;
-}
-
-declare const TabletagName = 's-table';
-declare const tableHeadersSharedDataSymbol: unique symbol;
-declare const actualTableVariantSymbol: unique symbol;
-declare const TableBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [StacktagName]: StackJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [StacktagName]: Stack;
-    }
-}
-
-export interface StackJSXProps extends Partial<StackProps>, Pick<StackProps$1, 'id'> {
-}
-
-export interface StackClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: StackActivationEventEsque;
-}
-
-export interface StackActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface StackProps extends StackBoxProps, Pick<
-          Required<AlignedStackProps>,
-          'justifyContent' | 'alignItems' | 'alignContent'
-        > {
-    /**
-     * Adjust spacing between elements.
-     *
-     * `gap` can either accept:
-     * * a single SpacingKeyword value applied to both axes (e.g. `large-100`).
-     * * OR a pair of values (eg `large-100 large-500`) can be used to set the inline and block axes respectively.
-     * * OR a container query string with supported SpacingKeyword values as query values (e.g.@container (inline-size > 500px) large-300, small-300)
-     *
-     * @default 'none'
-     */
-    gap: ResponsiveStackProps['gap'];
-    /**
-     * Adjust spacing between elements in the block axis.
-     *
-     * This overrides the row value of `gap`.
-     * `rowGap` either accepts a single SpacingKeyword value (e.g. `large-100`)
-     * OR a container query string with supported SpacingKeyword values as query values (e.g.
-     * @container (inline-size > 500px) large-300, small-300)
-     * @default '' - meaning no override
-     */
-    rowGap: ResponsiveStackProps['rowGap'];
-    /**
-     * Adjust spacing between elements in the inline axis.
-     *
-     * This overrides the column value of `gap`.
-     * `columnGap` either accepts:
-     * * a single SpacingKeyword value (e.g. `large-100`)
-     * OR a container query string with supported SpacingKeyword values as query values (e.g.
-     * @container (inline-size > 500px) large-300, small-300)
-     * @default '' - meaning no override
-     */
-    columnGap: ResponsiveStackProps['columnGap'];
-    /**
-     * Sets how the Stack's children are placed within the Stack.
-     *
-     * `direction` either accepts:
-     * * a single value either `inline` or `block`
-     * *OR a container query string with either of these values as a query value (e.g. `@container (inline-size > 500px) inline, block`)
-     *   
-     * @default 'block'
-     * @implementation the content will wrap if the direction is 'inline', and not wrap if the direction is 'block'
-     */
-    direction: ResponsiveStackProps['direction'];
-}
-
-export interface StackBoxProps extends Pick<
-        RequiredBoxProps,
-        | 'accessibilityLabel'
-        | 'accessibilityRole'
-        | 'accessibilityVisibility'
-        | 'background'
-        | 'blockSize'
-        | 'border'
-        | 'borderColor'
-        | 'borderRadius'
-        | 'borderStyle'
-        | 'borderWidth'
-        | 'display'
-        | 'inlineSize'
-        | 'maxBlockSize'
-        | 'maxInlineSize'
-        | 'minBlockSize'
-        | 'minInlineSize'
-        | 'overflow'
-      > {
-    background: Extract<
-        RequiredBoxProps['background'],
-        'transparent' | 'base' | 'subdued' | 'strong'
-        >;
-    borderWidth: | MaybeAllValuesShorthandProperty<
-            Extract<
-              RequiredBoxProps['borderWidth'],
-              'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'none'
-            >
-          >
-        | Extract<RequiredBoxProps['borderWidth'], ''>;
-    borderStyle: | MaybeAllValuesShorthandProperty<BoxBorderStyles>
-        | Extract<RequiredBoxProps['borderStyle'], ''>;
-    borderColor: Extract<
-        RequiredBoxProps['borderColor'],
-        'subdued' | 'base' | 'strong' | ''
-        >;
-    borderRadius: MaybeAllValuesShorthandProperty<BoxBorderRadii>;
-    /**
-     * Adjust the padding of all edges.
-     *
-     * 1-to-4-value syntax (@see https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is
-     * supported. Note that, contrary to the CSS, it uses flow-relative values and the order is:
-     *
-     * - 4 values: `block-start inline-end block-end inline-start`
-     * - 3 values: `block-start inline block-end`
-     * - 2 values: `block inline`
-     *
-     * For example:
-     * - `large` means block-start, inline-end, block-end and inline-start paddings are `large`.
-     * - `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.
-     * - `large none large` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `none`.
-     * - `large none large small` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `small`.
-     *
-     * A padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.
-     *
-     * `padding` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 4 values (e.g. `@container (inline-size > 500px) large-300 small-300 large-100 small-100, small-200`)
-     *
-     * @default 'none'
-     */
-    padding: ResponsiveBoxProps['padding'];
-    /**
-     * Adjust the block-padding.
-     *
-     * - `large none` means block-start padding is `large`, block-end padding is `none`.
-     *
-     * This overrides the block value of `padding`.
-     *
-     * `paddingBlock` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingBlock: ResponsiveBoxProps['paddingBlock'];
-    /**
-     * Adjust the block-start padding.
-     *
-     * This overrides the block-start value of `paddingBlock`.
-     *
-     * `paddingBlockStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockStart: ResponsiveBoxProps['paddingBlockStart'];
-    /**
-     * Adjust the block-end padding.
-     *
-     * This overrides the block-end value of `paddingBlock`.
-     *
-     * `paddingBlockEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts up to 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockEnd: ResponsiveBoxProps['paddingBlockEnd'];
-    /**
-     * Adjust the inline padding.
-     *
-     * - `large none` means inline-start padding is `large`, inline-end padding is `none`.
-     *
-     * This overrides the inline value of `padding`.
-     *
-     * `paddingInline` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInline: ResponsiveBoxProps['paddingInline'];
-    /**
-     * Adjust the inline-start padding.
-     *
-     * This overrides the inline-start value of `paddingInline`.
-     *
-     * `paddingInlineStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineStart: ResponsiveBoxProps['paddingInlineStart'];
-    /**
-     * Adjust the inline-end padding.
-     *
-     * This overrides the inline-end value of `paddingInline`.
-     *
-     * `paddingInlineEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineEnd: ResponsiveBoxProps['paddingInlineEnd'];
-}
-
-declare const StacktagName = 's-stack';
-declare const StackBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [SpinnertagName]: SpinnerJSXProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [SpinnertagName]: Spinner;
-    }
-}
-
-export interface SpinnerJSXProps extends Partial<SpinnerProps>, Pick<SpinnerProps$1, 'id'> {
-}
-
-export interface SpinnerClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: SpinnerActivationEventEsque;
-}
-
-export interface SpinnerActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface SpinnerProps extends Required<Pick<SpinnerProps$1, 'accessibilityLabel'>> {
-    size: Extract<SpinnerProps$1['size'], 'large' | 'large-100' | 'base'>;
-}
-
-declare const SpinnertagName = 's-spinner';
-declare const SpinnerBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [SelecttagName]: SelectJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [SelecttagName]: Select;
-    }
-}
-
-export interface SelectJSXProps extends Partial<SelectProps> {
-    onChange?: (event: CallbackEvent<typeof SelecttagName>) => void;
-    onInput?: (event: CallbackEvent<typeof tagName>) => void;
-    onBlur?: (event: CallbackEvent<typeof tagName>) => void;
-    onFocus?: (event: CallbackEvent<typeof tagName>) => void;
-}
-
-export interface SelectProps extends Omit<PreactInputProps, 'value'>, Required<
-          Pick<
-            SelectProps$1,
-            | 'details'
-            | 'disabled'
-            | 'error'
-            | 'label'
-            | 'name'
-            | 'placeholder'
-            | 'required'
-            | 'icon'
-            | 'labelAccessibilityVisibility'
-          >
-        > {
-    value: Required<SelectProps$1>['value'];
-}
-
-export interface SelectClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: SelectActivationEventEsque;
-}
-
-export interface SelectActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-declare const SelecttagName = 's-select';
-declare const hasInitialValueSymbol: unique symbol;
-declare const usedFirstOptionSymbol: unique symbol;
-declare const Selectinternals: unique symbol;
-declare const SelectBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [SectiontagName]: SectionJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [SectiontagName]: Section;
-    }
-}
-
-export interface SectionJSXProps extends Partial<SectionProps>, Pick<SectionProps$1, 'id'> {
-}
-
-export interface SectionClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: SectionActivationEventEsque;
-}
-
-export interface SectionActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface SectionProps extends Pick<
-        RequiredSectionProps,
-        'accessibilityLabel' | 'heading' | 'padding'
-      > {
-    accessibilityLabel: RequiredSectionProps['accessibilityLabel'];
-    heading: RequiredSectionProps['heading'];
-    padding: RequiredSectionProps['padding'];
-}
-
-declare const SectiontagName = 's-section';
-declare const SectionBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [PasswordFieldtagName]: PasswordFieldJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [PasswordFieldtagName]: PasswordField;
-    }
-}
-
-export interface PasswordFieldJSXProps extends Partial<PasswordFieldProps>, Pick<PasswordFieldProps$1, 'id'>, PasswordFieldFieldReactProps<typeof PasswordFieldtagName> {
-}
-
-export interface PasswordFieldFieldReactProps<T extends keyof HTMLElementTagNameMap> {
-    onInput?: ((event: CallbackEvent<T>) => void) | null;
-    onChange?: ((event: CallbackEvent<T>) => void) | null;
-    onFocus?: ((event: CallbackEvent<T>) => void) | null;
-    onBlur?: ((event: CallbackEvent<T>) => void) | null;
-}
-
-export interface PasswordFieldClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: PasswordFieldActivationEventEsque;
-}
-
-export interface PasswordFieldActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-declare const PasswordFieldtagName = 's-password-field';
-declare const PasswordFieldinternals: unique symbol;
-declare const PasswordFieldBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [ParagraphtagName]: ParagraphJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [ParagraphtagName]: Paragraph;
-    }
-}
-
-export interface ParagraphJSXProps extends Partial<ParagraphProps>, Pick<ParagraphProps$1, 'id'> {
-}
-
-export interface ParagraphClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: ParagraphActivationEventEsque;
-}
-
-export interface ParagraphActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface ParagraphProps extends Required<
-        Pick<
-          ParagraphProps$1,
-          | 'accessibilityVisibility'
-          | 'fontVariantNumeric'
-          | 'tone'
-          | 'dir'
-          | 'color'
-          | 'lineClamp'
-        >
-      > {
-    color: Extract<ParagraphProps$1['color'], 'base' | 'subdued'>;
-    lineClamp: Extract<ParagraphProps$1['lineClamp'], number>;
-}
-
-declare const ParagraphtagName = 's-paragraph';
-declare const ParagraphBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [OrderedListtagName]: OrderedListJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [OrderedListtagName]: OrderedList;
-    }
-}
-
-export interface OrderedListJSXProps extends Partial<OrderedListProps>, Pick<OrderedListProps$1, 'id'> {
-}
-
-export interface OrderedListClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: OrderedListActivationEventEsque;
-}
-
-export interface OrderedListActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface OrderedListProps extends OrderedListProps$1 {
-}
-
-declare const OrderedListtagName = 's-ordered-list';
-declare const OrderedListBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [OptionGrouptagName]: OptionGroupJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [OptionGrouptagName]: OptionGroup;
-    }
-}
-
-export interface OptionGroupJSXProps extends Partial<OptionGroupProps> {
-}
-
-export interface OptionGroupClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: OptionGroupActivationEventEsque;
-}
-
-export interface OptionGroupActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface OptionGroupProps extends Required<Pick<OptionGroupProps$1, 'disabled' | 'label'>> {
-}
-
-declare const OptionGrouptagName = 's-option-group';
-declare const OptionGroupBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [OptiontagName]: OptionJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [OptiontagName]: Option;
-    }
-}
-
-export interface OptionJSXProps extends Partial<OptionProps> {
-}
-
-export interface OptionClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: OptionActivationEventEsque;
-}
-
-export interface OptionActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface OptionProps extends Required<
-        Pick<OptionProps$1, 'disabled' | 'value' | 'selected' | 'defaultSelected'>
-      > {
-}
-
-declare const OptiontagName = 's-option';
-declare const OptionBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [NumberFieldtagName]: NumberFieldJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [NumberFieldtagName]: NumberField;
-    }
-}
-
-export interface NumberFieldJSXProps extends Partial<NumberFieldProps>, Pick<NumberFieldProps$1, 'id'>, NumberFieldFieldReactProps<typeof NumberFieldtagName> {
-}
-
-export interface NumberFieldProps extends Omit<
-          PreactFieldProps<Required<NumberFieldProps$1>['autocomplete']>,
-          'value'
-        >, Required<
-          Pick<
-            NumberFieldProps$1,
-            'inputMode' | 'max' | 'min' | 'prefix' | 'step' | 'suffix'
-          >
-        > {
-    value: Required<NumberFieldProps$1>['value'];
-}
-
-export interface NumberFieldFieldReactProps<T extends keyof HTMLElementTagNameMap> {
-    onInput?: ((event: CallbackEvent<T>) => void) | null;
-    onChange?: ((event: CallbackEvent<T>) => void) | null;
-    onFocus?: ((event: CallbackEvent<T>) => void) | null;
-    onBlur?: ((event: CallbackEvent<T>) => void) | null;
-}
-
-export interface NumberFieldClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: NumberFieldActivationEventEsque;
-}
-
-export interface NumberFieldActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-declare const NumberFieldtagName = 's-number-field';
-declare const NumberFieldinternals: unique symbol;
-declare const NumberFieldBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [MoneyFieldtagName]: MoneyFieldJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [MoneyFieldtagName]: MoneyField;
-    }
-}
-
-export interface MoneyFieldJSXProps extends Partial<MoneyFieldProps>, MoneyFieldFieldReactProps<typeof MoneyFieldtagName>, Pick<MoneyFieldProps$1, 'id'> {
-}
-
-export interface MoneyFieldProps extends Omit<PreactFieldProps, 'value'>, Pick<RequiredMoneyFieldProps, 'max' | 'min' | 'step' | 'currencyCode'> {
-    value: Required<MoneyFieldProps$1>['value'];
-}
-
-export interface MoneyFieldFieldReactProps<T extends keyof HTMLElementTagNameMap> {
-    onInput?: ((event: CallbackEvent<T>) => void) | null;
-    onChange?: ((event: CallbackEvent<T>) => void) | null;
-    onFocus?: ((event: CallbackEvent<T>) => void) | null;
-    onBlur?: ((event: CallbackEvent<T>) => void) | null;
-}
-
-export interface MoneyFieldClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: MoneyFieldActivationEventEsque;
-}
-
-export interface MoneyFieldActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-declare const MoneyFieldtagName = 's-money-field';
-declare const MoneyFieldinternals: unique symbol;
-declare const MoneyFieldBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [ListItemtagName]: ListItemJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [ListItemtagName]: ListItem;
-    }
-}
-
-export interface ListItemJSXProps extends Partial<ListItemProps>, Pick<ListItemProps$1, 'id'> {
-}
-
-export interface ListItemClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: ListItemActivationEventEsque;
-}
-
-export interface ListItemActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface ListItemProps extends ListItemProps$1 {
-}
-
-declare const ListItemtagName = 's-list-item';
-declare const ListItemBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [LinktagName]: LinkJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [LinktagName]: Link;
-    }
-}
-
-export interface LinkJSXProps extends Partial<LinkProps>, Pick<LinkProps$1, 'id' | 'lang'> {
-    onClick?: ((event: CallbackEvent<typeof LinktagName>) => void) | null;
-}
-
-export interface LinkPreactOverlayControlProps extends Pick<InteractionProps, 'commandFor'> {
-    /**
-     * Sets the action the `commandFor` should take when this clickable is activated.
-     *
-     * See the documentation of particular components for the actions they support.
-     *
-     * - `--auto`: a default action for the target component.
-     * - `--show`: shows the target component.
-     * - `--hide`: hides the target component.
-     * - `--toggle`: toggles the target component.
-     *
-     * @default '--auto'
-     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command
-     */
-    command: Extract<
-        InteractionProps['command'],
-        '--show' | '--hide' | '--toggle' | '--auto'
-        >;
-    commandFor: Extract<InteractionProps['commandFor'], string>;
-}
-
-export interface LinkClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: LinkActivationEventEsque;
-}
-
-export interface LinkActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface LinkProps extends Pick<
-        LinkProps$1,
-        | 'accessibilityLabel'
-        | 'command'
-        | 'commandFor'
-        | 'download'
-        | 'href'
-        | 'lang'
-        | 'target'
-        | 'tone'
-      > {
-    accessibilityLabel: RequiredLinkProps['accessibilityLabel'];
-    command: RequiredLinkProps['command'];
-    commandFor: RequiredLinkProps['commandFor'];
-    download: RequiredLinkProps['download'];
-    href: RequiredLinkProps['href'];
-    lang: RequiredLinkProps['lang'];
-    target: RequiredLinkProps['target'];
-    tone: Extract<RequiredLinkProps['tone'], 'auto' | 'neutral' | 'critical'>;
-}
-
-declare const LinktagName = 's-link';
-declare const Link_base: (abstract new (
-      args_0: RenderImpl,
-    ) => PreactCustomElement & LinkPreactOverlayControlProps) &
-      Pick<typeof PreactCustomElement, 'prototype' | 'observedAttributes'>;
-declare const LinkBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [ImagetagName]: ImageJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [ImagetagName]: Image;
-    }
-}
-
-export interface ImageJSXProps extends Partial<ImageProps>, Pick<ImageProps$1, 'id'> {
-    onError?: ((event: CallbackEvent<typeof ImagetagName>) => void) | null;
-    onLoad?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-}
-
-export interface ImageClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: ImageActivationEventEsque;
-}
-
-export interface ImageActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface ImageProps extends Required<
-          Pick<
-            ImageProps$1,
-            | 'alt'
-            | 'loading'
-            | 'src'
-            | 'accessibilityRole'
-            | 'inlineSize'
-            | 'srcSet'
-            | 'sizes'
-            | 'aspectRatio'
-            | 'objectFit'
-          >
-        >, Required<
-          Pick<
-            ImageBoxProps,
-            | 'border'
-            | 'borderColor'
-            | 'borderRadius'
-            | 'borderStyle'
-            | 'borderWidth'
-          >
-        > {
-    border: ImageBoxProps['border'];
-    borderColor: ImageBoxProps['borderColor'];
-    borderRadius: ImageBoxProps['borderRadius'];
-    borderStyle: ImageBoxProps['borderStyle'];
-    borderWidth: ImageBoxProps['borderWidth'];
-}
-
-export interface ImageBoxProps extends Pick<
-        RequiredBoxProps,
-        | 'accessibilityLabel'
-        | 'accessibilityRole'
-        | 'accessibilityVisibility'
-        | 'background'
-        | 'blockSize'
-        | 'border'
-        | 'borderColor'
-        | 'borderRadius'
-        | 'borderStyle'
-        | 'borderWidth'
-        | 'display'
-        | 'inlineSize'
-        | 'maxBlockSize'
-        | 'maxInlineSize'
-        | 'minBlockSize'
-        | 'minInlineSize'
-        | 'overflow'
-      > {
-    background: Extract<
-        RequiredBoxProps['background'],
-        'transparent' | 'base' | 'subdued' | 'strong'
-        >;
-    borderWidth: | MaybeAllValuesShorthandProperty<
-            Extract<
-              RequiredBoxProps['borderWidth'],
-              'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'none'
-            >
-          >
-        | Extract<RequiredBoxProps['borderWidth'], ''>;
-    borderStyle: | MaybeAllValuesShorthandProperty<BoxBorderStyles>
-        | Extract<RequiredBoxProps['borderStyle'], ''>;
-    borderColor: Extract<
-        RequiredBoxProps['borderColor'],
-        'subdued' | 'base' | 'strong' | ''
-        >;
-    borderRadius: MaybeAllValuesShorthandProperty<BoxBorderRadii>;
-    /**
-     * Adjust the padding of all edges.
-     *
-     * 1-to-4-value syntax (@see https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is
-     * supported. Note that, contrary to the CSS, it uses flow-relative values and the order is:
-     *
-     * - 4 values: `block-start inline-end block-end inline-start`
-     * - 3 values: `block-start inline block-end`
-     * - 2 values: `block inline`
-     *
-     * For example:
-     * - `large` means block-start, inline-end, block-end and inline-start paddings are `large`.
-     * - `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.
-     * - `large none large` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `none`.
-     * - `large none large small` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `small`.
-     *
-     * A padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.
-     *
-     * `padding` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 4 values (e.g. `@container (inline-size > 500px) large-300 small-300 large-100 small-100, small-200`)
-     *
-     * @default 'none'
-     */
-    padding: ResponsiveBoxProps['padding'];
-    /**
-     * Adjust the block-padding.
-     *
-     * - `large none` means block-start padding is `large`, block-end padding is `none`.
-     *
-     * This overrides the block value of `padding`.
-     *
-     * `paddingBlock` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingBlock: ResponsiveBoxProps['paddingBlock'];
-    /**
-     * Adjust the block-start padding.
-     *
-     * This overrides the block-start value of `paddingBlock`.
-     *
-     * `paddingBlockStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockStart: ResponsiveBoxProps['paddingBlockStart'];
-    /**
-     * Adjust the block-end padding.
-     *
-     * This overrides the block-end value of `paddingBlock`.
-     *
-     * `paddingBlockEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts up to 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockEnd: ResponsiveBoxProps['paddingBlockEnd'];
-    /**
-     * Adjust the inline padding.
-     *
-     * - `large none` means inline-start padding is `large`, inline-end padding is `none`.
-     *
-     * This overrides the inline value of `padding`.
-     *
-     * `paddingInline` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInline: ResponsiveBoxProps['paddingInline'];
-    /**
-     * Adjust the inline-start padding.
-     *
-     * This overrides the inline-start value of `paddingInline`.
-     *
-     * `paddingInlineStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineStart: ResponsiveBoxProps['paddingInlineStart'];
-    /**
-     * Adjust the inline-end padding.
-     *
-     * This overrides the inline-end value of `paddingInline`.
-     *
-     * `paddingInlineEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineEnd: ResponsiveBoxProps['paddingInlineEnd'];
-}
-
-declare const ImagetagName = 's-image';
-declare const ImageBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [IcontagName]: IconJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [IcontagName]: Icon;
-    }
-}
-
-export interface IconJSXProps extends Partial<IconIconProps>, Pick<IconProps$1, 'id'> {
-}
-
-export interface IconClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: IconActivationEventEsque;
-}
-
-export interface IconActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface IconIconProps extends Pick<IconProps$1, 'type' | 'tone' | 'color' | 'size'> {
-    /**
-     * Specifies the type of icon that will be displayed.
-     */
-    type: '' | IconType | 'empty';
-    tone: Extract<
-        IconProps$1['tone'],
-        'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical'
-        >;
-    color: Extract<IconProps$1['color'], 'base' | 'subdued'>;
-    size: Extract<IconProps$1['size'], 'small' | 'base'>;
-}
-
-declare const IcontagName = 's-icon';
-declare const IconBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [HeadingtagName]: HeadingJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [HeadingtagName]: Heading;
-    }
-}
-
-export interface HeadingJSXProps extends Partial<HeadingProps>, Pick<HeadingProps$1, 'id'> {
-}
-
-export interface HeadingClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: HeadingActivationEventEsque;
-}
-
-export interface HeadingActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface HeadingProps extends Pick<
-        HeadingProps$1,
-        'accessibilityRole' | 'accessibilityVisibility' | 'lineClamp'
-      > {
-    accessibilityRole: RequiredHeadingProps['accessibilityRole'];
-    accessibilityVisibility: RequiredHeadingProps['accessibilityVisibility'];
-    lineClamp: RequiredHeadingProps['lineClamp'];
-}
-
-declare const HeadingtagName = 's-heading';
-declare const HeadingBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [GridItemtagName]: GridItemJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [GridItemtagName]: GridItem;
-    }
-}
-
-export interface GridItemJSXProps extends Partial<GridItemProps>, Pick<GridItemProps$1, 'id'> {
-}
-
-export interface GridItemClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: GridItemActivationEventEsque;
-}
-
-export interface GridItemActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface GridItemProps extends GridItemBoxProps, Required<Pick<GridItemProps$1, 'gridColumn' | 'gridRow'>> {
-    gridColumn: RequiredGridItemProps['gridColumn'];
-    gridRow: RequiredGridItemProps['gridRow'];
-}
-
-export interface GridItemBoxProps extends Pick<
-        RequiredBoxProps,
-        | 'accessibilityLabel'
-        | 'accessibilityRole'
-        | 'accessibilityVisibility'
-        | 'background'
-        | 'blockSize'
-        | 'border'
-        | 'borderColor'
-        | 'borderRadius'
-        | 'borderStyle'
-        | 'borderWidth'
-        | 'display'
-        | 'inlineSize'
-        | 'maxBlockSize'
-        | 'maxInlineSize'
-        | 'minBlockSize'
-        | 'minInlineSize'
-        | 'overflow'
-      > {
-    background: Extract<
-        RequiredBoxProps['background'],
-        'transparent' | 'base' | 'subdued' | 'strong'
-        >;
-    borderWidth: | MaybeAllValuesShorthandProperty<
-            Extract<
-              RequiredBoxProps['borderWidth'],
-              'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'none'
-            >
-          >
-        | Extract<RequiredBoxProps['borderWidth'], ''>;
-    borderStyle: | MaybeAllValuesShorthandProperty<BoxBorderStyles>
-        | Extract<RequiredBoxProps['borderStyle'], ''>;
-    borderColor: Extract<
-        RequiredBoxProps['borderColor'],
-        'subdued' | 'base' | 'strong' | ''
-        >;
-    borderRadius: MaybeAllValuesShorthandProperty<BoxBorderRadii>;
-    /**
-     * Adjust the padding of all edges.
-     *
-     * 1-to-4-value syntax (@see https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is
-     * supported. Note that, contrary to the CSS, it uses flow-relative values and the order is:
-     *
-     * - 4 values: `block-start inline-end block-end inline-start`
-     * - 3 values: `block-start inline block-end`
-     * - 2 values: `block inline`
-     *
-     * For example:
-     * - `large` means block-start, inline-end, block-end and inline-start paddings are `large`.
-     * - `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.
-     * - `large none large` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `none`.
-     * - `large none large small` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `small`.
-     *
-     * A padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.
-     *
-     * `padding` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 4 values (e.g. `@container (inline-size > 500px) large-300 small-300 large-100 small-100, small-200`)
-     *
-     * @default 'none'
-     */
-    padding: ResponsiveBoxProps['padding'];
-    /**
-     * Adjust the block-padding.
-     *
-     * - `large none` means block-start padding is `large`, block-end padding is `none`.
-     *
-     * This overrides the block value of `padding`.
-     *
-     * `paddingBlock` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingBlock: ResponsiveBoxProps['paddingBlock'];
-    /**
-     * Adjust the block-start padding.
-     *
-     * This overrides the block-start value of `paddingBlock`.
-     *
-     * `paddingBlockStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockStart: ResponsiveBoxProps['paddingBlockStart'];
-    /**
-     * Adjust the block-end padding.
-     *
-     * This overrides the block-end value of `paddingBlock`.
-     *
-     * `paddingBlockEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts up to 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockEnd: ResponsiveBoxProps['paddingBlockEnd'];
-    /**
-     * Adjust the inline padding.
-     *
-     * - `large none` means inline-start padding is `large`, inline-end padding is `none`.
-     *
-     * This overrides the inline value of `padding`.
-     *
-     * `paddingInline` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInline: ResponsiveBoxProps['paddingInline'];
-    /**
-     * Adjust the inline-start padding.
-     *
-     * This overrides the inline-start value of `paddingInline`.
-     *
-     * `paddingInlineStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineStart: ResponsiveBoxProps['paddingInlineStart'];
-    /**
-     * Adjust the inline-end padding.
-     *
-     * This overrides the inline-end value of `paddingInline`.
-     *
-     * `paddingInlineEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineEnd: ResponsiveBoxProps['paddingInlineEnd'];
-}
-
-declare const GridItemtagName = 's-grid-item';
-declare const GridItemBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [GridtagName]: GridJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [GridtagName]: Grid;
-    }
-}
-
-export interface GridJSXProps extends Partial<GridProps>, Pick<GridProps$1, 'id'> {
-}
-
-export interface GridClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: GridActivationEventEsque;
-}
-
-export interface GridActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface GridProps extends GridBoxProps, Required<
-          Pick<
-            GridProps$1,
-            | 'gridTemplateColumns'
-            | 'gridTemplateRows'
-            | 'alignItems'
-            | 'justifyItems'
-            | 'placeItems'
-            | 'alignContent'
-            | 'justifyContent'
-            | 'placeContent'
-          >
-        > {
-    /**
-     * Adjust spacing between elements.
-     *
-     * `gap` can either accept:
-     * * a single SpacingKeyword value applied to both axes (e.g. `large-100`).
-     * *OR a pair of values (eg `large-100 large-500`) can be used to set the inline and block axes respectively.
-     * OR a container query string with supported SpacingKeyword values as query values (e.g.@container (inline-size > 500px) large-300, small-300)
-     *
-     * @default 'none'
-     */
-    gap: ResponsiveGridProps['gap'];
-    /**
-     * Adjust spacing between elements in the block axis.
-     *
-     * This overrides the row value of `gap`.
-     * `rowGap` either accepts:
-     * * a single SpacingKeyword value (e.g. `large-100`)
-     * *OR a container query string with supported SpacingKeyword values as query values (e.g.
-     * @container (inline-size > 500px) large-300, small-300)
-     * @default '' - meaning no override
-     */
-    rowGap: ResponsiveGridProps['rowGap'];
-    /**
-     * Adjust spacing between elements in the inline axis.
-     *
-     * This overrides the column value of `gap`.
-     * `columnGap` either accepts:
-     * * a single SpacingKeyword value (e.g. `large-100`)
-     * * OR a container query string with supported SpacingKeyword values as query values (e.g.
-     * @container (inline-size > 500px) large-300, small-300)
-     * @default '' - meaning no override
-     */
-    columnGap: ResponsiveGridProps['columnGap'];
-}
-
-export interface GridBoxProps extends Pick<
-        RequiredBoxProps,
-        | 'accessibilityLabel'
-        | 'accessibilityRole'
-        | 'accessibilityVisibility'
-        | 'background'
-        | 'blockSize'
-        | 'border'
-        | 'borderColor'
-        | 'borderRadius'
-        | 'borderStyle'
-        | 'borderWidth'
-        | 'display'
-        | 'inlineSize'
-        | 'maxBlockSize'
-        | 'maxInlineSize'
-        | 'minBlockSize'
-        | 'minInlineSize'
-        | 'overflow'
-      > {
-    background: Extract<
-        RequiredBoxProps['background'],
-        'transparent' | 'base' | 'subdued' | 'strong'
-        >;
-    borderWidth: | MaybeAllValuesShorthandProperty<
-            Extract<
-              RequiredBoxProps['borderWidth'],
-              'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'none'
-            >
-          >
-        | Extract<RequiredBoxProps['borderWidth'], ''>;
-    borderStyle: | MaybeAllValuesShorthandProperty<BoxBorderStyles>
-        | Extract<RequiredBoxProps['borderStyle'], ''>;
-    borderColor: Extract<
-        RequiredBoxProps['borderColor'],
-        'subdued' | 'base' | 'strong' | ''
-        >;
-    borderRadius: MaybeAllValuesShorthandProperty<BoxBorderRadii>;
-    /**
-     * Adjust the padding of all edges.
-     *
-     * 1-to-4-value syntax (@see https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is
-     * supported. Note that, contrary to the CSS, it uses flow-relative values and the order is:
-     *
-     * - 4 values: `block-start inline-end block-end inline-start`
-     * - 3 values: `block-start inline block-end`
-     * - 2 values: `block inline`
-     *
-     * For example:
-     * - `large` means block-start, inline-end, block-end and inline-start paddings are `large`.
-     * - `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.
-     * - `large none large` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `none`.
-     * - `large none large small` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `small`.
-     *
-     * A padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.
-     *
-     * `padding` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 4 values (e.g. `@container (inline-size > 500px) large-300 small-300 large-100 small-100, small-200`)
-     *
-     * @default 'none'
-     */
-    padding: ResponsiveBoxProps['padding'];
-    /**
-     * Adjust the block-padding.
-     *
-     * - `large none` means block-start padding is `large`, block-end padding is `none`.
-     *
-     * This overrides the block value of `padding`.
-     *
-     * `paddingBlock` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingBlock: ResponsiveBoxProps['paddingBlock'];
-    /**
-     * Adjust the block-start padding.
-     *
-     * This overrides the block-start value of `paddingBlock`.
-     *
-     * `paddingBlockStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockStart: ResponsiveBoxProps['paddingBlockStart'];
-    /**
-     * Adjust the block-end padding.
-     *
-     * This overrides the block-end value of `paddingBlock`.
-     *
-     * `paddingBlockEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts up to 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockEnd: ResponsiveBoxProps['paddingBlockEnd'];
-    /**
-     * Adjust the inline padding.
-     *
-     * - `large none` means inline-start padding is `large`, inline-end padding is `none`.
-     *
-     * This overrides the inline value of `padding`.
-     *
-     * `paddingInline` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInline: ResponsiveBoxProps['paddingInline'];
-    /**
-     * Adjust the inline-start padding.
-     *
-     * This overrides the inline-start value of `paddingInline`.
-     *
-     * `paddingInlineStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineStart: ResponsiveBoxProps['paddingInlineStart'];
-    /**
-     * Adjust the inline-end padding.
-     *
-     * This overrides the inline-end value of `paddingInline`.
-     *
-     * `paddingInlineEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineEnd: ResponsiveBoxProps['paddingInlineEnd'];
-}
-
-declare const GridtagName = 's-grid';
-declare const GridBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [EmailFieldtagName]: EmailFieldJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [EmailFieldtagName]: EmailField;
-    }
-}
-
-export interface EmailFieldJSXProps extends Partial<Omit<EmailFieldProps, 'accessory'>>, Pick<EmailFieldProps$1, 'id'>, FieldReactProps<typeof EmailFieldtagName> {
-}
-
-export interface FieldReactProps<T extends keyof HTMLElementTagNameMap> {
-    onInput?: ((event: CallbackEvent<T>) => void) | null;
-    onChange?: ((event: CallbackEvent<T>) => void) | null;
-    onFocus?: ((event: CallbackEvent<T>) => void) | null;
-    onBlur?: ((event: CallbackEvent<T>) => void) | null;
-}
-
-export interface EmailFieldClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: EmailFieldActivationEventEsque;
-}
-
-export interface EmailFieldActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-declare const EmailFieldtagName = 's-email-field';
-declare const EmailFieldinternals: unique symbol;
-declare const EmailFieldBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [DividertagName]: DividerJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [DividertagName]: Divider;
-    }
-}
-
-export interface DividerJSXProps extends Partial<DividerProps>, Pick<DividerProps$1, 'id'> {
-}
-
-export interface DividerClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: DividerActivationEventEsque;
-}
-
-export interface DividerActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface DividerProps extends Pick<DividerProps$1, 'direction' | 'color'> {
-    direction: Extract<DividerProps$1['direction'], 'inline' | 'block'>;
-    color: Extract<DividerProps$1['color'], 'base' | 'strong'>;
-}
-
-declare const DividertagName = 's-divider';
-declare const DividerBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [DatePickertagName]: DatePickerJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [DatePickertagName]: DatePicker;
-    }
-
-    interface HTMLElementEventMap {
-        viewchange: ViewChangeEvent;
-    }
-}
-
-export interface DatePickerJSXProps extends Partial<DatePickerProps>, Pick<DatePickerProps$1, 'id'> {
-    onViewChange?: | ((
-            event: CallbackEvent<typeof DatePickertagName, HTMLElementEventMap['viewchange']>,
-          ) => void)
-        | null;
-    onFocus?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-    onBlur?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-    onInput?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-    onChange?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-}
-
-export interface DatePickerClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: DatePickerActivationEventEsque;
-}
-
-export interface DatePickerActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface DatePickerProps extends Required<
-        Pick<
-          DatePickerProps$1,
-          | 'defaultView'
-          | 'view'
-          | 'allow'
-          | 'disallow'
-          | 'allowDays'
-          | 'disallowDays'
-          | 'value'
-          | 'defaultValue'
-          | 'name'
-        >
-      > {
-    type: Extract<DatePickerProps$1['type'], 'single' | 'multiple' | 'range'>;
-}
-
-declare const DatePickertagName = 's-date-picker';
-declare const dirtyStateSymbol: unique symbol;
-declare const DatePickerinternals: unique symbol;
-declare const DatePickerBaseClass$1: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [ClickabletagName]: ClickableJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [ClickabletagName]: Clickable;
-    }
-}
-
-export interface ClickableJSXProps extends Partial<ClickableProps>, Pick<ClickableProps$1, 'id'> {
-    onClick?: ((event: CallbackEvent<typeof ClickabletagName>) => void) | null;
-    onFocus?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-    onBlur?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-}
-
-export interface ClickablePreactOverlayControlProps extends Pick<InteractionProps, 'commandFor'> {
-    /**
-     * Sets the action the `commandFor` should take when this clickable is activated.
-     *
-     * See the documentation of particular components for the actions they support.
-     *
-     * - `--auto`: a default action for the target component.
-     * - `--show`: shows the target component.
-     * - `--hide`: hides the target component.
-     * - `--toggle`: toggles the target component.
-     *
-     * @default '--auto'
-     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command
-     */
-    command: Extract<
-        InteractionProps['command'],
-        '--show' | '--hide' | '--toggle' | '--auto'
-        >;
-    commandFor: Extract<InteractionProps['commandFor'], string>;
-}
-
-export interface ClickableClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: ClickableActivationEventEsque;
-}
-
-export interface ClickableActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface ClickableProps extends Required<ClickableBoxProps>, ClickableBaseProps {
-}
-
-export interface ClickableBoxProps extends Pick<
-        RequiredBoxProps,
-        | 'accessibilityLabel'
-        | 'accessibilityRole'
-        | 'accessibilityVisibility'
-        | 'background'
-        | 'blockSize'
-        | 'border'
-        | 'borderColor'
-        | 'borderRadius'
-        | 'borderStyle'
-        | 'borderWidth'
-        | 'display'
-        | 'inlineSize'
-        | 'maxBlockSize'
-        | 'maxInlineSize'
-        | 'minBlockSize'
-        | 'minInlineSize'
-        | 'overflow'
-      > {
-    background: Extract<
-        RequiredBoxProps['background'],
-        'transparent' | 'base' | 'subdued' | 'strong'
-        >;
-    borderWidth: | MaybeAllValuesShorthandProperty<
-            Extract<
-              RequiredBoxProps['borderWidth'],
-              'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'none'
-            >
-          >
-        | Extract<RequiredBoxProps['borderWidth'], ''>;
-    borderStyle: | MaybeAllValuesShorthandProperty<BoxBorderStyles>
-        | Extract<RequiredBoxProps['borderStyle'], ''>;
-    borderColor: Extract<
-        RequiredBoxProps['borderColor'],
-        'subdued' | 'base' | 'strong' | ''
-        >;
-    borderRadius: MaybeAllValuesShorthandProperty<BoxBorderRadii>;
-    /**
-     * Adjust the padding of all edges.
-     *
-     * 1-to-4-value syntax (@see https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is
-     * supported. Note that, contrary to the CSS, it uses flow-relative values and the order is:
-     *
-     * - 4 values: `block-start inline-end block-end inline-start`
-     * - 3 values: `block-start inline block-end`
-     * - 2 values: `block inline`
-     *
-     * For example:
-     * - `large` means block-start, inline-end, block-end and inline-start paddings are `large`.
-     * - `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.
-     * - `large none large` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `none`.
-     * - `large none large small` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `small`.
-     *
-     * A padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.
-     *
-     * `padding` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 4 values (e.g. `@container (inline-size > 500px) large-300 small-300 large-100 small-100, small-200`)
-     *
-     * @default 'none'
-     */
-    padding: ResponsiveBoxProps['padding'];
-    /**
-     * Adjust the block-padding.
-     *
-     * - `large none` means block-start padding is `large`, block-end padding is `none`.
-     *
-     * This overrides the block value of `padding`.
-     *
-     * `paddingBlock` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingBlock: ResponsiveBoxProps['paddingBlock'];
-    /**
-     * Adjust the block-start padding.
-     *
-     * This overrides the block-start value of `paddingBlock`.
-     *
-     * `paddingBlockStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockStart: ResponsiveBoxProps['paddingBlockStart'];
-    /**
-     * Adjust the block-end padding.
-     *
-     * This overrides the block-end value of `paddingBlock`.
-     *
-     * `paddingBlockEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts up to 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockEnd: ResponsiveBoxProps['paddingBlockEnd'];
-    /**
-     * Adjust the inline padding.
-     *
-     * - `large none` means inline-start padding is `large`, inline-end padding is `none`.
-     *
-     * This overrides the inline value of `padding`.
-     *
-     * `paddingInline` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInline: ResponsiveBoxProps['paddingInline'];
-    /**
-     * Adjust the inline-start padding.
-     *
-     * This overrides the inline-start value of `paddingInline`.
-     *
-     * `paddingInlineStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineStart: ResponsiveBoxProps['paddingInlineStart'];
-    /**
-     * Adjust the inline-end padding.
-     *
-     * This overrides the inline-end value of `paddingInline`.
-     *
-     * `paddingInlineEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineEnd: ResponsiveBoxProps['paddingInlineEnd'];
-}
-
-declare const ClickabletagName = 's-clickable';
-declare const Clickable_base: (abstract new (
-      renderImpl: RenderImpl,
-    ) => BoxElement & ClickablePreactOverlayControlProps) &
-      Pick<typeof BoxElement, 'prototype' | 'observedAttributes'>;
-declare const ClickableBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [ChoiceListtagName]: ChoiceListJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [ChoiceListtagName]: ChoiceList;
-    }
-}
-
-export interface ChoiceListJSXProps extends Partial<ChoiceListProps>, Pick<ChoiceListProps$1, 'id'> {
-    onChange?: ((event: CallbackEvent<typeof ChoiceListtagName>) => void) | null;
-    onInput?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-}
-
-export interface ChoiceListClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: ChoiceListActivationEventEsque;
-}
-
-export interface ChoiceListActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface ChoiceListProps extends Required<
-        Pick<
-          ChoiceListProps$1,
-          | 'details'
-          | 'disabled'
-          | 'error'
-          | 'label'
-          | 'labelAccessibilityVisibility'
-          | 'multiple'
-          | 'name'
-          | 'values'
-        >
-      > {
-}
-
-declare const ChoiceListtagName = 's-choice-list';
-declare const ChoiceListinternals: unique symbol;
-/**
- * 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$1: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [ChoicetagName]: ChoiceJSXProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [ChoicetagName]: Choice;
-    }
-}
-
-export interface ChoiceJSXProps extends Partial<ChoiceProps>, Pick<ChoiceProps$1, 'id'> {
-}
-
-export interface ChoiceClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: ChoiceActivationEventEsque;
-}
-
-export interface ChoiceActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface ChoiceProps extends Required<
-        Pick<
-          ChoiceProps$1,
-          | 'selected'
-          | 'defaultSelected'
-          | 'disabled'
-          | 'accessibilityLabel'
-          | 'value'
-          | 'label'
-          | 'details'
-        >
-      > {
-}
-
-declare const ChoicetagName = 's-choice';
-declare const ChoiceBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [CheckboxtagName]: CheckboxJSXProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [CheckboxtagName]: Checkbox;
-    }
-}
-
-export interface CheckboxJSXProps extends Partial<CheckboxProps>, Pick<CheckboxProps$1, 'id'> {
-    onChange?: ((event: CallbackEvent<typeof CheckboxtagName>) => void) | null;
-    onInput?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-}
-
-export interface CheckboxProps extends PreactCheckboxProps {
-    indeterminate: Required<CheckboxProps$1>['indeterminate'];
-    defaultIndeterminate: Required<CheckboxProps$1>['defaultIndeterminate'];
-}
-
-export interface PreactCheckboxProps extends Required<
-        Pick<
-          CheckboxProps$1,
-          | 'accessibilityLabel'
-          | 'checked'
-          | 'defaultChecked'
-          | 'details'
-          | 'error'
-          | 'label'
-          | 'required'
-          | 'name'
-          | 'disabled'
-        >
-      > {
-    value: Required<CheckboxProps$1>['value'];
-}
-
-export interface CheckboxClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: CheckboxActivationEventEsque;
-}
-
-export interface CheckboxActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-declare const CheckboxtagName = 's-checkbox';
-declare const internals: unique symbol;
-declare const CheckboxBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [ButtontagName]: ButtonJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [ButtontagName]: Button;
-    }
-}
-
-export interface ButtonJSXProps extends Partial<ButtonProps>, Pick<ButtonProps$1, 'id'> {
-    onClick?: ((event: CallbackEvent<typeof ButtontagName>) => void) | null;
-    onFocus?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-    onBlur?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-}
-
-export interface PreactOverlayControlProps extends Pick<InteractionProps, 'commandFor'> {
-    /**
-     * Sets the action the `commandFor` should take when this clickable is activated.
-     *
-     * See the documentation of particular components for the actions they support.
-     *
-     * - `--auto`: a default action for the target component.
-     * - `--show`: shows the target component.
-     * - `--hide`: hides the target component.
-     * - `--toggle`: toggles the target component.
-     *
-     * @default '--auto'
-     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command
-     */
-    command: Extract<
-        InteractionProps['command'],
-        '--show' | '--hide' | '--toggle' | '--auto'
-        >;
-    commandFor: Extract<InteractionProps['commandFor'], string>;
-}
-
-export interface ButtonClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: ButtonActivationEventEsque;
-}
-
-export interface ButtonActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface ButtonProps extends ButtonBaseProps {
-    tone: Extract<ButtonProps$1['tone'], 'neutral' | 'critical' | 'auto'>;
-    icon: ButtonIconProps['type'];
-}
-
-export interface ButtonIconProps extends Pick<IconProps$1, 'type' | 'tone' | 'color' | 'size'> {
-    /**
-     * Specifies the type of icon that will be displayed.
-     */
-    type: '' | IconType | 'empty';
-    tone: Extract<
-        IconProps$1['tone'],
-        'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical'
-        >;
-    color: Extract<IconProps$1['color'], 'base' | 'subdued'>;
-    size: Extract<IconProps$1['size'], 'small' | 'base'>;
-}
-
-declare const ButtontagName = 's-button';
-declare const Button_base: (abstract new (
-      args_0: RenderImpl,
-    ) => PreactCustomElement & PreactOverlayControlProps) &
-      Pick<typeof PreactCustomElement, 'prototype' | 'observedAttributes'>;
-declare const ButtonBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [BoxtagName]: BoxJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [BoxtagName]: Box;
-    }
-}
-
-export interface BoxJSXProps extends Partial<BoxProps>, Pick<BoxProps$1, 'id'> {
-}
-
-export interface BoxClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: BoxActivationEventEsque;
-}
-
-export interface BoxActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface BoxProps extends Pick<
-        RequiredBoxProps,
-        | 'accessibilityLabel'
-        | 'accessibilityRole'
-        | 'accessibilityVisibility'
-        | 'background'
-        | 'blockSize'
-        | 'border'
-        | 'borderColor'
-        | 'borderRadius'
-        | 'borderStyle'
-        | 'borderWidth'
-        | 'display'
-        | 'inlineSize'
-        | 'maxBlockSize'
-        | 'maxInlineSize'
-        | 'minBlockSize'
-        | 'minInlineSize'
-        | 'overflow'
-      > {
-    background: Extract<
-        RequiredBoxProps['background'],
-        'transparent' | 'base' | 'subdued' | 'strong'
-        >;
-    borderWidth: | MaybeAllValuesShorthandProperty<
-            Extract<
-              RequiredBoxProps['borderWidth'],
-              'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'none'
-            >
-          >
-        | Extract<RequiredBoxProps['borderWidth'], ''>;
-    borderStyle: | MaybeAllValuesShorthandProperty<BoxBorderStyles>
-        | Extract<RequiredBoxProps['borderStyle'], ''>;
-    borderColor: Extract<
-        RequiredBoxProps['borderColor'],
-        'subdued' | 'base' | 'strong' | ''
-        >;
-    borderRadius: MaybeAllValuesShorthandProperty<BoxBorderRadii>;
-    /**
-     * Adjust the padding of all edges.
-     *
-     * 1-to-4-value syntax (@see https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is
-     * supported. Note that, contrary to the CSS, it uses flow-relative values and the order is:
-     *
-     * - 4 values: `block-start inline-end block-end inline-start`
-     * - 3 values: `block-start inline block-end`
-     * - 2 values: `block inline`
-     *
-     * For example:
-     * - `large` means block-start, inline-end, block-end and inline-start paddings are `large`.
-     * - `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.
-     * - `large none large` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `none`.
-     * - `large none large small` means block-start padding is `large`, inline-end padding is `none`, block-end padding is `large` and inline-start padding is `small`.
-     *
-     * A padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.
-     *
-     * `padding` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 4 values (e.g. `@container (inline-size > 500px) large-300 small-300 large-100 small-100, small-200`)
-     *
-     * @default 'none'
-     */
-    padding: ResponsiveBoxProps['padding'];
-    /**
-     * Adjust the block-padding.
-     *
-     * - `large none` means block-start padding is `large`, block-end padding is `none`.
-     *
-     * This overrides the block value of `padding`.
-     *
-     * `paddingBlock` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingBlock: ResponsiveBoxProps['paddingBlock'];
-    /**
-     * Adjust the block-start padding.
-     *
-     * This overrides the block-start value of `paddingBlock`.
-     *
-     * `paddingBlockStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockStart: ResponsiveBoxProps['paddingBlockStart'];
-    /**
-     * Adjust the block-end padding.
-     *
-     * This overrides the block-end value of `paddingBlock`.
-     *
-     * `paddingBlockEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This only accepts up to 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     * @default '' - meaning no override
-     */
-    paddingBlockEnd: ResponsiveBoxProps['paddingBlockEnd'];
-    /**
-     * Adjust the inline padding.
-     *
-     * - `large none` means inline-start padding is `large`, inline-end padding is `none`.
-     *
-     * This overrides the inline value of `padding`.
-     *
-     * `paddingInline` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     *
-     * This also accepts up to 2 values (e.g. `@container (inline-size > 500px) large-300 small-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInline: ResponsiveBoxProps['paddingInline'];
-    /**
-     * Adjust the inline-start padding.
-     *
-     * This overrides the inline-start value of `paddingInline`.
-     *
-     * `paddingInlineStart` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineStart: ResponsiveBoxProps['paddingInlineStart'];
-    /**
-     * Adjust the inline-end padding.
-     *
-     * This overrides the inline-end value of `paddingInline`.
-     *
-     * `paddingInlineEnd` also accepts a container query string with the supported PaddingKeyword as a query value e.g. (`@container (inline-size > 500px) large-300, small-300`)
-     * This only accepts 1 value per predicate (e.g. `@container (inline-size > 500px) large-300, small-200`)
-     *
-     * @default '' - meaning no override
-     */
-    paddingInlineEnd: ResponsiveBoxProps['paddingInlineEnd'];
-}
-
-declare const BoxtagName = 's-box';
-declare const BoxBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [BannertagName]: Omit<BannerJSXProps, 'secondaryActions'> & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [BannertagName]: Banner;
-    }
-}
-
-export interface BannerJSXProps extends Partial<BannerProps>, Pick<BannerProps$1, 'id'> {
-    /**
-     * The secondary actions to display at the bottom of the banner.
-     *
-     * A maximum of two `s-button` components are allowed, and only buttons with the `variant` of "secondary" are permitted.
-     */
-    secondaryActions?: ComponentChild;
-    onDismiss?: ((event: CallbackEvent<typeof BannertagName>) => void) | null;
-    onAfterHide?: ((event: CallbackEvent<typeof tagName>) => void) | null;
-}
-
-export interface BannerClickOptions {
-    /**
-     * The event you want to influence the synthetic click.
-     */
-    sourceEvent?: BannerActivationEventEsque;
-}
-
-export interface BannerActivationEventEsque {
-    shiftKey: boolean;
-    metaKey: boolean;
-    ctrlKey: boolean;
-    button: number;
-}
-
-export interface BannerProps extends Pick<
-        RequiredBannerProps,
-        'heading' | 'dismissible' | 'hidden' | 'tone'
-      > {
-    tone: Extract<
-        RequiredBannerProps['tone'],
-        'auto' | 'critical' | 'warning' | 'success' | 'info'
-        >;
-}
-
-declare const BannertagName = 's-banner';
-declare const BannerBaseClass: typeof globalThis.HTMLElement;
-
-declare module 'preact' {
-    interface BaseProps {
-        children?: preact.ComponentChildren;
-        slot?: Lowercase<string>;
-    }
-
-    namespace createElement.JSX {
-        interface IntrinsicElements {
-            [tagName]: BadgeJSXProps & BaseProps;
-        }
-    }
-}
-
-declare global {
-    interface HTMLElementTagNameMap {
-        [tagName]: Badge;
-    }
-}
-
-export interface BadgeJSXProps extends Partial<BadgeProps>, Pick<BadgeProps$1, 'id'> {
-}
-
-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 BadgeProps extends Pick<BadgeProps$1, 'color' | 'size' | 'tone'> {
-    color: Extract<BadgeProps$1['color'], 'base' | 'strong'>;
-    icon: IconProps['type'] | '';
-    size: Extract<BadgeProps$1['size'], 'base' | 'large' | 'large-100'>;
-    tone: Extract<
-        BadgeProps$1['tone'],
-        'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical'
-        >;
-}
-
-export interface IconProps extends Pick<IconProps$1, 'type' | 'tone' | 'color' | 'size'> {
-    /**
-     * Specifies the type of icon that will be displayed.
-     */
-    type: '' | IconType | 'empty';
-    tone: Extract<
-        IconProps$1['tone'],
-        'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical'
-        >;
-    color: Extract<IconProps$1['color'], 'base' | 'subdued'>;
-    size: Extract<IconProps$1['size'], 'small' | 'base'>;
-}
-
-declare const tagName = 's-badge';
-/**
- * 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;
-
-import { AdminPrintAction } from "../../../../../src/surfaces/admin/components/AdminPrintAction";
-import { Badge, RenderImpl } from "../../../../../src/surfaces/admin/components/Badge";
-import { Banner, CallbackEvent, 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";
-import { Choice } from "../../../../../src/surfaces/admin/components/Choice";
-import { ChoiceList } from "../../../../../src/surfaces/admin/components/ChoiceList";
-import { Clickable, ClickableBaseProps } from "../../../../../src/surfaces/admin/components/Clickable";
-import { DatePicker } from "../../../../../src/surfaces/admin/components/DatePicker";
-import { Divider } from "../../../../../src/surfaces/admin/components/Divider";
-import { EmailField, EmailFieldProps, PreactFieldProps } from "../../../../../src/surfaces/admin/components/EmailField";
-import { Grid, ResponsiveGridProps } from "../../../../../src/surfaces/admin/components/Grid";
-import { GridItem, RequiredGridItemProps } from "../../../../../src/surfaces/admin/components/GridItem";
-import { Heading, RequiredHeadingProps } from "../../../../../src/surfaces/admin/components/Heading";
-import { Icon } from "../../../../../src/surfaces/admin/components/Icon";
-import { Link, RequiredLinkProps } from "../../../../../src/surfaces/admin/components/Link";
-import { ListItem } from "../../../../../src/surfaces/admin/components/ListItem";
-import { MoneyField, RequiredMoneyFieldProps } from "../../../../../src/surfaces/admin/components/MoneyField";
-import { NumberField } from "../../../../../src/surfaces/admin/components/NumberField";
-import { OptionGroup } from "../../../../../src/surfaces/admin/components/OptionGroup";
-import { OrderedList } from "../../../../../src/surfaces/admin/components/OrderedList";
-import { Paragraph } from "../../../../../src/surfaces/admin/components/Paragraph";
-import { PasswordField, PasswordFieldProps } from "../../../../../src/surfaces/admin/components/PasswordField";
-import { RequiredSectionProps, Section } from "../../../../../src/surfaces/admin/components/Section";
-import { Select } from "../../../../../src/surfaces/admin/components/Select";
-import { AdminPrintActionProps$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, 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 { 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";
-import { TableBody } from "../../../../../src/surfaces/admin/components/TableBody";
-import { TableCell } from "../../../../../src/surfaces/admin/components/TableCell";
-import { TableHeader } from "../../../../../src/surfaces/admin/components/TableHeader";
-import { TableHeaderRow } from "../../../../../src/surfaces/admin/components/TableHeaderRow";
-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 { UnorderedList } from "../../../../../src/surfaces/admin/components/UnorderedList";
-import { URLField, URLFieldProps } from "../../../../../src/surfaces/admin/components/URLField";
+import "../components/AdminPrintAction.d.ts";
+import "../components/Avatar.d.ts";
+import "../components/Badge.d.ts";
+import "../components/Banner.d.ts";
+import "../components/Box.d.ts";
+import "../components/Button.d.ts";
+import "../components/ButtonGroup.d.ts";
+import "../components/Checkbox.d.ts";
+import "../components/Chip.d.ts";
+import "../components/Choice.d.ts";
+import "../components/ChoiceList.d.ts";
+import "../components/Clickable.d.ts";
+import "../components/ClickableChip.d.ts";
+import "../components/DatePicker.d.ts";
+import "../components/Divider.d.ts";
+import "../components/EmailField.d.ts";
+import "../components/Grid.d.ts";
+import "../components/GridItem.d.ts";
+import "../components/Heading.d.ts";
+import "../components/Icon.d.ts";
+import "../components/Image.d.ts";
+import "../components/Link.d.ts";
+import "../components/ListItem.d.ts";
+import "../components/Menu.d.ts";
+import "../components/MoneyField.d.ts";
+import "../components/NumberField.d.ts";
+import "../components/Option.d.ts";
+import "../components/OptionGroup.d.ts";
+import "../components/OrderedList.d.ts";
+import "../components/Paragraph.d.ts";
+import "../components/PasswordField.d.ts";
+import "../components/QueryContainer.d.ts";
+import "../components/Section.d.ts";
+import "../components/Select.d.ts";
+import "../components/Spinner.d.ts";
+import "../components/Stack.d.ts";
+import "../components/Table.d.ts";
+import "../components/TableBody.d.ts";
+import "../components/TableCell.d.ts";
+import "../components/TableHeader.d.ts";
+import "../components/TableHeaderRow.d.ts";
+import "../components/TableRow.d.ts";
+import "../components/Text.d.ts";
+import "../components/TextArea.d.ts";
+import "../components/TextField.d.ts";
+import "../components/Thumbnail.d.ts";
+import "../components/Tooltip.d.ts";
+import "../components/UnorderedList.d.ts";
+import "../components/URLField.d.ts";
 import type { ExtensionTargets } from '../extension-targets';
+
 type Target = ExtensionTargets['admin.order-details.print-action.render'];
 export type Api = Target['api'];
 export type Output = Target['output'];
 
-export type GlobalThis = typeof globalThis & {
-  shopify: Api;
-}